Back to Blog
Tips

Comment créer un shortcode dansWordPress

14 May 2023 11 min read Tips

Share

Un jeune homme assis à un bureau avec un ordinateur portable.

Création d'un shortcode dansWordPressest l'un des moyens efficaces d'insérer une fonction spécifique et complexe dans n'importe quelle page, publication ou widget. Les codes courts aident à simplifier le processus d’ajout de fonctionnalités sur votre site Web, réduisant ainsi le besoin de codage manuel. Cette fonctionnalité est largement utilisée dans diversWordPressthèmes et plugins, offrant aux utilisateurs une interface flexible etsite Web hautement personnalisable. Dans cet article de blog, nous vous fournirons un guide étape par étape sur la façon de créer un shortcode dansWordPress, vous permettant deajouter des fonctionnalités supplémentairesà votresite internet sans tracas.

Avantages de l'utilisation de codes courts dansWordPress

Illustration of woman analyzing financial line graphic

Codes courts dansWordPresssont incroyablement bénéfiques car ils permettent aux utilisateurs d’inclure des fonctions complexes dans leur site Web sans avoir à connaître le moindre codage. Au lieu de devoirmodifier manuellement les codeset configurations, les utilisateurs peuvent simplement insérer un shortcode et avoir leles fonctionnalités souhaitées apparaissent parfaitementsur leur site. Ils sont incroyablement utiles pour ajouter des boutons,icônes de médias sociaux, formulaires de contact, etc. sur des pages ou des publications, ce qui réduit également le besoin de plusieurs plugins. Les shortcodes facilitent également lamaintenir la cohérence tout au longle site Web en permettant aux utilisateurs de reproduire des éléments selon leurs besoins. Dans l'ensemble, les codes courts permettent d'économiser du temps et des efforts, d'améliorer les fonctionnalités du site Web et de créer une expérience plus fluide pour les utilisateurs, leur permettant de se concentrer sur le contenu plutôt que sur le codage.

Exemples de shortcodes dansWordPress

Les shortcodes sont un élément clé de toutWordPressboîte à outils de l’utilisateur car ils peuvent permettre d’ajouter des fonctionnalités à votre site Web même si vous n’êtes pas un expert en codage. Voici quelques exemples de shortcodes que vous pouvez utiliser dansWordPress:

1. Le shortcode vous permet decréez facilement des galeries d'images, affichant les images dans une disposition en grille avecdes options comme les légendes, la taille et les liens.

2. Le shortcode vous permet d'intégrer des fichiers audio,en spécifiant des options commele format, le titre et l'auteur d'un podcast ou d'un autre contenu audio.

3. Le shortcode facilite l'intégration de vidéos sur votre site, en spécifiant des options telles que l'URL du fichier vidéo, ses dimensions et s'il doit être lu automatiquement ou non.

4. Le shortcode [button] vous permet de créer des boutons avec des liens, du texte et des styles personnalisés. Vous pouvez également spécifier si le bouton doit s'ouvrir dans une nouvelle fenêtre ou un nouvel onglet.

5. Le shortcode [accordion] peut vous aider à créer du contenu de style accordéon qui peut être utilisé pour des FAQ, des informations sur les produits ou d'autres types de contenu bénéficiant d'un affichage plus compact.

Dans l’ensemble, les shortcodes peuvent constituer un moyen puissant d’ajouter des fonctionnalités à votreWordPresssite sans passer des heures à coder ou à surfer sur le Web à la recherche de plugins. Avec les bons codes courts, vous pouvez rendre votre site Web plus convivial et plus attrayant pour vos visiteurs.

Comprendre la structure de base d'un shortcode

Un shortcode est unWordPress-code spécifique qui vous permet d'exécuter des fonctions complexes et d'ajouter du contenu dynamique à votre site Web. Comprendre la structure de base d'un shortcode est important avant d'en créer un. Un typiqueWordPressle shortcode se compose dedeux crochets entourantun mot-clé qui représente la fonction ou le contenu que vous souhaitez ajouter. Par exemple, le shortcode suivant affichera l’année en cours :

[année]

Vous pouvez également transmettre des paramètres à un shortcode en utilisant les attributs dans la balise d'ouverture. Par exemple:

[quote author=”John” source=”Some Book”]C'est une excellente citation.[/quote]

Dans cet exemple, « auteur » et « source » sont deux paramètres associés au shortcode « quote ». Ces paramètres sont accessibles dans la fonction qui traite le shortcode. Enfin, les shortcodes doivent toujours être fermés par une balise de fermeture correspondante. Par exemple, si vous créez un shortcode avec la balise d'ouverture [myshortcode], vous devez toujours le fermer avec la balise de fermeture [/myshortcode].

Comprendre la structure de base d'un shortcode est essentiel avant d'en créer un. Des codes courts correctement structurés peuvent améliorer les fonctionnalités de votre site Web et améliorer l’expérience utilisateur.

Comment créer un shortcode simple dansWordPress

Pour créer un shortcode simple dansWordPress, vous pouvez suivre les étapes décrites ci-dessous :

1. Ouvrez votreWordPresstableau de bord et accédez au fichier function.php de votre thème. Vous pouvez trouver ce fichier en allant dans Apparence > Editeur de thème > Fonctions du thème.

2. Dans le fichier function.php, écrivez le code suivant :

function my_shortcode() { //votre logique de shortcode ici } add_shortcode( 'my_shortcode', 'my_shortcode' );

3. Dans le code ci-dessus, « my_shortcode » est le nom de votre fonction shortcode. Vous devriez le remplacer par le vôtrenom de shortcode souhaité.

4. La logique de votre shortcode doit être placée entre les accolades de la fonction. Vous pouvez utiliser n'importe quelWordPressfonction ou extrait de code pour créer votre logique de shortcode.

5. Enfin, enregistrez vos modifications dans le fichier function.php et utilisez le shortcode dans votreWordPresssite en tapant « [my_shortcode] » dans votre éditeur de contenu.

C'est ça! Avec ces étapes simples, vous pouvez créer votre propre shortcode personnalisé dansWordPresset utilisez-le pourajouter du contenu dynamiqueà votre site.

Ajouter des attributs à un shortcode

how to create shortcode in wordpress

L'ajout d'attributs à un shortcode est essentiel car cela peut vous aider à modifier le comportement du shortcode et à le rendre plus utile. L'ajout d'attributs à un shortcode dansWordPress. Tout d’abord, nous devons définir l’attribut en l’ajoutant à la liste des paramètres de la fonction shortcode, puis nous devons utiliser la valeur de l’attribut dans la sortie de notre shortcode.

Pour définir un attribut, nous devons modifier la fonction PHP qui génère le shortcode. Supposons que nous souhaitions créer un shortcode qui affiche du texte et que nous souhaitons donner aux utilisateurs la possibilité de définir la couleur du texte. Pour ce faire, nous allons ajouter un nouveau paramètre à notre fonction shortcode comme ceci :

"\` function my_text_shortcode( $atts, $content = null ) { $a = shortcode_atts( array( 'color' => 'black', ), $atts ); return " . $contenu . "; } add_shortcode( 'my_text', 'my_text_shortcode' ); "\` Dans l'exemple ci-dessus, nous avons défini unnouveau paramètre nommé couleur, et nous avons défini sa valeur par défaut sur noir. La fonction shortcode_atts() se chargera de fusionner tous les attributs définis par l'utilisateur avec nos valeurs par défaut.

Maintenant, disons que nous voulons utiliser notre nouvel attribut color dans notre shortcode. Nous pouvons le faire en modifiant la sortie de notre shortcode, comme ceci :

« \` [my_text color="red"]Bonjour le monde ![/my_text] « \` Dans l'exemple ci-dessus, nous avons défini l'attribut de couleur sur rouge. Lorsque ce shortcode est rendu, la propriété color de la balise span sera définie sur rouge, ce qui entraînera un texte de couleur rouge.

En résumé, l’ajout d’attributs à un shortcode peut être un moyen puissant d’étendre ses fonctionnalités et de le rendre plus polyvalent. N'oubliez pas de définir l'attribut dans la liste des paramètres de la fonction shortcode, puis d'utiliser sa valeur dans la sortie du shortcode.

Utiliser les fonctions de shortcode pour ajouter des fonctionnalités personnalisées à votre shortcode

L'utilisation des fonctions de shortcode est un excellent moyen d'ajouter des fonctionnalités personnalisées à votre shortcode. Vous pouvez définir votre propre fonction shortcode en écrivant une fonction PHP, puis en la connectant àWordPressen utilisant la fonction \`add_shortcode()\`. Cela vous permet d'ajouter facilement des fonctionnalités complexes à votre shortcode sans avoir à écrire beaucoup de code.

Pour créer une fonction shortcode, vous devez définir une fonction qui sera exécutée lorsque le shortcode sera appelé. Cette fonction doit renvoyer le contenu qui sera affiché par le shortcode. La fonction devraitprend également un paramètre, qui contiendra un tableau d'attributs qui ont été transmis au shortcode.

Par exemple, disons que vous souhaitez créer un shortcode qui affiche une liste de vos publications les plus récentes. Vous pourriez définir une fonction comme celle-ci :

« \` function my_recent_posts_shortcode( $atts ) { $atts = shortcode_atts( array( 'posts' => 5, 'order' => 'DESC' ), $atts );

$query = new WP_Query( array( 'posts_per_page' => $atts['posts'], 'orderby' => 'date', 'order' => $atts['order'] ) );

$sortie = » ;

if ( $query->have_posts() ) { $output .= '

'; }

wp_reset_postdata();

renvoie $sortie ; }

add_shortcode( 'messages récents', 'my_recent_posts_shortcode' ); "\`

Dans cet exemple, nous définissons une fonction appelée \`my_recent_posts_shortcode()\` qui prend un argument, \`$atts\`. Cette fonction récupère les publications les plus récentes à l'aide d'un objet \`WP_Query\`, puis génère un balisage HTML pour une liste de ces publications. Enfin, la fonction renvoie le HTML généré.

La fonction \`add_shortcode()\` est utilisée pour accrocher cette fonction àWordPressafin que le shortcode \`[recent-posts]\` appelle cette fonction. Lorsque le shortcode est appelé,WordPressexécutera la fonction \`my_recent_posts_shortcode()\` et affichera le HTML généré.

En utilisant les fonctions de shortcode, vous pouvez ajouter un large éventail de fonctionnalités personnalisées à votre shortcode, rendant ainsi votreWordPresssite plus puissant et flexible.

Création de shortcodes imbriqués dansWordPress

Les shortcodes sont une partie essentielle deWordPress, offrant aux utilisateurs un moyen simple deinsérer des éléments dynamiquesdans leur contenu sans avoir à interagir avec le code. Les shortcodes imbriqués sont des combinaisons de deux ou plusieurs shortcodes qui permettent des fonctionnalités encore plus complexes.

Création de shortcodes imbriqués dansWordPressest un processus simple. Tout d’abord, vous devez créer le shortcode parent, qui englobera tous les shortcodes enfants. Ensuite, vous devez créer les shortcodes enfants, qui peuvent être insérés dans le shortcode parent.

Pour créer un shortcode parent, utilisez la fonction add_shortcode dans votre fichier function.php. Cette fonction prend deux paramètres : le nom du shortcode et une fonction de rappel. La fonction de rappel doit renvoyer le code HTML ou PHP du shortcode parent.

Pour créer un shortcode enfant, vous pouvez utiliser la même fonction que pour le shortcode parent. La seule différence est que vous devez insérer lecode shortcode enfant à l'intérieurle code shortcode parent. Vous pouvez le faire en utilisant lefonction do_shortcode à l'intérieurla fonction de rappel du shortcode parent.

Une fois que vous avez créé les shortcodes parent et enfant, vous pouvez les utiliser pour ajouter des fonctionnalités complexes à votreWordPresssite web. Par exemple, vous pouvez créer un shortcode parent qui génère une table des matières pour un article de blog et des shortcodes enfants qui créent des titres et des sous-titres dans la table des matières.

Dans l’ensemble, la création de shortcodes imbriqués dansWordPressnécessite un peu de connaissances en codage mais ouvre de nouvelles possibilités pourajout de contenu dynamiqueà votre site Web. Avec un peu de créativité, vous pouvez utiliser des shortcodes imbriqués pour créer votreWordPressle site Web se démarque de la foule.

Meilleures pratiques pour créer et utiliser des shortcodes dansWordPress

Les codes courts sont unfonctionnalité incroyablement pratiquedansWordPress. Ce sont essentiellement des raccourcis qui vous permettent deinsérer directement du code complexedans vos articles ou pages sans avoir à mémoriser ou à saisir vous-même l'intégralité du code. Cependant, il est important de les utiliser correctement pour s’assurer qu’ils ne causent pas de problèmes ou de conflits avec votre site.

Une bonne pratique pour créer des shortcodes consiste à s’assurer que le nom du shortcode est unique et descriptif. Cela évitera tout conflit avec d’autres plugins ou thèmes qui pourraient également utiliser des codes courts. De plus, il vous sera plus facile de vous souvenir de ce que fait le shortcode s'il a un nom clair et pertinent.

Un autre conseil est de garder le code court simple et bien structuré. Votre shortcode ne doit contenir que le code nécessaire pour remplir la fonction prévue. Évitez d'ajouter du code inutile ou redondant, car cela peut ralentir votre site Web et provoquer des conflits avec d'autres plugins.

Enfin, il est important de tester vos shortcodes dans différents scénarios et avec différents types de contenu. Cela garantira que le shortcode fonctionne correctement et ne cassera pas votre site. Gardez toujours à l’esprit que votre shortcode ne doit pas interférer avec le fonctionnement global de votre site Web et doit être conçu pour fournir une interface rationalisée et fluide.expérience utilisateur efficace.

We Respect Your Privacy

We use cookies to improve your browsing experience, serve personalised ads or content, and analyse our traffic. By clicking "Accept All", you consent to our use of cookies. Cookie Policy

Powered by WPDConsent