Le shortcode est un outil puissant pour quiconque souhaite modifier le fonctionnement de son site WordPress, car les shortcodes offrent la personnalisation ultime sans vous obliger à en savoir beaucoup sur le codage en général.

Les shortcodes sont essentiellement des mots courts ou des phrases qui sont placés entre parenthèses [like-this]. Vous pouvez placer un shortcode WordPress dans l'éditeur, qui référence ensuite des informations supplémentaires dans votre fonctions.php fichier pour révéler quelque chose sur le frontend de votre site Web.

Par exemple, si vous souhaitez intégrer un fichier vidéo pour un article de blog, placez simplement des crochets [ ] autour du mot vidéo pour faire référence à une vidéo qui a été précédemment téléchargée sur votre site. Les codes abrégés sont parfaits pour créer des choses comme des boutons, des curseurs de style accordéon, des widgets Twitter, des séparateurs et toutes sortes de goodies de formatage qui vous obligeraient généralement à comprendre le codage PHP.

Les shortcodes sont destinés à vous faciliter la vie, mais pour ajouter de nouveaux shortcodes à votre site WordPress, vous devez en fait dire au système par quoi vous voulez que le shortcode soit remplacé. Examinons quelques méthodes pour ajouter de nouvelles options de shortcode WordPress afin de prendre le contrôle total de votre site.

Commencez avec les codes courts WordPress par défaut

WordPress est en fait livré avec quelques codes abrégés par défaut que vous pouvez utiliser sans rien placer dans votre fonctions.php fichier. Cliquez sur les liens ci-dessous pour en savoir plus sur les shortcodes WordPress par défaut :

L'API WordPress vous permet de générer une quantité exponentielle d'autres shortcodes, mais malheureusement, les gens ont tendance à oublier ces fonctionnalités puissantes et à ne s'en tenir qu'aux shortcodes par défaut. Lisez la suite pour voir comment vous pouvez arrêter de vous contenter de ce qui est fourni et créer des codes abrégés personnalisés pour donner à votre site l'apparence que vous souhaitez.

Comment créer un code court WordPress

Pour commencer, nous souhaitons créer un shortcode qui délivre un module Adsense en tapant simplement [adsense] dans l'éditeur.

Étape 1 : placez la fonction dans fonctions.php

Trouvez le fonctions.php fichier pour votre site WordPress, et collez la fonction suivante dans le fichier. Nous utilisons la fonction Adsense comme exemple simple. Une fonction est essentiellement la pièce qui indique au shortcode ce qu'il faut révéler sur le frontend de votre site. Dans ce cas, lorsque nous plaçons le [adsense] shortcode dans le site, il utilise la fonction suivante pour afficher une annonce.


function google_adsense() {
return '<script type="text/javascript"><!--
google_ad_client = "<em>your client id</em>";
google_ad_slot = "<em>your ad slot id</em>";
google_ad_width = <em>width</em>;
google_ad_height = <em>height</em>;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
';
}

Ce code que vous venez d'insérer dans votre fonctions.php file est ce qui remplace le shortcode sur le frontend – dans ce cas, un simple module Adsense. En fonction de votre fonction et de votre shortcode, vous pouvez ajouter des colonnes, des boutons personnalisés, des widgets de réseaux sociaux, etc.

Étape 2 : Lier votre shortcode à la fonction

Ce n'est pas parce que vous avez créé le shortcode et la fonction que les deux sont liés. Maintenant, nous devons ajouter un dernier appel pour coupler les deux. Utilisez l'appel ci-dessous :


add_shortcode('adsense', 'google_adsense');

Le premier mot est ce que vous voulez appeler votre shortcode. Ainsi, puisque nous l'avons répertorié comme “adsense”, WordPress génère automatiquement un [adsense] petit code. Nous avons appelé la fonction google_adsense afin que le deuxième paramètre de notre appel indique à WordPress qu'il doit utiliser cette fonction particulière chaque fois que vous placez le code court approprié sur votre site Web.

Gardez à l'esprit qu'il ne s'agit que de l'un des nombreux shortcodes que vous pouvez créer sur WordPress. Si vous souhaitez en générer davantage, rendez-vous sur API de shortcode WordPress.

Étape 3 : Faire fonctionner le shortcode sur votre site WordPress

Pour voir ce que votre shortcode génère sur l'interface réelle de votre site, vous devez ouvrir une page ou publier dans WordPress et placer le [adsense] shortcode dans le texte. Cliquez pour prévisualiser ce qui s'affiche sur votre site ou publiez la page ou le message pour le rendre permanent. C'est ça! Vous êtes maintenant sur la bonne voie pour gagner beaucoup de temps en utilisant des codes abrégés.

Envisagez d'utiliser des plugins de code court pour simplifier le processus

Si vous ne voulez pas jouer avec les fonctions, activez simplement un plugin pour terminer le sale boulot à votre place.

#1 Shortcodes Ultime

Shortcodes Ultime

Shortcodes Ultimate est l'une des options les plus populaires si vous ne souhaitez pas créer vous-même les shortcodes. Trouvez des codes abrégés pour les nouveaux onglets, cases, boutons, curseurs, etc. C'est bien parce que vous pouvez passer à la version premium pour recevoir des codes abrégés supplémentaires si vous commencez à les utiliser plus souvent.

Gardez à l'esprit que lorsque vous choisissez un plugin de shortcode, vous devez vous assurer que la conception est réactive afin que vous puissiez manipuler vos shortcodes sur d'autres appareils et que les shortcodes répondent réellement à divers appareils lorsqu'ils sont affichés sur le frontend.

#2 Code abrégé d'amorçage facile

Code abrégé d'amorçage facile

Easy Bootstrap Shortcode a une interface simple, ce qui est agréable pour les webmasters débutants. Il a une fonctionnalité intéressante qui vous permet de créer un shortcode dans le plugin et d'oublier de taper le shortcode dans l'éditeur. À mon avis, ce n'est pas si difficile de mettre un shortcode, mais je suppose que cela vous évite une étape supplémentaire.

Ce plugin sophistiqué vous offre également le pouvoir de désactiver le CSS du plugin. Cela vous donne la possibilité d'utiliser n'importe quel CSS personnalisé que vous avez créé vous-même. J'ai utilisé ce plugin plusieurs fois dans le passé, et le développeur le met à jour en permanence avec de nouveaux codes abrégés. C'est bien parce que vous recevez un tas de nouveaux jouets gratuits avec lesquels jouer chaque fois qu'une mise à jour est publiée.

#3 Codes abrégés CPO

Codes abrégés CPO

CPO Shortcodes n'est pas différent des autres plugins, alors n'hésitez pas à l'essayer et à voir si l'interface fonctionne mieux pour vous. Il y a plus de 30 codes abrégés inclus avec le plug-in, tels que des codes abrégés pour les barres de progression, les cartes en ligne, les membres de l'équipe, les notifications, etc.

Il a un joli créateur visuel de shortcode afin que vous puissiez voir quel est le résultat avant même de le publier sur votre site Web. Le plugin comprend également un onglet en haut de votre éditeur pour un accès facile.

#4 Codes abrégés Olevmedia

Codes abrégés Olevmedia

Olevmedia Shortcodes ajoute également un module de conception visuelle et un bouton au-dessus de l'éditeur pour vous permettre d'avoir une idée des shortcodes que vous souhaitez utiliser avant de les implémenter sur votre site. Essayez certains des shortcodes les plus cool comme les marqueurs, les tableaux, les infobox, les tableaux de prix, les logos et plus encore.

Un gros avantage est que la mise en page du shortcode est complètement réactive, donc lorsque vous publiez un article ou une page avec un shortcode, les gens peuvent le voir très bien s'ils utilisent une tablette ou un appareil mobile. Vous remarquerez également que bon nombre de ces plugins incluent des captures d'écran et des didacticiels utiles pour voir exactement à quoi ressembleront les shortcodes avant même d'avoir à installer le plugin.

J'aime parcourir les shortcodes proposés dans chaque plugin au préalable, afin de ne pas perdre de temps à installer une douzaine de plugins et à jouer avec chacun pour le comprendre.

#5 Codeur court

Codeur court

Shortcoder est une version unique du plugin de shortcode traditionnel. Au lieu de simplement fournir un tas de codes courts préemballés, il aide à développer vos propres codes courts personnalisés. Vous stockez le code HTML ou d'autres extraits dans le plugin lui-même et le liez à n'importe quel shortcode que vous voulez.

L'éditeur visuel est très agréable pour voir ce que vous créez, et il semble bien fonctionner aussi bien pour les débutants que pour les experts, puisque vous pouvez personnaliser à partir de zéro ou extraire des modèles.

Nous espérons que cet article vous a aidé à ajouter un raccourci vers votre site WordPress. Vous voudrez peut-être consulter notre guide sur la façon d'ajouter un logo personnalisé à votre site WordPress.

Partagez vos réflexions dans la section des commentaires si vous avez des questions sur les options de shortcode WordPress et comment les utiliser sur votre site. Y a-t-il des shortcodes WordPress particuliers dont vous ne pouvez pas vous passer ? Faites le nous savoir!

Laisser un commentaire