Comment utiliser le bloc de codes courts de Gutenberg • WPShout

Les shortcodes WordPress peuvent ressembler à une relique de l'histoire, mais la dernière technologie du bloc Gutenberg rend l'utilisation des shortcodes plus facile que jamais. Lisez la suite pour apprendre rapidement comment utiliser un bloc de shortcode Gutenberg.

Quels sont les shortcodes WordPress?

Les shortcodes ont été créés pour supprimer la gestion manuelle de fonctionnalités particulières sur votre site Web. Par exemple, si vous souhaitez afficher les articles les plus récents ajoutés à votre site Web, il faudrait beaucoup de travail pour ajouter, réviser et mettre à jour vos données régulièrement pour en garantir l'exactitude. C’est là que les shortcodes entrent en jeu. Ils peuvent le faire pour vous.

Les shortcodes sont un petit morceau de code, indiqué par [brackets], qui peut gérer des fonctions spécifiques sans votre entrée. Les shortcodes WordPress peuvent être utilisés sur des pages, des publications et d'autres types de contenu.

Essentiellement, les raccourcis sont un raccourci pour afficher un contenu dynamique et changeant sur votre page Web. Et dès que vous apprendrez à utiliser un bloc de shortcode Gutenberg, vous vous rendrez compte que vous avez découvert un raccourci vers un raccourci!

4 étapes pour utiliser le bloc Gutenberg Shortcode

1. Trouvez le shortcode pour la fonction de plugin.

Vous voudrez avoir le shortcode pour le contenu dynamique à portée de main et prêt à l'emploi. Dans cette vidéo, je recoupe un article de Ninja Forms pour confirmer que leur shortcode est [ninja_forms id=1]. Vous voudrez avoir les informations pertinentes à portée de main pour votre contenu cible!

2. Recherchez «Shortcode» lors de l'ajout d'un nouveau bloc à Gutenberg.

Surprise, surprise, il existe un bloc Gutenberg dédié aux shortcodes! Il peut être trouvé en recherchant manuellement «shortcode» lors de l'ajout d'un nouveau bloc.

3. Collez le shortcode dans la boîte.

Tout ce qu'il faut, c'est une commande rapide / Ctrl + V et le tour est joué. Veillez à copier et coller tous les éléments du shortcode, y compris les crochets (ils sont essentiels). Enregistrez votre brouillon et sélectionnez l'aperçu pour voir s'il se déclenche correctement.

4. Astuce de pro: vous pouvez également le faire dans un bloc de paragraphe Gutenberg.

Si vous préférez insérer votre shortcode WordPress directement dans un bloc de paragraphe Gutenberg, allez-y! Tant que vous conservez tous les éléments, votre shortcode devrait toujours se déclencher correctement, avec ou sans le bloc de shortcode dédié de Gutenberg.

Transcription vidéo

Cela va être un bref résumé de ce que nous appelons les shortcodes dans WordPress, ainsi que la façon dont vous pouvez utiliser les shortcodes dans l'édition de bloc AKA de Gutenberg. Tout d'abord, je dois donner un bref historique si vous êtes nouveau dans tout cela.

Avant d'avoir cet éditeur de blocs sympa où je pouvais faire une bonne chose comme cliquer ici et être comme, oh je veux ce formulaire Ninja cool, puis sélectionnez le formulaire que j'ai déjà pour le mettre là-dedans, nous devions utiliser ce type de technologie désuète appelée shortcode.

La façon dont un shortcode a fonctionné est que je mets des crochets dans le texte de mon article quelque part, je l'ai approximé ici avec cette balise p, puis je devrai peut-être transmettre d'autres paramètres à ce code court. Ce qui se passerait en arrière-plan, c'est que j'aurais un plugin qui aurait enregistré ce shortcode «Prix du café de David» et qu'il calculerait, par exemple, le coût du café aujourd'hui sur Amazon, et retirerait ces données et les montrerait dans cet article . Cela arrive plutôt que moi, en tant qu'éditeur de ce site, d'avoir à maintenir manuellement ces données quotidiennement en les tapant tous les jours.

Un shortcode WordPress pourrait gérer le tout.

Cette histoire à l'écart, comme je l'ai mentionné, aujourd'hui, vous vous attendez à ce qu'il y ait peut-être déjà un shortcode que j'écris et il y a beaucoup de raisons pour lesquelles la meilleure chose à faire est de créer un tout nouveau bloc. Si vous êtes un développeur, créer un nouveau bloc est la bonne chose, mais si vous ne l'êtes pas, vous devrez peut-être encore utiliser le shortcode pour plusieurs raisons.

Et, surprise surprise, il y a un bloc de shortcode Gutenberg dans WordPress!

Ce que je ferais, c'est de mettre quelque chose comme «David's Coffee Price», et puisque c'est un shortcode composé que j'utilise, donc nous ne verrons pas ce travail ici, mais c'est le concept de base qui va quand j'en parle. Je vais donc écrire rapidement "Calculateur de prix du café". Je vais enregistrer rapidement ce message, puis nous pourrons voir comment il se comporte. Et nous verrons qu'il n'y a pas de shortcode ici, ni dans mon contenu ni ici-bas, a-t-il été corrigé, alors utilisons autre chose.

Nous avons un formulaire Ninja sur ce site, et Ninja Forms le prend également en charge. Le shortcode Ninja Forms ressemble à ceci: [ninja_underscore id=1].

Voilà donc exactement comment vous l'écrivez dans un shortcode classique. Nous pouvons le changer ici afin que nous puissions tester: pouvons-nous mettre un shortcode manuellement dans un paragraphe comme nous le faisions autrefois, lorsque l'ensemble de l'article était effectivement un paragraphe de Gutenberg?

Donc, si j'enregistre les deux, nous pouvons voir lequel de ces éléments remplace le contenu. Et ce que nous découvrons ici, c'est que nous avons obtenu trois formulaires de contact, ce qui nous dit deux leçons importantes:

1. L'injecteur de shortcode Ninja Form fonctionne très bien. Génial!
2. Je peux également dire que je peux à la fois mettre un shortcode à l'intérieur d'un bloc de paragraphe et WordPress s'en occupe pour moi, ou je peux utiliser le bloc spécial de shortcode et cela fonctionne. Je sais que tout cela est vrai parce que quand je vais regarder mon message dans l'aperçu, je vois trois indurations différentes de mon formulaire de contact.

Les formulaires de contact étaient l'un des cas canoniques où quelqu'un nouveau dans l'apprentissage de WordPress dans le mauvais vieux temps devait comprendre ce qu'était un shortcode, nous avons maintenant arrondi cela et avons vu que Ninjaforms contient ce bloc, mais si vous êtes vous-même développeur ou quelqu'un qu'un développeur vous a remis un plugin qu'ils ont créé dans le passé et qui dit "Il y a un shortcode ici". Voilà ce que cela signifie.

Des crochets ont été ajoutés à un bloc de paragraphe, un bloc de shortcode, ou idéalement, en utilisant le nouveau bloc de shortcode Gutenberg qu'ils ont intégré dans leur plugin. C'est ainsi que fonctionnent les shortcodes dans Gutenberg. À votre santé!