Guide de Facebook Open Graph et Twitter Card «SEOPressor – WordPress SEO Plugin

Avez-vous déjà partagé une publication de votre site Web sur Facebook uniquement pour trouver des blocs de texte et des images floues? Nous avons tous été là en tant que spécialistes du marketing numérique et experts en référencement social.

Cela se produit lors du partage de contenu depuis des sites vers des plateformes de médias sociaux. Cela se produit également lors de l’interconnexion de contenu entre différents canaux de médias sociaux.

Les problèmes de dégradation de la qualité des publications partagées ne sont pas exclusifs à Facebook. Cela se produit également sur Twitter et sur d’autres plateformes de médias sociaux. Cela se produit parce que vous, l’éditeur, n’avez pas défini le contenu à afficher et comment il doit être affiché lorsque vous partagez un lien.

Vous pourriez avoir le plus beau contenu, y compris des pages Web optimisées et des images inspirantes. Cependant, si la qualité passe par la fenêtre au moment où vous partagez sur vos médias sociaux, tous vos efforts de référencement social sont gaspillés. Aucun abonné ne voudra peut-être partager à nouveau le message invisible ou peu attrayant qui en résulte avec ses amis.

La réponse à ce problème est le Facebook Open Graph et la Twitter Card.

Qu’est-ce que l’Open Graph de Facebook?

Les balises Open Graph Meta introduites par Facebook en 2010 définissent comment votre contenu apparaît lors du partage à partir de sites Web et d’autres sites de médias sociaux.

L’utilisation d’Open Graph permet à votre contenu transféré de devenir un graphique riche ou, en d’autres termes, de conserver des qualités d’affichage supérieures à celles d’autres publications directes sur Facebook.

En tant que spécialiste du marketing, vous familiariser avec le fonctionnement d’Open Graph peut vous aider à améliorer le partage de votre contenu. Les utilisateurs attendent des images nettes et du texte clair, ce qui peut être atteint grâce à une utilisation correcte d’Open Graph. Le résultat de cet effort de référencement social serait plus de partages et un trafic accru.

og: titre

Cette balise meta vous explique comment décrire le titre de votre blog lors du partage sur Facebook. Le og: title fonctionne de la même manière que la balise HTML de votre code qui indique aux robots des moteurs de recherche de quoi parle votre contenu.

Votre og: le titre doit être audacieux et convaincant. Même s’il n’y a pas de limites définies sur le nombre de caractères, une moyenne de 60 caractères fonctionne mieux pour un affichage accrocheur.

Exemple

og: url

Cette balise Meta Open Graph est l’URL de votre article de blog, page ou image. Cependant, l’URL n’est jamais affichée dans le graphe social; seul le domaine apparaît. Cette balise est indispensable, surtout lorsque vous disposez de plusieurs URL pour le même contenu. Cela aide à définir où ira le trafic de la publication pour un référencement social facilement mesurable.

Exemple

Exemple:

og: description

La balise de description informe votre audience sur les réseaux sociaux de votre page. C’est ainsi que les utilisateurs évaluent la pertinence de votre contenu par rapport aux informations qu’ils recherchent. Ce que vous écrivez sur cette balise apparaît sous le lien de votre publication sur Facebook.

Exemple

og: type

Le og: type décrit votre type de contenu, par ex. article de blog, jeu, livre, film, etc.

Exemple:

og: image

Cette balise spécifie l’URL de l’image. Les images doivent être claires pour que votre message se démarque. Sans définir cette description, Facebook peut afficher une partie indésirable de votre site en tant qu’image ou surcompresser votre image.

N’oubliez pas que pour un affichage optimal de l’image sur votre publication partagée, la résolution doit être de 1200 pixels x 627 pixels. Veillez cependant à conserver la taille de l’image en dessous de 5 Mo. La balise d’image sur Open Graph permet également l’utilisation d’une image différente; il n’est pas nécessaire que ce soit ce que vous avez sur votre page.

Exemple:

Qu’est-ce que la carte Twitter?

Les cartes Twitter sont des protocoles de partage et de publication de contenu de Twitter qui fonctionnent de la même manière que l’Open Graph de Facebook. Dans ce cas, cependant, vos descriptions de contenu ne seront pas visibles pour les utilisateurs. Vous pouvez utiliser les cartes Twitter pour publier plus d’informations au-delà de la limite de 280 caractères. Les cartes aident également à améliorer la façon dont votre site Web, vos images et autres contenus se démarquent lorsqu’ils sont partagés à partir d’autres sites.

twitter: carte

Cette balise Meta décrit votre contenu. Vous avez la possibilité de sélectionner du contenu image, vidéo ou Web. La balise de description aide à obtenir une description récapitulative accrocheuse de votre contenu Web sur Twitter, avec une vignette et un titre.

Exemple:

twitter: url

La configuration de la description de votre URL garantit que le trafic généré par les clics de votre publication Twitter se trouve au même endroit.

Exemple:

twitter: titre

La balise de titre, comme dans Open Graph, doit décrire de manière succincte votre contenu. Vous aurez jusqu’à 70 caractères pour cela et la possibilité d’utiliser les bons mots clés pour capter l’attention de votre public.

Exemple:

Cartes d’application

Ceux-ci sont utilisés lors du partage de publicités d’applications mobiles. Les cartes affichent un extrait de l’icône de votre application, ainsi que le prix et la classification du contenu. La description doit comporter 200 caractères et l’image au moins 800 x 320 pixels.

Exemple

twitter: image

Les tweets avec images génèrent plus de clics et de retweets. La carte image Twitter vous permet de définir l’image dont vous avez besoin pour apparaître à côté de votre publication Twitter et comment elle doit apparaître. La taille de votre image ne doit pas dépasser 1 Mo et la résolution doit être comprise entre 60 pixels sur 60 pixels et 120 pixels sur 120 pixels.

Exemple

meta name = « twitter: image » content = « https: //where-your-image-is-hosted/name.jpg » />

Pourquoi les majorations sont-elles importantes?

• Les cartes Open Graph et Twitter sont des données structurées qui vous permettent de contrôler la façon dont votre contenu est affiché
• Ils aident à obtenir des publications de haute qualité sur Facebook et Twitter pour une visibilité accrue
• Ils augmentent la sympathie et le partage de votre contenu
• Ils rendent votre contenu plus cliquable, et donc améliorent le trafic et les conversions

Comment créer le balisage manuellement?

Maintenant que vous comprenez comment fonctionnent les balises de médias sociaux, mettons-les en action sur votre site Web WordPress et accélérons le potentiel de retour sur investissement de votre référencement social. Lors de la création manuelle des annotations, tout le code doit aller dans le fichier functions.php du thème de votre site Web.

Étape 1: Ouvrez vos fonctions. php et sur le filtre des attributs de langue, ajoutez une fonction qui informe les applications tierces qu’il y a plus de balises que de balises HTML dans votre contenu.

Étape 2: ajoutez les métadonnées d’Open Graph

Faites défiler vers le bas de votre fichier functions.php et copiez-collez le code ci-dessous. Ce code est une vérification conditionnelle qui confirme que vous êtes sur une page de publication et que les balises Open Graphs ou Twitter Cards seront appliquées sur les pages de publication individuelles.

Étape 3: Ajoutez les balises Open Graph ou Twitter Cards une par une dans la section head de votre en-tête. page php

Utilisez le titre de votre article de blog comme og: title et l’extrait de votre og: description et l’URL de la page pour le lien permanent. Dans cet exemple, nous avons défini notre type de contenu comme un article, et il y a une source d’image, utilisez une vignette de secours s’il n’y a pas d’image de publication.

Étape 4: ajoutez le code du bouton Facebook «J’aime» dans la section corps de votre page Web (.) afin que les utilisateurs de Facebook puissent facilement partager votre contenu.

Après avoir ajouté toutes ces balises Meta, vos pages de publication commenceront à exécuter une fonction principale d’Open Graph ou de Twitter Card. Le code peut être modifié avec des balises plus avancées en fonction de vos types de publication.

Création du balisage avec SEOPressor Connect

Alternativement, vous pouvez facilement créer le balisage avec notre plugin. Tout ce que vous avez à faire est de remplir les champs de la section « Social ».

Vous pouvez trouver un guide plus détaillé ici: Configurer le référencement social

Conclusion

Open Graph et Twitter Card garantissent que chaque fois que quelqu’un partage votre contenu Web sur son statut de réseau social, votre contenu apparaîtra clairement, avec un lien, un titre, une image et une description.

Ce sont des outils de référencement social essentiels à mettre en œuvre pour augmenter le trafic et la conversion.

Mis à jour: 23 avril 2021