Générateur de balises Open Graph
Remplissez le titre, la description, l’URL canonique (canonical), l’image d’aperçu et l’og:type, et ce générateur écrit les balises <meta> Open Graph correspondantes, prêtes à coller dans le <head> de votre page. Les champs que vous laissez vides sont simplement omis, et les guillemets et esperluettes de votre texte sont échappés pour que le balisage reste valide. Le générateur écrit uniquement les cinq propriétés og: principales, pas les balises Twitter Card ni les balises d’article.
Comment générer vos balises OG
-
1
Choisissez l'og:type
website pour les pages d'accueil, article pour les publications, product pour les pages de boutique, video.other pour les intégrations. Le champ est du texte libre, donc n'importe quelle valeur og:type valide fonctionne.
-
2
Remplissez les champs principaux
Titre, description, URL canonique et une URL d'image absolue. Tout champ laissé vide est omis de la sortie.
-
3
Générez les balises
Les guillemets et esperluettes sont échappés pour vous, et vous obtenez une ligne meta par champ rempli.
-
4
Copiez le bloc dans le head
Collez-le dans le `<head>` du modèle de votre page, au-dessus des balises sociales déjà présentes.
Les balises produites par ce générateur
<meta property="og:type" content="article">
<meta property="og:title" content="Your page title">
<meta property="og:description" content="A one-line description.">
<meta property="og:url" content="https://example.com/post/123">
<meta property="og:image" content="https://example.com/og-image.jpg">
C’est toute la sortie. og:type est toujours écrit, tandis que og:title, og:description, og:url et og:image ne sont ajoutés que lorsque vous les remplissez. Ces cinq propriétés sont les premières que lisent Facebook, LinkedIn, Slack, Discord, WhatsApp et X, elles couvrent donc le cas courant.
Le générateur n’écrit pas les balises de carte twitter:, ni og:image:width / og:image:height, og:site_name, og:locale ou les balises article:. Si vous en avez besoin, ajoutez-les à la main à côté du bloc généré.
Les valeurs og:type qui comptent
| Type | Quand l’utiliser |
|---|---|
| website | Page d’accueil, pages de destination, contenu statique |
| article | Articles de blog, actualités, pages éditoriales |
| product | Pages de détail produit d’e-commerce |
| video.other | Contenu vidéo et intégrations |
| profile | Pages de profil d’auteur ou d’utilisateur |
| music.song | Pages de pistes individuelles |
Balises à ajouter à la main
| Balise | Rôle | Exemple de valeur |
|---|---|---|
og:site_name |
Nom du site dans son ensemble | Example |
og:locale |
Langue et région de la page | en_US |
og:image:width |
Aide les scrapers à disposer la carte plus vite | 1200 |
og:image:height |
Aide les scrapers à disposer la carte plus vite | 630 |
twitter:card |
Disposition de la carte sur X | summary_large_image |
X se rabat sur les balises og: lorsqu’il n’y a pas de balises twitter:, donc une page ne portant que les cinq propriétés générées s’affiche correctement en aperçu là aussi. N’ajoutez des balises twitter: que lorsque vous voulez un titre, une description ou une image différents spécifiquement sur X.
Erreurs courantes que ce générateur vous aide à éviter
nameau lieu deproperty. Les propriétés Open Graph vont dansproperty="og:...". Le générateur écrit toujours le bon attribut.- Guillemets et esperluettes non échappés. Un
"ou&brut dans votre titre casse la balise. Le générateur les échappe pour vous. - URL d’image relatives. Les scrapers sociaux n’acceptent que des URL absolues. Collez l’adresse
https://complète de l’image, car le générateur n’ajoute pas votre domaine. - Mauvaise taille d’image. 1200 × 630 pixels est la taille universellement sûre. En dessous de 200 × 200 pixels, l’image est généralement rejetée.
Questions fréquentes
Dans le <head> de votre HTML, tout en haut, de préférence près du <title>. Les scrapers lisent le head et s’arrêtent souvent tôt, donc garder les balises OG près du haut évite qu’elles soient manquées sur de très grandes pages.
Non. Il écrit uniquement les cinq propriétés og: principales. X se rabat sur Open Graph lorsqu’il n’y a pas de balises twitter:, donc votre aperçu fonctionne toujours. N’ajoutez des balises twitter: à la main que lorsque vous voulez un titre, une description ou une image différents sur X.
1200 × 630 pixels, JPG ou PNG, est la taille universellement sûre. Elle fonctionne sur Facebook, LinkedIn, grandes cartes de X, Slack, Discord et iMessage. Tout ce qui est plus petit que 200 × 200 pixels risque d’être entièrement rejeté.
Donnez à chaque version linguistique sa propre page avec ses propres balises og:, et ajoutez og:locale (par exemple en_US) ainsi que og:locale:alternate pour les autres versions à la main. Ce générateur n’écrit pas les balises de locale pour vous.
Outils similaires
Vérificateur de longueur de méta description
Mesurez une méta description en caractères et en pixels estimés, comparez des repères éditoriaux et examinez des maquettes pour ordinateur et mobile.
Générateur de schéma FAQ
Générez un balisage JSON-LD FAQPage à partir de paires de questions et réponses pour être éligible aux résultats enrichis de Google et aux placements dans les boîtes de réponse.
Vérificateur d'URL canonique
Collez le HTML d'une page et vérifiez sa balise rel=canonical : est-elle présente, est-ce une URL absolue valide, correspond-elle à l'URL de la page ?
Simulateur de SERP Google
Prévisualisez un snippet approximatif de style Google avec des limites de caractères sur mobile et ordinateur. Votre brouillon reste dans cette session du navigateur.
Validateur de sitemap XML
Vérifiez dans votre navigateur les erreurs de syntaxe, les URL absentes ou dupliquées et les valeurs courantes d'un sitemap XML.
Compteur de fréquence des mots
Repérez les mots les plus répétés dans un texte avec leurs occurrences et leur densité. Utile pour la relecture, le SEO et les audits de contenu.
Outil disponible dans d’autres langues
- Open-Graph-Tags-Generator [DE]
- Generador de etiquetas Open Graph [ES]
- Generator Tag Open Graph [ID]
- เครื่องมือสร้างแท็ก Open Graph [TH]
- Generator tagów Open Graph [PL]
- Open Graph タグジェネレーター [JA]
- Open Graph 태그 생성기 [KO]
- Trình tạo thẻ Open Graph [VI]
- Gerador de tags Open Graph [PT]
- Open Graph-taggenerator [SV]
- مولّد وسوم Open Graph [AR]
- Open Graph-taggenerator [NL]
- Open Graph 标签生成器 [ZH]
- Open Graph Tags Generator [EN]
- Generatore di tag Open Graph [IT]
- Генератор тегов Open Graph [RU]
- Open Graph Etiketleri Oluşturucu [TR]