benoitdemaegdt / voieslyonnaises

🚲 Aménagements cyclables à Lyon
https://cyclopolis.fr
Other
22 stars 11 forks source link

Modifier les previews des réseaux sociaux #348

Open benoitdemaegdt opened 4 months ago

benoitdemaegdt commented 4 months ago

Description

Aujourd'hui, peu importe la page qu'on partager sur les réseaux sociaux, c'est toujours cette preview qui apparait

image

À mon avis, ce serait cool de faire des preview différente pour chaque voie lyonnaise.

Il y a peut-être des trucs sympa à regarder du côté de la génération d'image par IA (dall-e, stable diffusion, midjourney)

tmartty commented 4 months ago

Voici un outil qui peut aider : https://metatags.io

CorentinTh commented 4 months ago

Hello ! Si t'as besoin de générer une image dynamique différente pour chaque page, je peux te conseiller de regarder le module og-image de @nuxt/seo

Je l'ai récemment utilisé sur du Nuxt, pour le site Deviz

  1. Il faut définir un composant qui rend le contenu de ton image OG (avec props, là est la magie), exemple
  2. Dans tes pages il suffit d'appeler defineOgImageComponent exemple 1, exemple 2

Nuxt va générer des images avec satori

Bonus, c'est facile d'avoir la preview de l'image pour dev avec Nuxt DevTools

benoitdemaegdt commented 4 months ago

Wahou, méga classe ce @nuxt/seo, je n'en avais jamais entendu parler. Merci pour l'info 👍