Générateur de balises Open Graph
Remplissez les champs ci-dessous pour générer les balises meta Open Graph et Twitter Card à coller dans le <head> de votre page.
Comment ça marche
Quand un lien vers votre site est partagé sur Facebook, LinkedIn, Slack, Discord ou X (Twitter), ces plateformes cherchent des balises meta Open Graph dans le <head> de la page pour construire une carte de prévisualisation avec un titre, une description et une image. Sans ces balises, le réseau social affiche souvent un lien nu ou une prévisualisation générique peu engageante. Cet outil génère les balises og:title, og:description, og:url, og:image et og:type, ainsi que les équivalents twitter:card pour que la carte s'affiche correctement aussi sur X.
Où placer ces balises ?
Collez le résultat directement dans la section <head> de votre page HTML, avant la balise fermante </head>. Sur la plupart des frameworks (Nuxt, Next.js, etc.), il existe un composant dédié à la gestion du head qui accepte ces mêmes balises meta.
Quelle taille d'image utiliser pour og:image ?
La taille recommandée est généralement 1200x630 pixels (ratio 1.91:1), ce qui correspond au format attendu par Facebook, LinkedIn et X pour un affichage en grande carte. Une image trop petite ou dans un mauvais ratio peut être recadrée de façon peu flatteuse par la plateforme.
Pourquoi ma prévisualisation n'a pas changé après modification ?
La plupart des réseaux sociaux mettent en cache les balises Open Graph d'une URL la première fois qu'elle est partagée. Après avoir modifié vos balises, utilisez l'outil de débogage officiel de la plateforme (par exemple le "Sharing Debugger" de Facebook) pour forcer un nouveau scan de la page.
Traitement 100% local dans votre navigateur — rien n'est envoyé à un serveur.