Blog Siteor

Connaissances sur les CMS, sites web et bonnes pratiques.

Conseils pour les rédacteurs de sites, actualités produit et bonnes pratiques pour créer des sites modernes avec Siteor CMS.

Retour a la liste

Open Graph et Twitter Cards - apercu social automatique dans le CMS

21/05/2026 ·Equipe Intum
Open Graph et Twitter Cards - apercu social automatique dans le CMS
Vous partagez un lien vers votre site sur Facebook. Au lieu d'un bel apercu avec un titre et une description, un URL brut ou un fragment de texte aleatoire apparait. Ca vous dit quelque chose ? C'est le probleme des balises Open Graph manquantes. Siteor CMS le resout automatiquement. ## Qu'est-ce qu'Open Graph Open Graph (OG) est un protocole cree par Facebook en 2010. Il definit un ensemble de balises meta dans la section <head> de la page qui indiquent aux reseaux sociaux comment afficher l'apercu d'un lien partage. Les balises les plus importantes :
  • og:title - titre visible dans l'apercu
  • og:description - courte description sous le titre
  • og:url - URL canonique de la page
  • og:type - type de contenu (website pour les pages, article pour les articles)
  • og:site_name - nom du site
  • og:image - miniature, proportion ideale 1200x630px
Ces memes balises sont comprises par Facebook, LinkedIn, Slack, Discord, Telegram et bien d'autres. ## Twitter Card Twitter (X) utilise son propre ensemble de balises, mais le principe est le meme. Siteor CMS genere les deux formats simultanement :
  • twitter:card - type de carte (summary_large_image avec image, summary sans)
  • twitter:title - titre
  • twitter:description - description
  • twitter:image - miniature
## Comment ca fonctionne Toutes les balises sont generees automatiquement a partir des donnees de la page ou de l'article. Il suffit que la page ait les champs SEO remplis (titre et description). Pour les articles de blog, le systeme utilise le titre et la description de l'article, avec l'image de l'article comme og:image. Les balises font partie du bloc seo_head dans le layout. Si votre layout contient la variable Liquid dans la section head, Open Graph et Twitter Card apparaissent automatiquement. ## Verification Apres publication, vous pouvez verifier l'apercu :
  1. Facebook Sharing Debugger
  2. Twitter Card Validator