Comment ajouter une Open Graph image sur Webflow ?
Apprenez à ajouter une Open Graph image sur Webflow pour contrôler l'aperçu lors des partages sur les réseaux sociaux.
Dans ce tutoriel, Sandro cofondateur de l'agence Webflow Gemeos vous montre comment ajouter une Open Graph image sur Webflow pour contrôler l'aperçu lors des partages sur les réseaux sociaux.
| Réseau | Taille idéale | Ratio |
|---|---|---|
| Facebook / LinkedIn | 1200x630px | 1.91:1 |
| Twitter / X | 1200x600px | 2:1 |
| 1200x630px | 1.91:1 |
1. Créez votre OG image
Créez une image 1200x630px avec le titre de votre page, votre logo et un fond visuel fort. Outils : Figma, Canva ou votre outil de design habituel. Exportez en JPG ou PNG (moins de 8 Mo).
2. Définissez l'OG image au niveau du projet
Dans Project Settings > SEO, uploadez votre OG image par défaut. Elle s'applique à toutes les pages qui n'ont pas d'image spécifique définie.
3. Personnalisez l'OG image par page
Dans le Designer, sélectionnez une page et allez dans Page Settings > SEO. Uploadez une OG image spécifique pour cette page. Elle écrase l'image par défaut du projet pour cette page uniquement.
4. Testez le rendu
Après publication, testez avec le Facebook Sharing Debugger ou Twitter Card Validator. Si l'ancienne image s'affiche, cliquez sur "Scrape Again" pour forcer le rechargement.
Conclusion
Une bonne OG image augmente significativement le taux de clic sur les partages réseaux sociaux.
bon à savoir
Heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.
.avif)
Lorem ipsum
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
