Comment ajouter des boîtes de métadonnées personnalisées dans les articles et types d'articles WordPress

WordPress ajoute automatiquement des métadonnées à votre contenu, telles que la date de publication, les catégories et les étiquettes. Cependant, vous pourriez également vouloir ajouter vos propres métadonnées personnalisées.

Que vous ayez besoin de collecter des informations supplémentaires, de rationaliser votre processus éditorial ou d'améliorer l'interface utilisateur, les boîtes de métadonnées peuvent être un outil puissant pour une gestion de contenu flexible.

Chez WPBeginner, nous utilisons des boîtes de métadonnées personnalisées pour améliorer la fonctionnalité de nos articles et pages. Cela nous a donné une compréhension plus approfondie des avantages et des inconvénients de l'ajout de champs personnalisés pour l'optimisation du contenu.

Dans cet article, nous vous montrerons comment ajouter facilement des informations uniques à votre contenu en créant une boîte de métadonnées personnalisée dans WordPress.

Qu'est-ce qu'une boîte de métadonnées personnalisée dans WordPress ?

Lorsque vous créez des articles et des pages, ou des types d'articles personnalisés dans WordPress, ce contenu a généralement ses propres métadonnées. Ces métadonnées sont des informations relatives au contenu, comme la date et l'heure, le nom de l'auteur, le titre, et plus encore.

Vous pouvez également ajouter vos propres métadonnées en utilisant la boîte de champs personnalisés par défaut.

Astuce Pro : Vous ne voyez pas la boîte Champs personnalisés dans l'éditeur de publication ? Consultez notre guide sur comment corriger les champs personnalisés qui ne s'affichent pas dans WordPress.

La boîte Champs personnalisés est une bonne solution si vous souhaitez simplement ajouter des métadonnées personnalisées à quelques publications. Cependant, si vous prévoyez d'ajouter beaucoup d'informations uniques à votre contenu, il est alors judicieux de créer une boîte de métadonnées personnalisée.

En fait, de nombreux plugins WordPress populaires ajoutent des boîtes de métadonnées personnalisées à l'écran de modification des articles et des pages. Dans l'image suivante, vous pouvez voir à quel point il est facile d'ajouter des informations SEO à votre article à l'aide d'une boîte de métadonnées personnalisée fournie par AIOSEO.

Cela dit, voyons comment vous pouvez facilement ajouter des boîtes de métadonnées personnalisées dans les articles et les types d'articles WordPress.

Comment ajouter des boîtes de métadonnées personnalisées dans les articles et types d'articles WordPress

La façon la plus simple d'ajouter des boîtes de métadonnées personnalisées à WordPress est d'utiliser Advanced Custom Fields. Ce plugin vous permet d'attacher toutes sortes d'informations supplémentaires à vos articles et pages, puis d'afficher ces données aux visiteurs à l'aide d'un shortcode.

La première chose à faire est d'installer et d'activer le plugin Advanced Custom Fields. Pour plus de détails, consultez notre guide étape par étape sur comment installer un plugin WordPress.

Créer une boîte de métadonnées personnalisée

Après l'activation, visitez la page ACF » Groupes de champs depuis la barre latérale d'administration de WordPress.

Ici, cliquez sur le bouton « Ajouter ».

Vous pouvez maintenant créer les champs personnalisés qui apparaîtront dans la boîte de métadonnées.

Pour commencer, vous devrez taper un titre dans le champ qui affiche par défaut « Titre du groupe de champs ». Celui-ci apparaîtra dans l'éditeur de contenu WordPress et servira de titre à votre boîte de métadonnées.

Cela étant dit, vous devriez utiliser quelque chose de descriptif, surtout si vous gérez un blog WordPress multi-auteurs ou partagez le tableau de bord avec d'autres personnes.

Une fois cela fait, vous êtes prêt à ajouter le premier champ à votre boîte de métadonnées.

Ajouter des champs personnalisés à la boîte de métadonnées WordPress

Pour commencer, ouvrez le menu déroulant « Type de champ » et choisissez le type de champ que vous souhaitez ajouter, tel que le sélecteur de date, la case à cocher ou le champ texte.

Après cela, tapez une étiquette pour le champ.

Advanced Custom Fields affichera cette étiquette avant le champ, ce qui aidera les utilisateurs à comprendre quelles informations ils doivent saisir.

Advanced Custom Fields générera automatiquement le « Nom du champ », vous pouvez donc laisser ce champ vide.

Une fois cela fait, vous voudrez peut-être saisir une « Valeur par défaut ». Celle-ci sera ajoutée automatiquement à la page, à l'article ou au type d'article personnalisé si l'utilisateur n'ajoute pas ses propres informations.

Vous verrez peut-être plus d'options en fonction du type de champ que vous créez. Par exemple, si vous avez sélectionné « Image » dans le menu déroulant « Type de fichier », vous pouvez alors choisir le format de l'image.

La plupart de ces options s'expliquent d'elles-mêmes, vous pouvez donc suivre les instructions à l'écran pour configurer le champ personnalisé.

Lorsque vous êtes satisfait de la configuration du champ, cliquez sur le bouton « Fermer le champ » pour réduire la section.

Vous pouvez maintenant ajouter d'autres champs à la boîte méta personnalisée en cliquant sur le bouton « Ajouter un champ ».

Ensuite, configurez simplement le champ en suivant le même processus décrit ci-dessus.

Ajouter une boîte méta personnalisée à l'éditeur de contenu WordPress

Lorsque vous êtes satisfait de la configuration de la boîte méta personnalisée, vous devrez définir où et quand la boîte méta apparaîtra.

Pour ce faire, faites défiler jusqu'à la section « Paramètres », puis cliquez sur l'onglet « Règles de localisation ».

Advanced Custom Fields peut ajouter la boîte à toutes sortes de contenus. Par exemple, vous pouvez afficher la boîte méta sur des types d'articles spécifiques, des catégories, des taxonomies, des menus de navigation, et plus encore.

Utilisez simplement les menus déroulants pour choisir où la boîte méta apparaîtra dans votre tableau de bord WordPress. Par exemple, si vous acceptez les articles invités, vous voudrez peut-être ajouter la boîte à tous les articles de la catégorie « Articles invités ».

Ensuite, cliquez sur l'onglet « Présentation ».

Ici, vous pouvez choisir le style de la boîte méta, où elle apparaît sur votre blog WordPress, et où le libellé et les instructions apparaîtront.

Si vous prévoyez d'ajouter plusieurs boîtes au même endroit, vous pouvez alors modifier l'ordre dans lequel elles apparaissent en tapant dans le champ « Numéro d'ordre ».

Par exemple, afficher les boîtes méta les plus importantes vers le haut de l'écran peut améliorer votre flux de travail éditorial.

En cas de doute, vous pouvez laisser ce champ défini sur 0.

Sur cet écran, vous verrez également une liste de tous les champs que WordPress affiche habituellement sur l'écran de modification de publication.

Si vous souhaitez masquer un champ, cochez simplement sa case. Par exemple, si vous utilisez des champs personnalisés pour créer une boîte d'informations sur l'auteur, vous voudrez peut-être masquer le champ par défaut « Auteur ».

Lorsque vous êtes satisfait des modifications apportées, cliquez sur « Enregistrer les modifications » pour rendre le groupe de champs actif.

Vous avez maintenant créé avec succès une boîte méta personnalisée pour votre article, page ou type de publication personnalisé WordPress. Selon vos paramètres, vous pouvez maintenant visiter l'éditeur d'articles pour voir la boîte méta personnalisée en action.

Afficher les données de votre boîte méta personnalisée dans le thème WordPress

Vous avez maintenant ajouté avec succès une boîte de métadonnées personnalisée au tableau de bord WordPress. Toutes les informations que les utilisateurs saisissent dans la boîte de métadonnées seront stockées dans la base de données WordPress lorsqu'ils enregistreront ou publieront l'article. Cependant, ces informations n'apparaîtront pas sur votre site Web par défaut.

Dans cette optique, assurons-nous que les métadonnées personnalisées apparaissent dans votre thème WordPress afin que les visiteurs puissent les voir.

Vous pouvez le faire en utilisant un shortcode ou en modifiant les fichiers de votre thème WordPress.

Comment afficher les métadonnées personnalisées à l'aide d'un shortcode

Ajouter un shortcode dans WordPress est la méthode la plus simple et vous permet de contrôler exactement où les informations apparaissent sur votre site Web.

Par exemple, si vous avez créé un champ « Note d'étoiles », vous pouvez afficher ces informations après le titre de l'article, dans le contenu, dans le pied de page, ou n'importe où ailleurs en ajoutant simplement un shortcode.

Cependant, vous devrez ajouter manuellement un shortcode à chaque page, article ou type d'article personnalisé. Cela peut prendre beaucoup de temps et d'efforts, surtout si vous avez beaucoup de contenu.

Pour obtenir le shortcode d'un champ, allez dans ACF » Groupes de champs. Ensuite, survolez le groupe de champs que vous souhaitez afficher et cliquez sur le lien « Modifier » lorsqu'il apparaît.

Vous verrez maintenant tous les champs qui composent ce groupe.

Pour chaque champ que vous souhaitez afficher, notez la valeur dans le champ « Nom ».

Une fois cela fait, allez à la page, à l'article ou au type d'article personnalisé où vous souhaitez afficher les métadonnées personnalisées.

Vous pouvez maintenant cliquer sur l'icône « + » et taper « Shortcode ».

Lorsque le bon bloc apparaît, cliquez dessus pour l'ajouter à votre mise en page.

Vous pouvez maintenant ajouter le shortcode suivant au bloc, en veillant à remplacer "article_byline" par le nom du champ que vous souhaitez afficher.

Vous pouvez maintenant répéter ces étapes pour ajouter plusieurs champs personnalisés à l'article.

Lorsque vous êtes satisfait des modifications que vous avez apportées, cliquez sur le bouton « Publier » ou « Mettre à jour ». Maintenant, visitez simplement votre site Web WordPress pour voir les métadonnées personnalisées en action.

Comment afficher des métadonnées personnalisées en modifiant votre thème WordPress

Si vous souhaitez afficher des métadonnées personnalisées au même endroit sur chaque page, article ou type d'article personnalisé, vous pouvez ajouter du code aux fichiers de votre thème WordPress.

Cela peut vous faire gagner du temps à long terme, mais ce n'est pas la méthode la plus conviviale pour les débutants. Vous perdrez également tout le code personnalisé la prochaine fois que vous mettrez à jour votre thème WordPress, c'est pourquoi nous vous recommandons de créer un thème enfant. Vous pouvez ensuite ajouter votre code personnalisé au thème enfant.

Si vous n'avez jamais modifié les fichiers de votre thème auparavant, consultez notre guide pour débutants sur comment copier et coller du code dans WordPress.

Vous devrez modifier le fichier où vous souhaitez afficher les métadonnées personnalisées. Cela variera en fonction de votre thème, mais vous devrez généralement modifier le fichier single.php, content.php ou page.php de votre site.

Une fois que vous avez le bon fichier, vous devrez ajouter le code à l'intérieur de la boucle WordPress. Pour trouver cette boucle, recherchez simplement le code suivant qui ressemble à ceci :

	<?php while ( have_posts() ) : the_post(); ?>

Vous pouvez ensuite coller votre code après cette ligne et avant la ligne qui termine la boucle :

	<?php endwhile; // end of the loop. ?>

Par exemple, votre code de champ personnalisé devrait ressembler à ceci :

	<h2 class="article-byline"><?php the_field('article_byline'); ?></h2>

Remarquez comment nous avons enveloppé le code dans un titre h2 avec une classe CSS. Cela nous permet de formater et de styliser le champ personnalisé plus tard en ajoutant du CSS personnalisé à notre thème.

Voici un autre exemple :

<blockquote class="article-pullquote">
 
<?php the_field('article_pullquote'); ?>
 
</blockquote> 

Lors de l'ajout de code à votre thème, n'oubliez pas de remplacer les noms des champs.

Une fois cela fait, vous pouvez visiter n'importe quel article où vous avez déjà saisi des données dans les champs personnalisés. Vous verrez maintenant vos métadonnées uniques en action.

Nous espérons que cet article vous a aidé à apprendre comment ajouter des boîtes méta personnalisées dans les articles et types d'articles WordPress. Vous pourriez également vouloir consulter notre guide sur comment afficher les métadonnées des articles de blog dans les thèmes WordPress et notre tutoriel sur comment personnaliser les extraits WordPress.

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.