Gli shortcode di WordPress possono essere considerati delle macro il cui codice viene eseguito da WordPress quando incontra una stringa come [shortcode]
. In questo articolo vedremo come creare gli shortcode.
Uno shortcode viene definito in genere nel file functions.php
di un tema o all'interno di un plugin. Esso è costituito da due parti:
- La funzione di riferimento.
- La chiamata ad
add_shortcode()
.
Esempio:
function my_shortcode() {
//...
}
add_shortcode('my-shortcode', 'my_shortcode');
La funzione add_shortcode()
riceve come primo parametro il nome del nuovo shortcode e come secondo parametro il nome della funzione di riferimento. Una volta definito uno shortcode possiamo usarlo nei nostri post o pagine. Nel nostro esempio scriveremo [my-shortcode]
.
Una caratteristica della funzione di riferimento è che in tale funzione va sempre restituito un valore tramite l'istruzione return
. Al contrario, non va mai usato il costrutto echo
:
function my_shortcode() {
$html = '<p>Test.</p>';
return $html;
}
add_shortcode('my-shortcode', 'my_shortcode');
Usando adesso il nostro shortcode otterremo:
<p>Test.</p>
Ma la funzione di riferimento accetta anche parametri che diventano automaticamente parametri dello shortcode, ossia [my-shortcode parametro1="valore" parametro2="valore"]
. Questo è il segreto dell'utilità degli shortcode in WordPress.
Altra caratteristica è la possibilità di accettare del contenuto, come ad esempio [my-shortcode]Contenuto[/my-shortcode]
. In questo caso la sintassi dello shortcode è identica a quella HTML.
Ecco un esempio:
function my_shortcode($atts, $content = null) {
global $post;
$id = $post->ID;
$image_id = get_post_thumbnail_id($id);
$image_url = wp_get_attachment_image_src($image_id);
$src = $image_url[0];
extract( shortcode_atts( array(
'title' => '', // default
'class' => '', // default
), $atts ) );
$html = '<figure>';
$html .= '<img src="' . $src . '" title="' . $title . '" class="' . $class . '"/>';
$html .= (!is_null($content)) ? '<figcaption>' . $content . '</figcaption>' : '';
$html .= '</figure>';
return $html;
}
add_shortcode('my-shortcode', 'my_shortcode');
La funzione di WordPress shortcode_atts()
viene usata con la funzione extract()
in modo che i valori dell'array associativo diventino variabili che possono essere utilizzate nello shortcode. Le variabili avranno lo stesso nome delle chiavi dell'array.
Un output di questo shortcode scritto come [my-shortcode title="Test" class="Test"]Test[/my-shortcode]
potrebbe essere:
<figure>
<img src="http://sito/wp-content/uploads/2012/10/thumb.jpg" title="Test" class="Test"/>
<figcaption>Test</figcaption>
</figure>
Potete trovare maggiori informazioni nella documentazione ufficiale.