CHAPITRE 16 — Référencement, sitemap et partage social
Avoir un beau contenu est nécessaire ; obtenir une visibilité de Google et des réseaux sociaux est tout aussi important. Le module intègre l'ensemble des outils de référencement de base directement dans l'éditeur, sans extension tierce.
Le panneau SEO d'une page
Pour chaque page, vous pouvez personnaliser ses métadonnées de référencement via un panneau dédié dans la barre d'outils.
Accéder au panneau
- Ouvrez la page dans l'éditeur.
- Dans la barre d'outils centrale, cliquez sur SEO.
- Une fenêtre de 720 pixels de largeur s'ouvre.
Les champs disponibles
Champ | Description | Cible |
|---|---|---|
Titre SEO | Le titre affiché dans l'onglet du navigateur et dans les résultats Google. | 50 à 60 caractères |
Meta description | Le texte de présentation sous le titre dans Google. | 140 à 160 caractères |
Mots-clés | Mots-clés séparés par des virgules. | Facultatif — peu utilisé par Google moderne |
Image Open Graph | Image affichée lorsque la page est partagée sur Facebook, LinkedIn, Twitter, WhatsApp. | 1200 × 630 px recommandé |
L'aperçu Google en direct
En haut de la fenêtre, un aperçu live reproduit l'affichage d'un résultat Google :
- L'URL de la page (en gris).
- Le titre (en bleu).
- La meta description (en gris).
L'aperçu se met à jour à chaque saisie. Vous voyez immédiatement si votre titre est tronqué ou si votre description est trop longue.
Compteurs colorés — À côté de chaque champ, un compteur indique le nombre de caractères :
Vert : dans la plage idéale.
Orange : en dehors de la plage mais acceptable.
Rouge : trop long, sera tronqué par Google.
Choisir l'image Open Graph
- Dans la fenêtre SEO, cliquez sur Choisir une image.
- La bibliothèque média s'ouvre.
- Sélectionnez une image ou téléversez-en une nouvelle.
- L'image apparaît à droite de l'aperçu Google.
Format idéal — 1200 × 630 px (ratio 1.91:1) pour Facebook et LinkedIn. Format JPG ou PNG. Affichez votre logo et un texte court qui résume la page. Évitez les images de banque génériques.
Lorsqu'une image Open Graph est renseignée, le module ajoute automatiquement les balises Open Graph et Twitter Cards dans l'en-tête HTML de la page :
<meta property="og:image" content="..." />
<meta property="og:title" content="..." />
<meta property="og:description" content="..." />
<meta name="twitter:card" content="summary_large_image" />
Enregistrer le SEO
- Modifiez les champs.
- Cliquez sur Enregistrer en bas de la fenêtre.
- Le module met à jour la base de données (
llx_website_page) et le fichiertpl.phpen synchronisant les balises HTML. - L'aperçu se rafraîchit.
Note — Les métadonnées SEO ne suivent pas le cycle de publication des slots. Une fois enregistrées, elles sont visibles publiquement immédiatement.
Sitemap.xml
Le sitemap est le fichier que Google utilise pour découvrir toutes les pages de votre site. Le module le génère automatiquement à partir de votre liste de pages.
Contenu généré
- Toutes les pages au statut publié.
- Les pages au statut retiré du site sont exclues.
- Les pages sœurs (autres langues) sont déclarées comme alternates via
<xhtml:link rel="alternate">.
Régénérer le sitemap
Méthode A — Bouton dans l'éditeur
- Rendez-vous dans la liste des pages d'un site.
- Cliquez sur le bouton Sitemap en haut.
- Le module régénère le fichier
sitemap.xmlà la racine du docroot. - Une notification confirme l'opération.
Méthode B — En ligne de commande (administrateurs)
php htdocs/custom/infrasstudio/scripts/generate_sitemap.php <ref-du-site> <entity>
Cette méthode convient à une planification quotidienne automatisée.
Recommandé — Soumettez votre sitemap à Google Search Console une seule fois. Google reviendra ensuite le consulter automatiquement à intervalles réguliers.
Balises hreflang multilingues
Pour un site multilingue, Google a besoin de savoir quelles pages sont des traductions les unes des autres. C'est le rôle des balises <link rel="alternate" hreflang="...">.
Le module génère ces balises automatiquement, à condition que votre développeur ait inclus le helper dans l'en-tête du gabarit :
<link rel="alternate" hreflang="fr" href="https://exemple.com/page" />
<link rel="alternate" hreflang="en" href="https://exemple.com/page-en" />
<link rel="alternate" hreflang="de" href="https://exemple.com/page-de" />
<link rel="alternate" hreflang="x-default" href="https://exemple.com/page" />
Conseil — Si vous ne voyez pas ces balises sur votre site, demandez à votre développeur d'ajouter <?php echo infrasstudio_hreflang_tags($website, $page); ?> dans l'en-tête de vos gabarits.
Liste de contrôle SEO par page
Avant de publier une nouvelle page, vérifiez les points suivants :
- Le titre SEO compte 50 à 60 caractères et contient le mot-clé principal.
- La meta description compte 140 à 160 caractères et incite au clic.
- L'image Open Graph est définie ; à défaut, le partage social affichera une vignette générique.
- Toutes les images possèdent un texte alternatif (renseigné dans la bibliothèque média).
- Le H1 (souvent un slot
page_title) est unique et descriptif. - L'URL (slug) est en minuscules, sans accents, avec des tirets pour séparer les mots.
Outils de mesure du référencement
Le module génère le SEO mais ne le mesure pas. Pour suivre vos résultats, utilisez les outils standards :
- Google Search Console : permet de découvrir les pages indexées, les requêtes qui génèrent des clics, les erreurs.
- Google Analytics ou Matomo : trafic, comportement des visiteurs, conversions.
- PageSpeed Insights : performance de chargement et indicateurs Core Web Vitals.
- Outils de test Open Graph : Facebook Sharing Debugger, LinkedIn Post Inspector.
Récapitulatif
Vous savez désormais :
- Renseigner le titre SEO, la meta description, les mots-clés et l'image Open Graph d'une page.
- Lire l'aperçu Google en direct avec ses compteurs colorés.
- Ajouter une image Open Graph pour un partage social soigné.
- Régénérer le sitemap.xml manuellement ou en ligne de commande.
- Comprendre l'utilité des balises hreflang multilingues.
- Suivre une liste de contrôle SEO complète avant publication.
Fin de la Partie III — Vous savez désormais utiliser le module au quotidien : modifier le contenu, gérer les médias, publier, traduire, gérer un blog, exploiter un catalogue produit et soigner le référencement. Vous êtes autonome.
La Partie IV s'adresse aux développeurs intégrateurs. Si ce n'est pas votre rôle, vous pouvez passer directement aux Annexes (glossaire, FAQ, historique des versions).