Un bon contenu attirera un public pertinent sur votre site Web et il y a de fortes chances que certaines de ces personnes veuillent partager votre contenu sur les réseaux sociaux. Mais parfois, des problèmes surviennent lorsque le contenu partagé n’apparaît pas correctement sur un flux social, c’est là que l’utilisation des balises Open Graph peut aider.
Avec Open Graph, vous pouvez contrôler l’apparence du titre, de l’image, de la description et plus encore de votre contenu lorsqu’il est partagé via les réseaux sociaux. Peut-être connaissez-vous déjà les balises méta courantes telles que la balise de titre et les balises de description. Mais de nombreux blogueurs ne savent pas qu’il existe d’autres balises méta spécifiques aux sites de réseaux sociaux comme Google+, Facebook, Twitter et Pinterest. La raison pour laquelle ces sites de réseaux sociaux ont commencé à utiliser des métadonnées est d’afficher correctement le contenu ainsi que les images, les descriptions et les liens associés. En définissant ces balises méta, vous pouvez vous assurer que votre contenu est plus facile à partager et à comprendre en un coup d’œil sur les réseaux sociaux.
Chaque site de réseau social a des préférences différentes. Pinterest et Google+ privilégient les balises Schema, mais prennent également en charge Protocole de graphique ouvert tags, qui sont préférés par Facebook, Google+ et Pinterest.
Les balises Open Graph vont entre la section
de la page Web. Les balises les plus couramment utilisées sont :- og:titre
- og:description
- og:url
- og:site_name
- og:image
- og:type
Ceux-ci n’ont probablement pas beaucoup de sens, alors voici quelques diagrammes de partage social avec les balises Open Graph clairement étiquetées.
De plus, Twitter a défini ses propres balises personnalisées appelées Twitter Cards. Ces balises permettent à vos liens de présenter plus d’informations chaque fois qu’ils sont tweetés. Semblables aux balises Open Graph, les balises de la carte Twitter vont également entre la section
d’une page Web. Les balises Twitter les plus couramment utilisées sont :- twitter:carte
- twitter:site
- twitter:créateur
Bien que vous puissiez ajouter manuellement des balises Open Graph et Twitter Card, il existe de nombreux plugins disponibles sur WordPress.org qui permettent aux utilisateurs novices d’ajouter très facilement des balises sur les publications et les pages WordPress. Voici quelques-uns de nos favoris :
- Référencement par Yoast
- Open Graph pour Facebook, Google+ et Twitter Card Tags
- Le cadre de référencement
- Cartes Twitter JM (uniquement pour les cartes Twitter)
- Cadre de protocole Open Graph (Uniquement pour les balises Open Graph et recommandé pour les développeurs)
Pour ce didacticiel, nous allons utiliser les options intégrées du plugin Yoast SEO pour définir des balises Meta spéciales afin de rendre nos publications conviviales pour les médias riches.
Noter: Vous ne devez utiliser qu’un seul plugin ayant des fonctionnalités similaires. Si vous avez déjà installé WordPress SEO by Yoast, il est préférable de configurer ce plugin plutôt que d’installer également le plugin Open Graph pour Facebook, Google+ et Twitter Card Tags.
Étape 1 : Installez la dernière version de Yoast SEO
Nous vous recommandons d’installer la dernière version de Yoast SEO. Le moyen le plus simple de le faire est via le tableau de bord d’administration WordPress sous Plugins > Ajouter un nouveau et recherchez « Yoast SEO ».
Ensuite, installez et activez le plugin (cliquez simplement sur ce bouton).
Une fois activé, vous devriez voir un nouvel onglet « SEO » dans votre tableau de bord d’administration WordPress. Il y a des tonnes de fonctionnalités intéressantes dans Yoast SEO (pour les fils d’Ariane, les redirections, etc.), mais ce qui nous intéresse aujourd’hui, c’est le Social languette.
Étape 2 : Configurez vos paramètres sociaux
Pour configurer les cartes Open Graph et Twitter, accédez à SEO > Réseaux sociaux depuis le tableau de bord d’administration WordPress. Ajoutez d’abord les liens de votre profil social ici pour aider les moteurs de recherche à valider qu’ils sont vraiment connectés à votre site. Passez ensuite aux différents onglets sociaux.
Votre première étape consiste à activer les métadonnées Open Graph pour les publications Facebook – cliquez simplement sur le Activée option. En supposant que vous ayez déjà ajouté la page Facebook associée à votre site sous le Comptes onglet vous êtes prêt à partir. Vous pouvez ajouter une image par défaut si vous le souhaitez pour toutes les pages qui n’ont pas de média en vedette, mais c’est à vous de décider.
Une fois Facebook terminé, il est temps de s’attaquer à Twitter. Assurez-vous simplement que les métadonnées de la carte Twitter sont Activée puis sélectionnez une mise en page de carte par défaut (résumé ou résumé avec une grande image). Encore une fois, cela sera associé au pseudo Twitter que vous avez ajouté sur le Comptes page.
Pinterest est un peu différent, car cette plate-forme utilise une vérification de balise méta. Accédez à votre compte Pinterest, survolez votre icône d’utilisateur puis cliquez sur le Paramètres languette. Clique sur le Site Web de réclamation option et sélectionnez le Ajouter une balise HTML option.
Copiez la balise méta générée et collez-la dans votre panneau Yoast SEO. Enregistrez vos modifications, puis revenez sur Pinterest pour soumettre. Cela indique à Pinterest de vérifier la balise et de vérifier votre site. C’est tout pour Pinterest !
Google+
Le dernier compte social que vous devrez définir est Google+, qui n’est qu’un lien vers la page Google+ de votre entreprise. Collez-le et vous êtes prêt.
Définir les valeurs par défaut
La dernière étape consiste à créer votre valeur par défaut. Yoast utilise des méta-boîtes sur votre contenu pour définir les données Open Graph. Assurez-vous donc de modifier vos valeurs par défaut sous SEO > Apparence de la recherche > Types de contenu. Utilisez les variables d’extrait intégrées de Yoast SEO pour créer vos propres valeurs par défaut dynamiques pour le titre de votre article (qui est utilisé pour og:title) et la méta description (utilisée pour og:description).
Image personnalisée, titre et description
Yoast SEO comprend également une option sur les publications individuelles pour personnaliser l’image, le titre et la description utilisés pour Facebook et Twitter. Lors de la modification d’un article, faites simplement défiler jusqu’à la section Yoast SEO et cliquez sur l’icône de partage (elle ressemble à moins de < symbole). Ensuite, téléchargez une image personnalisée ou modifiez le titre et la description selon vos besoins.
Débogage et validation
Chaque site de réseautage social majeur a son propre validateur ou débogueur pour tester et prévisualiser comment vos liens apparaîtront lorsqu’ils seront partagés sur les réseaux sociaux.
Outil de test de données structurées Google: cet outil ne vous montrera pas l’aperçu du post partagé sur Google+, mais il montrera quelles métadonnées sont présentes et lisibles par Google. Vos propriétés apparaîtront sous les propriétés du nœud RDFA.
Débogage Facebook: Après avoir implémenté les balises Open Graph, collez simplement l’URL de votre site contenant les balises. Il vous montrera les propriétés de l’objet.
Outil de validation Twitter: vous pouvez utiliser ce lien pour prévisualiser la carte Twitter de votre publication avant qu’elle ne soit partagée sur les réseaux sociaux.
Validateur d’épingles riches Pinterest: Semblable aux deux derniers validateurs, entrez simplement l’URL contenant les balises Open Graph pour prévisualiser et assurez-vous que votre contenu s’affiche comme il se doit. Si vous avez suivi tout le tutoriel, vous n’aurez aucun problème.
Remarque finale
En utilisant ces balises méta Open Graph, vous pouvez optimiser la manière dont les titres, images, descriptions et autres détails de votre contenu apparaissent sur les réseaux sociaux. Cela peut aider à augmenter le trafic provenant des sites sociaux, car les liens contenant des informations claires ont tendance à obtenir plus de partages et de liens naturels. De plus, les gens ont tendance à faire confiance aux liens qui contiennent plus d’informations plutôt qu’à cliquer sur des URL nues ou courtes (cela peut également aider si vous utilisez également des techniques pour automatiser le partage social).
Espérons que notre guide vous a aidé à configurer les balises méta Open Graph et les cartes Twitter de votre site, mais si vous avez des questions, n’hésitez pas à les poser. Nous sommes heureux de vous aider si nous le pouvons !
Quels plugins WordPress utilisez-vous pour implémenter ces balises méta ? Avez-vous d’autres trucs ou astuces à ajouter? N’hésitez pas à faire part de vos réflexions dans les commentaires ci-dessous.