Si vous avez envoyé un lien vers votre article WordPress et qu'il ne s'est pas développé pour afficher l'image, le titre et la description, c'est parce que vous n'avez pas configuré vos balises méta Open Graph dans WordPress. Nous vous montrerons comment les configurer pour améliorer votre présence sur les réseaux sociaux.
Que sont les balises méta Open Graph ?
La configuration des intégrations de médias sociaux se fait via un format standard, créé à l'origine sur Facebook, appelé “le protocole Open Graph.”
En gros, ils ressemblent à ce qui suit <meta> ; Balises HTML, généralement dans l'en-tête de votre site :
<meta property=”og:image” content=”https://i.imgur.com/imagelink.jpg”> <meta property=”og:title” content=”Titre du site Web” /> <meta property=”og:description” content=”Description du site Web” /> <meta property=”og:type” content=”article” /> <meta property=”og:url” content=”https://example.com/” />
Cependant, bien que cela fonctionne pour un site Web classique, vous ne pouvez pas simplement le coller dans votre HTML WordPress. En effet, WordPress est un système de gestion de contenu (CMS) et il doit remplir le titre, la description et l'image en fonction de l'article que vous avez lié.
Il existe deux manières principales de procéder — manuellement, avec quelques modifications de vos fichiers PHP, ou automatiquement avec un plugin. Moins de dépendances de plug-in est toujours mieux, nous vous recommandons donc de l'ajouter manuellement si vous êtes féru de technologie.
Publicité
Mais, si vous n'êtes pas, ou utilisez l'hébergement partagé et n'avez pas accès à vos fichiers système, il n'y a rien de mal à le configurer avec un plugin.
Ajouter manuellement des balises à PHP
PHP est utilisé pour générer le fichier HTML automatiquement lorsqu'un utilisateur le demande. Le code PHP utilisé pour générer l'en-tête dépend du thème que vous utilisez. Il est techniquement situé dans header.php, mais cela appelle une fonction appelée wp_head(), il est donc préférable d'ajouter une nouvelle action à celle de functions.php, située ici :
wordpress/wp-content/themes/theme/functions.php
Si vous n'êtes pas à l'aise avec les éditeurs de texte, vous pouvez installer un plugin appelé Head, Footer et Post Injections qui vous permettra d'ajouter du code via les paramètres du plugin, bien que vous devriez probablement utiliser le plugin ci-dessous si vous’ rajoutez quand même des plug-ins.
Sinon, vous pouvez utiliser un éditeur de ligne de commande comme nano ou micro, ou vous pouvez transférer ce fichier sur votre bureau pour le modifier. Dans tous les cas, ouvrez-le dans l'éditeur de texte de votre choix et faites défiler vers le bas :
Ensuite, collez la fonction suivante :
function fb_opengraph() { global $post; if(is_single()) { if(has_post_thumbnail($post->ID)) { $img_src = wp_get_attachment_image_src(get_post_thumbnail_id( $post->ID ), 'moyen'); } else { $img_src = get_stylesheet_directory_uri() . '/img/opengraph_image.jpg'; } if($excerpt = $post->post_excerpt) { $excerpt = strip_tags($post->post_excerpt); $excerpt = str_replace("", "'", $excerpt); } else { $excerpt = get_bloginfo('description'); } ?> <meta property="og:title" content="<?php echo the_title(); ?>”/> <meta property="og:description" content="<?php echo $excerpt; ?>”/> <meta property="og:type" content="article"/> <meta property="og:url" content="<?php echo the_permalink(); ?>”/> <meta property="og:site_name" content="<?php echo get_bloginfo(); ?>”/> <meta property="og:image" content="<?php echo $img_src; ?>”/> <?php } sinon { revenir; } } add_action('wp_head', 'fb_opengraph', 5);
Essentiellement, cela vérifie si la page est un article unique ou une page principale, et configure la description et l'image en conséquence. Notez qu'il utilise /img/opengraph_image.jpg pour les pages sans article, vous devrez donc y mettre quelque chose.
Ensuite, il ajoute toutes les balises méta OG, en utilisant les données actuellement utilisées par la page. Cela devrait prendre effet immédiatement, même si vous devrez peut-être attendre que les caches se rafraîchissent.
Utiliser un plugin
Configurer ceci avec un le plugin est plus simple. Vous souhaiterez rechercher les balises Open Graph et Twitter Card,” et installez-le :
Activez-le et accédez aux paramètres :
Publicité
Il n'y a pas grand-chose à configurer ici, car tout est configuré automatiquement, mais vous pouvez spécifier un texte personnalisé pour la page d'accueil et les descriptions par défaut, et télécharger une image par défaut pour les pages non publiées.
Vous devriez voir les modifications fonctionner immédiatement après avoir appuyé sur Appliquer.
Certains autres plugins plus gros, comme YoastSEO, configureront également les balises méta, mais ce plugin le fait simplement sans volume supplémentaire .