Les Shortcodes et WordPress

blog / Techno / WordPress / Les Shortcodes et WordPress

Les Shortcodes et WordPress

21 Août, 2020 |
Les Shortcodes et WordPress 1 - Webpick

Si vous utilisez WordPress depuis un petit moment, vous avez peut-être rencontré le terme «shortcode». Bien que les shortcodes soient une fonctionnalité exceptionnellement utile dans WordPress, le nom n’est pas très explicite (du moins au début). Cela pourrait vous amener à vous demander … quels sont les shortcodes dans WordPress?

En bref, un shortcode est un petit morceau de code, indiqué par des crochets comme [ceci], qui remplit une fonction dédiée sur votre site. Vous pouvez le placer à peu près partout où vous le souhaitez, et il ajoutera une fonctionnalité spécifique à votre page, publication ou autre contenu. Par exemple, vous pouvez utiliser des shortcodes pour afficher des galeries, des vidéos ou même des listes de lecture.

Les Shortcodes dans WordPress, c’est quoi?

Puisque WordPress est une plate-forme open-source, vous pouvez la personnaliser comme vous le souhaitez. Cela inclut l’ajout de code entièrement nouveau sur votre site. Mais si vous n’êtes pas développeur, ajouter du code vous-même n’est pas vraiment possible. C’est là que les shortcodes entrent en jeu. Vous pouvez utiliser des shortcodes pour obtenir les mêmes effets, sans avoir besoin de rien savoir sur le code.

Dans WordPress, les shortcodes sont des morceaux de code tronqués qui ressemblent à ceci :

Les Shortcodes et WordPress 3 - Webpick

La plupart des shortcodes montrent clairement ce qu’ils font depuis leurs noms. Par exemple, le code ci-dessus ajoute un fichier audio à votre site. Pour l’utiliser, vous le collez dans un article ou une page et pourrez immédiatement le voir sur le front-end. Dans les coulisses, le shortcode indique à WordPress d’exécuter une section de code plus longue dans l’un des fichiers de votre site – mais ce processus ne nécessite aucune autre entrée de votre part.

À ce stade, vous vous demandez peut-être plus que “Quels sont les codes courts dans WordPress?”. Vous allez vouloir aussi savoir d’où viennent ces shortcodes et comment les trouver.

Il existe plusieurs shortcodes intégrés par défaut à WordPress, dont nous parlerons sous peu. Mais au-delà de cela, de nombreux plugins ajoutent également leurs propres shortcodes, dont vous pourriez avoir besoin pour les faire fonctionner.

Comment utiliser les shortcodes sur mon site WordPress?

Maintenant que vous pouvez répondre à la question «Que sont les shortcodes dans WordPress?», Il est temps de discuter de la manière de les utiliser réellement. Pour commencer, examinons rapidement les shortcodes intégrés par défaut sur WordPress:

  • audio : intègre les fichiers audio et active la lecture.
  • caption : vous permet d’encapsuler les légendes autour du contenu.
  • embed : permet de définir les dimensions maximales d’un élément intégré (comme une image ou une publication sur les réseaux sociaux).
  • gallery : ajoute une galerie d’images personnalisable à votre site.
  • playlist : crée une playlist audio ou vidéo.
  • video : place un fichier vidéo qui peut être lu.

Comme tout autre shortcode, ceux-ci peuvent être simplement copiés et collés directement sur votre site. En général, ils sont placés dans un article ou une page. Cependant, ils peuvent aller à n’importe quel endroit où vous pouvez ajouter du code via l’éditeur WordPress, comme un type de publication personnalisé – Custom Post Type – ou un widget de texte.

Vous pouvez placer un shortcode à l’aide de l’éditeur visuel ou de l’éditeur de texte :

Les Shortcodes et WordPress 5 - Webpick

Bien sûr, Tous les shortcodes ne sont pas aussi simples. En fait, certains peuvent même être personnalisés pour modifier leur façon de travailler. La plupart des développeurs qui incluent ces types de shortcodes avec leurs plugins proposent une documentation pour vous aider à les utiliser.

En général, vous effectuez vos personnalisations en utilisant des éléments appelés «paramètres» qui ressemblent à ceci:

[shortcodename parameter="example"]

Vous pouvez également créer vos propres codes courts à partir de zéro si vous vous sentez ambitieux. C’est en fait plus simple qu’il n’y paraît, WordPress fournit une documentation complète que nous allons parcourir dans le reste de cet article.

Le Shortcode API

L’API Shortcode est un ensemble simple de fonctions permettant de créer des shortcodes WordPress à utiliser dans les articles et les pages. Par exemple, le shortcode suivant (dans le corps d’un article ou d’une page) ajouterait une galerie de photos d’images jointes à ce message ou à cette page:

L’API permet aux développeurs de plugins de créer des types spéciaux de contenu (par exemple, des formulaires, des générateurs de contenu) que les utilisateurs peuvent attacher à certaines pages en ajoutant le shortcode correspondant dans le texte de la page.

L’API Shortcode facilite la création de codes courts prenant en charge des attributs comme celui-ci :

[gallery id="123" size="medium"]

Prenons un exemple rapide du code PHP requis pour créer un shortcode [foobar] :

function foobar_func( $atts ){
	return "foo and bar";
}
add_shortcode( 'foobar', 'foobar_func' );

Vous l’aurez compris, le shortcode foobar lancera l’execution de la fonction foobar_func(), qui affichera donc à la place du shortcode le texte “foo and bar”.

Pour créer un shortcode avec des attributs, vous pouvez utiliser un code similaire :

function bartag_func( $atts ) {
	$a = shortcode_atts( array(
		'foo' => 'something',
		'bar' => 'something else',
	), $atts );

	return "foo = {$a['foo']}";
}
add_shortcode( 'bartag', 'bartag_func' );

Cela crée un shortcode “[bartag]” qui prend en charge deux attributs : [“foo” et “bar”]. Les deux attributs sont facultatifs et prendront les options par défaut [foo = “something” bar = “something else”] s’ils ne sont pas fournis. Le shortcode retournera un texte sous la forme foo = {la valeur de l’attribut foo}.

Catégories

à propos

Webpick a été fondé en 2015 par Taoufik, AKA Tao. Vétéran du web à Marrakech, Tao a construit une belle équipe de spécialistes des technologies, principalement PHP et WordPress. Accaparé par les multiples projets de l’incubateur EBF (Emerging Business Factory) qu’il a confondé, Tao a laissé les rênes de Webpick à son ami et associé David à partir de 2018.

Partager cette page

À propos de l’auteur

Anas Ghamri

Anas Ghamri

Auteur

Bonjour cher lecteur ! Je suis un ingénieur basé à Marrakech, spécialisé en Front-end et la création de sites Wordpress.