Dans un précédent article, je vous avez présenté la création de shortcodes dans WordPress. L’article est toujours disponible ICI.
Aujourd’hui je souhaite vous présenter comment créer plusieurs shortcodes pour une même fonction.
Préambule
Pourquoi vouloir déclarer plusieurs shortcodes pour la même fonctionnalité ?
Et bien, il s’agit avant tout de faciliter la vie de l’utilisateur qui mettra à jour le site.
Bien entendu les shortcodes répondent déjà en partie à cette problématique. Mais n’oublions pas que même si les shortcodes sont pour nous très simple à appréhender, ce n’est pas forcément le cas de l’utilisateur qui devra s’en servir.
L’une des façon pour faciliter la construction des shortcodes est de réduire le nombre de paramètres que l’utilisateur devra mettre en place. Ce qui a également pour effet, de réduire la taille du shortcode à écrire. Plus court, plus simple.
Exemple
Partons d’un exemple concret. Il est assez régulier de permettre à l’utilisateur d’ajouter une vidéo provenant de youtube / dailymotion / vimeo dans son article.
Dans un premier temps, ce qui semblerai naturel de faire est de créer un shortcode « video » par exemple et de demander à l’utilisateur d’ajouter en paramètres le service demandé ainsi que l’id de la vidéo.
Ce qui nous emmènera donc à un code similaire à celui-ci :
function video_embed( $atts, $content = null) { extract( shortcode_atts( array( 'id' => '', 'width' => '480', 'height' => '270', 'site' => 'youtube' ), $atts ) ); switch( $site ) { case 'youtube': $src = '//www.youtube.com/embed/'. $id; break; case 'dailymotion': $src = '//www.dailymotion.com/embed/video/'. $id; break; case 'vimeo': $src = '//player.vimeo.com/video/'. $id; break; } if ( $id != '' ){ return '<iframe src="'. $src .'" width="'. $width .'" height="'. $height .'"></iframe>'; } return; } add_shortcode( 'video', 'video_embed' );
Ce qui va nous permettre de d’appeler par exemple
pour youtube ou bien
pour dailymotion.
Pour simplifier le shortcode, nous allons utiliser la paramètre $tag. Ce qui nous permet récupérer, comme son nom l’indique, le nom du tag.
Par exemple dans un shortcode tel que :
$tag retrournera « video ».
function video_embed( $atts, $content = null, $tag ) { extract( shortcode_atts( array( 'id' => '', 'width' => '480', 'height' => '270' ), $atts ) ); switch( $tag ) { case 'youtube': $src = '//www.youtube.com/embed/'. $id; break; case 'dailymotion': $src = '//www.dailymotion.com/embed/video/'. $id; break; case 'vimeo': $src = '//player.vimeo.com/video/'. $id; break; } if ( $id != '' ){ return '<iframe src="'. $src .'" width="'. $width. '" height="'. $height .'"></iframe>'; } return; } add_shortcode( 'youtube', 'video_embed' ); add_shortcode( 'dailymotion', 'video_embed' ); add_shortcode( 'vimeo', 'video_embed' );
Grâce à cette petite modification l’utilisateur pourra utiliser :
[youtube id="9h1swNWgP8Q"] [dailymotion id="x19q3h4"]
à la place des précédents :
Conclusion
Simplifier les shortcodes pour des besoin de ce type est vraiment simple et ne demande pas plus de temps / code. Alors pourquoi s’en priver ? Cela facilitera sûrement la vie de l’utilisateur finale et il le vaut bien 😉