Codice breve di WordPress

Letteralmente, shortcode significa “codice breve” o “pezzo di codice”. Si tratta di un tipo di codice che viene utilizzato con i ganci e che i webmaster implementano sul loro sito per integrare nuove funzionalità

Con una quota di mercato di quasi 60,8 %wordPress è il sistema di gestione dei contenuti più diffuso al mondo

È open source e dispone di una moltitudine di funzioni, tra cui gli shortcode

Si tratta di un componente che le permette di aggiungere funzionalità complesse al suo sito web, senza la necessità di competenze di programmazione

  • Che cos’è uno shortcode?
  • Come funziona?
  • Come lo usa?

Queste sono le diverse domande che affronterò in questo articolo.

Cominciamo!

Capitolo 1: Che cos’è uno shortcode di WordPress?

In questa prima parte, spiegherò più chiaramente il significato dell’espressione Shortcode

Poi, si tratterà di mostrarle come :

  • Sono importanti;
  • I vantaggi che portano;
  • Ma anche gli svantaggi che comportano

1.1. Shortcode di WordPress: cos’è?

Come sa, WordPress le offre una pluralità di funzionalità per la personalizzazione del suo sito web

Infatti, oltre alle estensioni, ai plugin, ai temi e ai widget, WordPress le permette anche di modificare il suo sito integrando gli “Shortcode” nel suo sito web.

Questi sono anche conosciuti come

  • “Snippet di codice”;
  • “Codice piccolo”
  • “Snippet di codice”;
  • “Shortcode” ;
  • Ecc.

Questi “snippet di codice” o Shortcodes sono stati introdotti su WordPress a partire dal suo versione 2.5. nel 2008

Tuttavia, un concetto simile esisteva già prima degli anni 2000 sui siti di forum di discussione

Infatti, la storia degli shortcode è iniziata con l’integrazione di BBCode (Bulletin Board Code) con il software di creazione di forum online (Ultimate bulletin board) nel 1998

Shortcode WordPress (1)

Tornando a WordPress, va detto che lo scopo dell’implementazione degli shortcode è quello di eseguire determinate funzionalità nei post o sul sito web.

Backend shortcode api frontend

Ciò significa che gli shortcode hanno circa la stessa potenza di molte linee di codice, ma a differenza di queste, sono molto più facili da usare

Questo perché sono un’alternativa al fatto che WordPress impedisce l’esecuzione di PHP nei contenuti del sito per motivi di sicurezza.

I webmaster possono utilizzarli anche se non hanno molte conoscenze di programmazione web. Possono aggiungere

  • Calendari
  • Crei un modulo;
  • Crei un cursore reattivo;
  • Aggiungere grafica o altre funzionalità senza scrivere una sola riga di codice

Quindi, prima di andare avanti, è importante dire quali sono le caratteristiche degli shortcodes di wordpress.

1.2. quali sono le caratteristiche dello shortcode di WordPress?

La particolarità degli shortcode in WordPress si trova essenzialmente a due livelli

  • Sono codici inseriti tra parentesi quadre []
  • Sono semplici e facili da usare, a differenza dei codici lunghi

Il linguaggio è semplice e facile da capire. Non richiedono quasi nessuna conoscenza di programmazione.

Inoltre, ricordiamo che esistono due categorie di shortcode su WordPress.

Les types de codes courts

Ci sono infatti

  • Shortcodes a chiusura automatica questo è ad esempio lo shortcode [capture]. Non ha bisogno di un tag di chiusura. Le diverse opzioni vengono aggiunte grazie agli attributi
  • E chiusura dei codici brevi questi sono shortcode che necessitano di un tag di chiusura. Questi codici brevi di solito manipolano il contenuto che esiste tra i tag di apertura e di chiusura. Come esempio, si ha lo shortcode di incorporamento: [incoporer]….[/incoporer]

1.3. Perché sono importanti?

Come sa, gli shortcode di WordPress le permettono di aggiungere funzioni interessanti ai post, alle pagine e ai widget del suo sito senza dover scrivere codice

Quindi le fanno risparmiare molto tempo

Inoltre, le permettono di inserire facilmente varie funzioni nei suoi contenuti. Questo ha il vantaggio di permetterle di attirare e catturare l’attenzione degli utenti di Internet

Come tale, può essere utilizzato nel tempo come elemento che assicura il riconoscimento del suo marchio da parte degli utenti online.

Inoltre, grazie alla loro breve lunghezza, i codici brevi di WordPress non sono solo molto semplici da usare, ma anche facili da inserire e correggere

Semplificano i processi di sviluppo del suo sito, consentendo di aggiungere funzionalità complesse con poche righe di codice. Significa anche che può ricordarli senza sforzo

Inoltre, appaiono più facili da usare rispetto al codice HTML o PHP, che richiede un certo livello di conoscenza della programmazione web

Lo shortcode di WordPress le permette di inserire quanto segue sul suo sito, ad esempio

  • Forme ;
  • Pulsanti di invito all’azione; immagini o video
  • Immagini o video
  • Una galleria di immagini;
  • E molte altre cose.

Inoltre, si noti che i codici brevi possono essere personalizzati e raggruppati come un’estensione che può utilizzare in qualsiasi momento

Anche questo è un grande vantaggio, perché le permette di utilizzarli in modo stabile, ma anche di esportarli su altri siti, nel caso in cui abbia diversi siti WordPress

1.4. Cosa c’è di sbagliato nello shortcode di WordPress?

Nonostante tutti i vantaggi che ho menzionato sopra, ci sono alcune cose da tenere a mente sugli shortcode di WordPress che li rendono meno piacevoli da usare

Sebbene siano facili da usare e da integrare nel suo sito web, gli shortcode possono creare problemi per il rendering HTML del suo sito

Inoltre, la loro presenza sul suo sito in numero elevato può aumentare il carico sul suo sito web e quindi rendere difficile il caricamento rapido del sito

Come può immaginare, una situazione del genere può mettere a rischio l’intero sito web

In ogni caso, non è facile capire cosa può fare un codice breve solo guardandolo

Ora che ha un’idea di cosa sia lo shortcode, dei vantaggi e degli svantaggi che può avere, le suggerisco di imparare ancora di più su di esso nelle righe seguenti

Capitolo 2: Come funziona lo shortcode di WordPress?

In questo capitolo, discuterò

  • Come funziona lo shortcode di wordpress;
  • I codici brevi di base che si trovano su wordpress;

2.1. Come funziona lo shortcode di WordPress?

In generale, i codici sono impostati per chiedere al computer di comportarsi in un modo specifico o di eseguire compiti definiti

Si tratta della stessa logica che lo shortcode di WordPress viene utilizzato per implementare sul suo sito web. Le permette di comportarsi in un modo piuttosto che in un altro

Infatti, quando aggiunge uno shortcode di WordPress al suo contenuto web, chiede al suo sito di visualizzare una serie di elementi che non vengono visualizzati quando lei non ha incorporato nulla

Ad esempio, aggiungendo lo shortcode di WordPress che assicura l’aggiunta di un modulo o di un’immagine, si aspetta senza dubbio di visualizzare tale modulo o immagine sul suo sito web

2.2. Quali sono gli shortcode che si trovano comunemente su WordPress?

Su WordPress, si possono distinguere diversi tipi di shortcode. Ce ne sono 6 e sono forniti di default con WordPress

Su WordPress, ha a disposizione i seguenti shortcode di base

2.2.1. Audio

Loshortcode WordPress [ “audio”] (senza le virgolette) è stato integrato in WordPress dalla versione 3.6.

l audio

Viene utilizzato per aggiungere e riprodurre i file audio sul sito. Supporta 4 opzioni di base

  • src o stringa che le permette di aggiungere il formato audio
  • loop che assicura il looping o meno dell’audio;
  • autoplay che consente la riproduzione automatica
  • L’opzione di precaricamento indica il modo in cui l’audio viene caricato sulla pagina

2.2.2. Video

Integrato dalla versione 3.6 in poi, questo shortcode viene utilizzato come lo shortcode [ “audio”] (senza le virgolette) per riprodurre i video sul suo sito web

Lo shortcode video di WordPress viene utilizzato dalla formula .

Video

Ha le stesse opzioni di base dello shortcode [“audio”] (senza le virgolette) , ma ha anche opzioni come

  • Poster : indica l’immagine da visualizzare in attesa della riproduzione del video;
  • Altezza : indica l’altezza del video;
  • Larghezza: che definisce il valore del supporto.

2.2.3. Didascalia

Questo shortcode [didascalia] è utilizzato per aggiungere una didascalia a un’immagine individualmente

La formula per aggiungerla è: [didascalie] didascalia [/didascalie]

Legende

Ci sono anche 4 opzioni di base per questo shortcode. Si tratta delle seguenti opzioni

  • Identificatore questa opzione le offre la possibilità di aggiungere un identificatore HTML;
  • Classificare questa opzione le permette di personalizzare una classe;
  • Allinea: questa opzione le permette di determinare come la didascalia viene allineata all’interno del messaggio. Può essere allineato a sinistra, a destra, al centro o non allineato affatto;
  • Larghezza questa opzione le permette di determinare la larghezza della didascalia in pixel. Il suo valore deve essere maggiore o uguale a 1

2.2.4 Incorporare

Come suggerisce il nome, questo è lo Shortcode che le permette di definire la dimensione massima degli elementi che ha incorporato nel sito web

È stato aggiunto a partire dalla versione 2.9 di WordPress. Si utilizza con la seguente formula: … [/incorporazione]

Incorporer

Supporta due opzioni, ovvero: Larghezza e dimensioni. La larghezza le consente di indicare la larghezza dell’oggetto, mentre la dimensione le consente di assegnare una dimensione

2.2.5. Galleria

Si tratta di uno shortcode di WordPress che le permette di aggiungere una o più gallerie di immagini al suo sito web. Viene utilizzata in questa forma nella versione 2.5

Galerie

A partire dalla versione 3.5 di WordPress, il shortcode della galleria ha iniziato a integrare gli ID immagine predefiniti

Questo ha portato ad una nuova forma di shortcode che ora si presenta così: [ID galleria = “729 732 731 720”]

È possibile utilizzare entrambe le formule

Ma tenga presente che quando utilizza semplicemente:

, visualizza solo le immagini allegate alla pagina, mentre utilizzando lo Shortcode con l’ID incluso può includere tutte le immagini che desidera

Lo shortcode della galleria ha anche diverse opzioni.

2.2.6. Playlist

Questo shortcode WordPress [ “playlist”] (senza le virgolette) le permette di implementare un elenco di file audio e video sul suo sito

Playlist

È integrato dalla versione 3.9 di WordPress

Oltre a questi codici, WordPress offre un elenco dei codici brevi.

Oltre agli shortcode predefiniti, può anche creare e aggiungere shortcode personalizzati

Dovrà poi integrarli nel suo sito utilizzando alcuni plugin

2.3. Dove aggiungere lo shortcode di WordPress al suo sito web?

Utilizzare gli shortcode in WordPress non è una cosa difficile.

Ma prima di tutto, è necessario sapere come vengono aggiunti a un sito web

Per questo, cosa c’è di meglio che dare un’occhiata alla documentazione di WordPress su codici brevi

Una rapida occhiata a questa pagina le mostrerà che può incorporare molte funzioni nel suo sito web utilizzando gli shortcode di WordPress.

Possono essere aggiunti a diverse parti del sito

Ad esempio, possono essere aggiunti nei seguenti punti

2.3.1. Nel post o nella pagina del suo sito

Per aggiungere shortcode a un post sul suo sito WordPress

  • Vada alla scheda dei messaggi;
  • Scelga il post o la pagina a cui desidera aggiungere lo shortcode;
  • Premere modifica ;
  • Quando richiede la modifica, ora clicchi sul pulsante Aggiungi blocco e inserisca un blocco di shortcode;
  • Inserisca il suo shortcode e salvi le modifiche;
site WordPress
  • Infine, visualizzi l’anteprima per vedere come le nuove modifiche appaiono sulla sua pagina web o articolo.

2.3.2. Nei widget e nella barra laterale

Gli shortcode possono anche essere aggiunti ai widget del suo sito web

widgets disponibles

Per farlo, segua la procedura seguente

  • Vai alle apparizioni ;
  • Selezioni i widget e aggiunga il widget di testo alla barra laterale;
  • Una volta creato il widget di testo, ora sta a lei incollare il suo shortcode nell’area di testo del widget
  • Poi prema il pulsante Salva per rendere effettiva la manipolazione;
  • Vada all’indirizzo del suo sito WordPress e lo aggiorni per vedere un’anteprima delle modifiche.

2.3.3. Nel tema del suo sito web

Se la sua ambizione è quella di integrare lo Shortcode nel suo tema WordPress. Per farlo, deve prima modificare i file del suo tema WordPress

Per fare questo, una soluzione è quella di utilizzare il plugin di codice snippet di WordPress

Come suggerisce il nome, questo è un plugin che le permette di aggiungere snippet di codice al suo sito web

PHP code Snippets

Ha una funzione di commutazione del codice che disabilita il frammento di codice quando presenta errori

Si tratta quindi di una soluzione adatta che le permette di evitare di fare manipolazioni sbagliate all’interno del suo file function.php.

Con questo plugin, può aggiungere facilmente snippet di codice dall’area di amministrazione del suo sito WordPress

Per utilizzarlo, segua i passaggi indicati di seguito

  • Acceda al plugin;
  • Selezioni una nuova pagina per aggiungere il suo codice personalizzato.

Può anche aggiungere il codice direttamente al file functions del suo sito web.

Per farlo, dovrà seguire i seguenti passaggi

  • Vai all’aspetto ;
  • Scegliere l’editore
  • E clicchi su function.php nella colonna destra
  • Incolli il suo frammento di codice: la formula da utilizzare per aggiungere lo shortcode è:
Ajout du shortcode

Una volta aggiunto lo shortcode, aggiorni il suo file e verifichi che venga preso in considerazione aggiornando il suo sito web

2.3.4. Nell’intestazione e nel piè di pagina

Oltre al tema, ai widget dell’articolo o della pagina del suo sito web, lo Shortcode può essere aggiunto anche all’intestazione o al piè di pagina del suo sito web

Ajout du shortcode dans pieds de page

Per farlo, è sufficiente aggiungere il seguente codice nei file header.php o footer.php del sito web

Questo dovrebbe consentire di visualizzare lo shortcode nel punto in cui lo ha inserito

Una volta inserito, è sufficiente salvare le modifiche e visualizzare l’anteprima del suo sito per vedere come viene visualizzato lo shortcode creato quando diventa attivo

Ora che ha un’idea di come visualizzare gli shortcode presenti sul suo sito web e dove possono essere aggiunti, darò un’occhiata a come vengono creati

Capitolo 3: Come si crea uno shortcode di WordPress?

In questa sezione, imparerà a creare shortcode anche sul suo sito web.

In effetti, ci sono diversi modi per creare uno shortcode per il suo sito web.

Una possibilità è quella di utilizzare dei plugin. Un’altra possibilità potrebbe essere quella di creare lei stesso lo shortcode da zero. Ma per adottare una soluzione di questo tipo, è necessario avere una certa conoscenza della programmazione web

Qui parlerò principalmente della creazione di shortcode con l’aiuto dei plugin di WordPress

Infatti, per creare degli shortcode con WordPress, una delle soluzioni più semplici che raccomando è quella di utilizzare dei plugin.

Come tale, può utilizzare i seguenti plugin

3.1. shortcode ultimate

Questo plugin le dà la possibilità di aggiungere shortcode predefiniti al suo sito web

Per utilizzarlo, può seguire i seguenti passi

  • Trovi e installi il plugin Shortcode ultimate sul suo sito web e lo attivi;
Plugin Shortcode ultimate
  • Una volta attivato, lo vedrà visualizzato nella barra dei menu della sua dashboard;
  • Vedrà quindi un elenco di shortcode disponibili che potrà aggiungere al suo sito web;
Tous les Shortcodes
  • Clicchi su quello che desidera e modifichi le opzioni;
Selection d un shortcode
  • Copi lo shortcode e lo modifichi;
Code court
  • Si rechi alla pagina o all’elemento a cui desidera aggiungere il codice;
  • Prema il pulsante di modifica
  • Attenda la visualizzazione della pagina o dell’articolo e scelga il pulsante più;
  • Selezioni o cerchi il codice breve:
  • Clicchi su di essa per aggiungerla;
site WordPress
  • Copia e incolla il suo shortcode o lo scriva
Copier ou coller le code court
  • Quindi aggiorna le modifiche e visualizza l’anteprima per vedere se le modifiche sono state aggiunte

Oltre a questa soluzione, un’altra soluzione è quella di utilizzare il plugin “Shortcoder”

3.2. Il plugin “Shortcoder

Un altro plugin che può utilizzare per creare degli shortcode sul suo sito WordPress è il “Shortcoder

Il plugin Shortcoder le permette di creare degli shortcode personalizzati in JavaScript, HTML, php ecc.

Per utilizzarlo, deve prima installarlo e attivarlo sul suo sito WordPress

plugin Shortcoder

Una volta attivato, potrà vederlo visualizzato nella barra dei menu. Può anche accedervi dalla scheda “Crea”.

Una volta cliccato sulla scheda “Shortcoder”, potrà

  • Visualizza l’elenco dei codici brevi che ha creato;
  • Acceda allo spazio di creazione del suo Shortcode;
  • Veda i diversi tag dei suoi shortcode

Per creare il suo Shortcode, basta cliccare su “Crea Shortcode”

Verrà visualizzata una nuova finestra con i diversi campi da compilare per creare il suo Shortcode personale

Create shortcode

In generale, lo spazio di creazione del plugin Shortcode è composto da diverse parti

Per prima cosa, c’è una piccola casella intitolata “Inserisci il nome dello shortcode”. Qui deve scrivere il nome che vuole dare al suo shortcode

Poi ci sono due menu a tendina. La prima le permette di inserire i parametri del suo shortcode. Il secondo menu le permette di scegliere il tipo di editor che desidera utilizzare per scrivere il suo shortcode. Può scegliere tra tre tipi di editor.

Questi sono

  • Editor di testo ;
  • Editor di codice ;
  • O l’editor visivo.
Insert shortcode parameters

Quando sceglie un particolare tipo di editor, può vedere che le modifiche sono supportate nello spazio riservato alla ricezione del codice

Appena sotto questa funzione, si trovano le impostazioni dello Shortcode

Shortcoder

Queste impostazioni le permettono di

  • Specifichi il nome che deve essere visualizzato quando lo shortcode è attivato
  • Disabilitare temporaneamente lo Shortcode o meno;
  • Disabilita lo Shortcode per gli amministratori;
  • Scelga gli strumenti sui quali lo shortcode può essere eseguito

Infine, come ultima caratteristica, c’è lo spazio riservato al Tag. Questo è un parametro utile per le funzioni di callback.

Tags

Una volta compilati questi vari campi, avrà il suo Shortcode e potrà pubblicarlo o salvarlo come bozza

Come ho detto in precedenza in questo articolo, può anche creare il suo shortcode da zero

Per questo, dovrà utilizzare l’API Shortcode di WordPress

3.3. L’API di WordPress Shortcode

L’API degli shortcode di WordPress l’API Shortcodes è utile se desidera estendere la personalizzazione o la funzionalità del suo sito web

L’utilizzo dell’API Shortcode di WordPress le consente di creare, ad esempio, moduli unici e dinamici.

Per utilizzare l’API Shortcode, deve prima definire una funzione gestore di Shortcode.

Per farlo, è necessario il comando add_shortcode Questo comando riceve due parametri

  • Il nome del suo Shortcode
  • E una funzione di callback per lo shortcode

La funzione di callback contiene generalmente tre parametri, ma può utilizzare un numero a piacere

Si tratta dei seguenti parametri

  • atts definisce gli attributi;
  • $ contenuto il contenuto;
  • $ tag utile se desidera condividere lo shortcode tra due o più funzioni

Per saperne di più sull’API Shortcode, legga l’articolo API Shortcode articolo

Può anche leggere questo articolo di Kinsta per avere un’idea di come vengono creati gli shortcode senza plugin a livello di WordPress

Se vuole avere qualche idea su come utilizzare l’API Shortcode di WordPress, le suggerisco di leggere questo articolo di DZone articolo su alcuni utili shortcode di WordPress

In poche parole

WordPress Shortcode è una funzione di WordPress che le consente di utilizzare scorciatoie di codice nei suoi contenuti per aggiungere funzioni interessanti al suo sito web

Può essere progettato da alcuni plugin o manualmente con l’API di WordPress nel file del suo tema o nei widget

In questo articolo, ho spiegato qual è il concetto di Shortcode. Troverà anche i vantaggi degli shortcode e i consigli su come implementarli sul suo sito web

Se ha mai dovuto utilizzare uno shortcode sul suo sito web, o se ha dei problemi, non esiti a parlarne nei commenti.

Categorie C

Lascia un commento