Comment ajouter un shortcode dans WordPress? (Guide du débutant)

Les codes courts constituent un moyen simple d’ajouter du contenu dynamique dans vos publications, pages et barres latérales WordPress.

De nombreux plugins et thèmes WordPress utilisent des codes abrégés pour ajouter du contenu spécialisé tel que des formulaires de contact, des galeries d'images, des curseurs, etc.

Dans cet article, nous allons vous montrer comment ajouter facilement un shortcode dans WordPress. Nous vous montrerons également comment créer vos propres codes courts personnalisés dans WordPress.

Ajout d'un shortcode dans WordPress

Que sont les codes courts?

Les raccourcis dans WordPress sont des raccourcis de code qui vous aident à ajouter un contenu dynamique dans les publications, les pages et les widgets de la barre latérale de WordPress. Ils sont affichés entre crochets comme ceci:

(myshortcode)

Pour mieux comprendre les codes abrégés, examinons en détail pourquoi ils ont été ajoutés.

WordPress filtre tout le contenu pour s'assurer que personne n'utilise les publications et le contenu de la page pour insérer du code malveillant dans la base de données. Cela signifie que vous pouvez écrire du HTML de base dans vos publications, mais vous ne pouvez pas écrire de code PHP.

Mais que se passe-t-il si vous souhaitez utiliser du code personnalisé dans vos publications pour afficher des publications associées, des bannières publicitaires, des formulaires de contact, des galeries, etc.?

C'est ici qu'intervient l'API Shortcode.

En gros, cela permet aux développeurs d’ajouter leur code dans une fonction, puis de l’enregistrer avec WordPress sous forme de code abrégé, afin que les utilisateurs puissent l’utiliser facilement sans connaissances en matière de programmation.

Lorsque WordPress trouve le shortcode, il lance automatiquement le code qui lui est associé.

Voyons comment ajouter facilement des codes courts dans vos publications et pages WordPress.

Ajouter un shortcode dans les publications et pages WordPress

Tout d'abord, vous devez modifier le message et la page où vous souhaitez ajouter le shortcode. Après cela, vous devez cliquer sur le bouton Ajouter un bloc pour insérer un bloc de shortcode.

Ajouter un bloc de shortcode dans WordPress

Après avoir ajouté le bloc de shortcode, vous pouvez simplement entrer votre shortcode dans les paramètres du bloc. Le shortcode sera fourni par divers plugins WordPress que vous pourriez utiliser, tels que WPForms pour les formulaires de contact, OptinMonster pour les formulaires de marketing par courrier électronique, le bouton d'appel WP pour insérer un bouton cliquer pour appeler, etc.

Insérer un shortcode dans l'éditeur de blocs

Pour en savoir plus sur l’utilisation des blocs, consultez notre didacticiel Gutenberg pour plus de détails.

Vous pouvez maintenant enregistrer votre publication ou votre page et prévisualiser vos modifications pour voir le shortcode en action.

Ajouter un shortcode dans les widgets WordPress Sidebar

Vous pouvez également utiliser des codes courts dans les widgets de la barre latérale de WordPress. Il suffit de visiter le Apparence »Widgets page et ajoutez le widget "Texte" à une barre latérale.

Maintenant, vous pouvez coller votre shortcode dans la zone de texte du widget.

Ajout d'un shortcode dans le widget de la barre latérale

N’oubliez pas de cliquer sur le bouton "Enregistrer" pour enregistrer les paramètres de votre widget.

Après cela, vous pouvez visiter votre site Web WordPress pour voir l'aperçu en direct du shortcode dans le widget de la barre latérale.

Ajout d'un shortcode dans l'ancien éditeur WordPress Classic

Si vous utilisez toujours l'ancien éditeur classique dans WordPress, voici comment ajouter des codes abrégés à vos publications et pages WordPress.

Il vous suffit de modifier le message et la page où vous souhaitez ajouter le shortcode. Vous pouvez coller le shortcode n'importe où dans l'éditeur de contenu à l'endroit où vous souhaitez qu'il soit affiché. Assurez-vous simplement que le shortcode est dans sa propre ligne.

Shortcode éditeur classique

N'oubliez pas de sauvegarder vos modifications. Après cela, vous pouvez prévisualiser votre article et votre page pour voir le shortcode en action.

Comment ajouter un shortcode dans les fichiers de thème WordPress

Les codes courts sont destinés à être utilisés dans les publications, les pages et les widgets WordPress. Cependant, vous souhaiterez parfois utiliser un shortcode dans un fichier de thème WordPress.

WordPress facilite cette tâche, mais vous devrez modifier vos fichiers de thème WordPress. Si vous ne l’avez jamais fait auparavant, consultez notre guide sur la copie et le collage de code dans WordPress.

Fondamentalement, vous pouvez ajouter un shortcode à n’importe quel modèle de thème WordPress en ajoutant simplement le code suivant.


WordPress va maintenant rechercher le shortcode et afficher sa sortie dans votre modèle de thème.

Comment créer votre propre Shortcode personnalisé dans WordPress

Les codes abrégés peuvent être très utiles lorsque vous souhaitez ajouter du contenu dynamique ou du code personnalisé dans la publication et les pages WordPress. Toutefois, si vous souhaitez créer un shortcode personnalisé, cela nécessite une certaine expérience de la programmation.

Si vous êtes à l'aise avec l'écriture de code PHP, voici un exemple de code que vous pouvez utiliser comme modèle.

// function that runs when shortcode is called
function wpb_demo_shortcode() { 

// Things that you want to do. 
$message = 'Hello world!'; 

// Output needs to be return
return $message;
} 
// register shortcode
add_shortcode('greeting', 'wpb_demo_shortcode'); 

Dans ce code, nous avons d’abord créé une fonction qui exécute du code et renvoie la sortie. Après cela, nous avons créé un nouveau code abrégé appelé ‘salutation’ et demandé à WordPress d’exécuter la fonction que nous avons créée.

Vous pouvez maintenant utiliser ajouter ce shortcode à vos publications, pages et widgets à l'aide du code suivant:

(salutation)

Il exécutera la fonction que vous avez créée et affichera la sortie souhaitée.

Voyons maintenant une utilisation plus pratique d’un shortcode. Dans cet exemple, nous allons afficher une bannière Google AdSense dans un shortcode.




// La fonction shortcode
fonction wpb_demo_shortcode_2 () {

// Code de publicité collé dans une variable
$ string. = '

';

// Code d'annonce renvoyé
return $ string;

}
// Enregistrer le shortcode
add_shortcode ('mon_ad_code', 'wpb_demo_shortcode_2'); 

N'oubliez pas de remplacer le code d'annonce par votre propre code d'annonce.

Vous pouvez maintenant utiliser le shortcode (my_ad_code) dans vos publications, pages et widgets de barre latérale WordPress. WordPress exécutera automatiquement la fonction associée au shortcode et affichera le code de publicité.

Codes courts vs blocs de Gutenberg

Les utilisateurs nous posent souvent des questions sur les différences entre le shortcode et les nouveaux blocs de Gutenberg.

En gros, si vous trouvez des codes courts utiles, vous adorerez les blocs de l'éditeur WordPress. Les blocs vous permettent de faire la même chose, mais de manière plus conviviale.

Au lieu d’obliger les utilisateurs à ajouter un code court pour l’affichage du contenu dynamique, les blocs permettent aux utilisateurs d’ajouter du contenu dynamique dans les messages / pages avec une interface utilisateur plus intuitive. Un grand nombre de plugins WordPress populaires optent pour l’utilisation de blocs Gutenberg au lieu de codes courts, car ils sont plus conviviaux pour les débutants.

Nous avons rassemblé une liste des plugins blocs Gutenberg les plus utiles que vous puissiez essayer pour WordPress.

Si vous souhaitez créer vos propres blocs Gutenberg personnalisés, vous pouvez suivre notre didacticiel pas à pas sur la création de blocs Gutenberg personnalisés dans WordPress.

Nous espérons que cet article vous a aidé à apprendre comment ajouter un shortcode dans WordPress. Vous voudrez peut-être aussi consulter notre guide sur les meilleurs plugins de création de page WordPress par glisser-déposer et sur la façon de créer un thème WordPress personnalisé sans écrire de code.

Si vous avez aimé cet article, abonnez-vous à nos tutoriels vidéo sur la chaîne YouTube pour WordPress. Vous pouvez aussi nous trouver sur Twitter et Facebook.

Le post Comment ajouter un shortcode dans WordPress? (Guide du débutant) est apparu en premier sur themestotal.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *