15%

Économisez 15% sur tous les services d'hébergement

Testez vos compétences et obtenez Réduction sur tout plan d'hébergement

Utilisez le code :

Skills
Commencer
22.10.2024
2 +1

Comment masquer les titres de page dans WordPress en utilisant Elementor

Masquer le titre d’une page dans WordPress signifie supprimer l’en-tête <h1> que votre thème affiche automatiquement en haut de chaque page — distinct du titre de l’onglet du navigateur ou du méta-titre SEO. Avec Elementor, vous pouvez supprimer cet élément page par page via le bouton bascule intégré de l’éditeur, via le personnalisateur de votre thème, via du CSS ciblé, ou via un plugin léger. Chaque méthode cible une couche différente de la pile de rendu WordPress, et choisir la mauvaise pour votre situation peut provoquer des régressions de mise en page ou des effets secondaires SEO.

Ce guide couvre les quatre méthodes en détail technique précis, explique quand chacune est appropriée, signale les pièges que la plupart des tutoriels ignorent, et se termine par une matrice de décision pour vous aider à choisir la bonne approche pour votre configuration spécifique.

Pourquoi les titres de page apparaissent — et pourquoi les supprimer est plus complexe qu’il n’y paraît

Les thèmes WordPress affichent le titre de la page via une balise de template, généralement the_title() ou get_the_title(), encapsulée dans une balise <h1> à l’intérieur du template page.php ou single.php du thème. Elementor affiche son contenu à l’intérieur de ce template, et non à sa place. Cela signifie que le titre est rendu par la couche du thème, et non par Elementor lui-même — c’est pourquoi supprimer simplement le widget de titre dans le canevas Elementor n’a aucun effet sur l’en-tête généré par le thème.

Comprendre cette distinction est important car :

  • Masquer le titre visuellement avec display: none laisse toujours le <h1> dans le DOM, ce qui peut perturber les lecteurs d’écran et créer des structures d’en-têtes dupliquées.
  • Supprimer le titre via le bouton bascule natif d’Elementor le supprime au niveau du template uniquement pour cette page.
  • Les paramètres au niveau du thème peuvent remplacer le bouton bascule d’Elementor selon l’ordre de chargement.
  • Certaines couches de mise en cache de page serviront une version mise en cache de la page qui ignore les paramètres nouvellement enregistrés jusqu’à ce que le cache soit purgé.

Si votre site WordPress fonctionne sur un environnement VPS Hosting, purgez toujours votre cache côté serveur (cache FastCGI Nginx, cache d’objets Redis, ou votre plugin de cache) après avoir effectué l’un de ces changements, sinon le résultat ne sera pas visible pour les visiteurs.

Méthode 1 : Masquer le titre de la page avec les paramètres de page natifs d’Elementor

C’est la bonne approche de première ligne pour masquer le titre sur des pages individuelles. Elle utilise les métadonnées de page internes d’Elementor, qui indiquent au template du thème de ne pas afficher la balise de titre — sans hack CSS, sans pollution du DOM.

Instructions étape par étape

Étape 1 : Ouvrir la page dans Elementor

  1. Connectez-vous à votre tableau de bord d’administration WordPress.
  2. Naviguez vers Pages > Toutes les pages.
  3. Localisez la page cible et cliquez sur Modifier avec Elementor.

Étape 2 : Accéder au panneau Paramètres de la page

  1. Dans l’éditeur Elementor, cliquez sur l’icône de menu hamburger (trois lignes horizontales) dans le coin supérieur gauche, puis sélectionnez Paramètres de la page — ou cliquez sur l’icône d’engrenage en bas à gauche du panneau si vous utilisez une ancienne version d’Elementor.
  2. Le panneau Paramètres de la page s’ouvrira sur le côté gauche.

Étape 3 : Activer l’option Masquer le titre

  1. Faites défiler vers le bas dans le panneau Paramètres de la page jusqu’à voir le bouton bascule Masquer le titre.
  2. Activez-le sur Oui.
  3. Cliquez sur Mettre à jour (ou Publier si la page est nouvelle).

Ce que cela fait réellement : Elementor écrit une valeur de métadonnée de publication (_elementor_page_title) dans la base de données pour cet ID de publication spécifique. Le template du thème vérifie cette valeur de métadonnée et ignore conditionnellement l’appel the_title(). Cela signifie que le <h1> n’est jamais affiché dans le DOM — un résultat sémantiquement plus propre que le masquage CSS.

Limitations connues

  • Ce bouton bascule ne fonctionne que si votre thème actif est compatible avec l’API des paramètres de page d’Elementor. Les thèmes qui ne vérifient pas cette clé de métadonnée l’ignoreront entièrement.
  • Si vous utilisez Elementor Pro avec un en-tête personnalisé du Theme Builder ou un template de page, le bouton bascule peut n’avoir aucun effet car le page.php du thème est entièrement contourné.
  • Le bouton bascule est par page. Il n’existe pas d’option Elementor native pour l’appliquer globalement à toutes les pages depuis un seul contrôle.

Méthode 2 : Masquer les titres de page via les paramètres de votre thème

De nombreux thèmes commerciaux et de blocs exposent un contrôle de visibilité du titre soit dans le Personnalisateur, soit dans des métaboxes par page. C’est la bonne approche lorsque vous souhaitez supprimer les titres sur l’ensemble du site ou lorsque votre thème ne fonctionne pas bien avec le bouton bascule de métadonnées d’Elementor.

Utilisation du Personnalisateur WordPress

  1. Allez dans Apparence > Personnaliser.
  2. Recherchez des sections intitulées Paramètres de la page, Mise en page, Typographie, ou Options de publication/page — le libellé exact dépend de votre thème.
  3. Si un bouton bascule Afficher le titre de la page ou Afficher le titre existe, désactivez-le.
  4. Cliquez sur Publier.

Thèmes populaires et où trouver ce paramètre :

  • Astra : Apparence > Personnaliser > Page > Page unique > Titre de la page
  • GeneratePress : Apparence > Personnaliser > Mise en page > Mise en page de la page > Désactiver le titre
  • OceanWP : Apparence > Personnaliser > Options générales > Barre de titre de la page
  • Hello Elementor (thème propre d’Elementor) : Pas de contrôle de titre intégré — repose entièrement sur le bouton bascule des paramètres de page d’Elementor ou sur le CSS.

Utilisation des paramètres de document par page

Certains thèmes injectent une métabox directement dans l’éditeur de blocs WordPress ou dans la barre latérale de l’éditeur classique. Lors de la modification d’une page, recherchez un panneau intitulé Options de la page, Paramètres de la page, ou le nom de votre thème. Une case à cocher Masquer le titre ici fonctionne au niveau du template PHP, avec un effet identique au bouton bascule d’Elementor.

Piège critique

Si vous désactivez les titres globalement via le Personnalisateur, ce paramètre s’applique à chaque page, publication et type de publication personnalisé qui utilise le même template. Vérifiez votre inventaire de contenu avant d’activer un paramètre global, sinon vous masquerez par inadvertance les titres sur les articles de blog, les pages de produits WooCommerce, ou les pages d’archives où le titre est sémantiquement nécessaire.

Méthode 3 : Masquer les titres de page avec du CSS personnalisé

Utilisez cette méthode lorsque vous avez besoin d’un contrôle chirurgical — par exemple, masquer le titre sur une page spécifique sans toucher aux paramètres d’Elementor ou aux options du thème, ou lorsque vous avez affaire à un thème qui n’expose aucun bouton bascule natif.

Étape 1 : Trouver l’ID de publication de la page

  1. Dans votre tableau de bord WordPress, allez dans Pages > Toutes les pages.
  2. Survolez la page cible. Regardez l’URL affichée dans la barre d’état de votre navigateur — elle contiendra un paramètre comme post=123. Le nombre est l’ID de publication de la page.

Alternativement, ouvrez la page dans l’éditeur de blocs et vérifiez l’URL dans la barre d’adresse de votre navigateur : https://yoursite.com/wp-admin/post.php?post=123&action=edit.

WordPress ajoute automatiquement une classe body de page-id-{ID} à la balise <body> de chaque page, que vous pouvez utiliser comme sélecteur CSS.

Étape 2 : Identifier le sélecteur CSS correct

Le sélecteur dépend de votre thème et de la version d’Elementor. Les sélecteurs courants incluent :

Thème / ConfigurationSélecteur CSS
Elementor (générique).elementor-page-title
Elementor + thème Hello.page-title
Thème Astra.ast-page-single-meta
GeneratePress.entry-title
Twenty Twenty-Four.wp-block-post-title
Repli génériqueh1.entry-title, h1.page-title

Utilisez les DevTools de votre navigateur (clic droit sur le titre en front-end, sélectionnez Inspecter) pour identifier la classe exacte sur votre installation avant d’écrire du CSS.

Étape 3 : Ajouter le CSS via le Personnalisateur

  1. Allez dans Apparence > Personnaliser > CSS supplémentaire.
  2. Pour masquer le titre sur une seule page :
.page-id-123 .entry-title {
  display: none;
}
  1. Pour masquer le titre sur toutes les pages du site :
.page .entry-title {
  display: none;
}
  1. Pour masquer le titre uniquement sur les pages construites avec Elementor :
.elementor-page .entry-title {
  display: none;
}
  1. Cliquez sur Publier.

L’implication SEO de display: none

C’est la mise en garde la plus importante avec la méthode CSS : display: none masque l’élément visuellement mais ne le supprime pas du DOM. Googlebot continuera à explorer et indexer le contenu <h1>. C’est généralement acceptable — Google comprend le masquage CSS à des fins de mise en page — mais cela crée un problème structurel : votre page aura un <h1> masqué qui duplique l’en-tête que vous avez placé dans le canevas Elementor. Les balises <h1> dupliquées constituent un problème SEO on-page reconnu.

La solution techniquement correcte lors de l’utilisation du CSS pour masquer un titre est de s’assurer également que votre mise en page Elementor contient un widget d’en-tête <h1> approprié afin que la page ait exactement un <h1> visible et significatif. Si vous masquez le titre du thème uniquement parce que vous avez construit un en-tête personnalisé dans Elementor, c’est le bon flux de travail.

Alternative : visibility: hidden vs. display: none

PropriétéSupprime du flux de mise en pageLisible par les lecteurs d’écranExploré par Googlebot
display: noneOuiNonOui
visibility: hiddenNon (laisse un espace vide)NonOui
height: 0; overflow: hiddenPartielNonOui
Bouton bascule Elementor / suppression PHPOuiN/A (absent du DOM)Non

Pour l’accessibilité et l’intégrité SEO, le bouton bascule Elementor ou un paramètre de thème au niveau PHP est toujours préférable au masquage CSS.

Méthode 4 : Utiliser un plugin pour masquer les titres de page

Les plugins sont le bon choix lorsque vous gérez un réseau multisite, lorsque votre équipe comprend des éditeurs non techniques qui ont besoin d’une simple case à cocher, ou lorsque vous devez masquer les titres sur plusieurs types de publications sans écrire de code.

Plugins recommandés

Hide Title (par Stefano Lissa) — Léger, sans page de paramètres, ajoute une seule case à cocher à chaque éditeur de publication/page. Environ 10 000 installations actives, régulièrement mis à jour.

Elementor Header & Footer Builder — Si vous utilisez déjà ce plugin pour la gestion des templates, il peut aider à restructurer les mises en page afin que le titre du thème ne soit jamais affiché.

Page and Post Title Hider — Ajoute des contrôles par publication et par page, prend en charge les types de publications personnalisés, et fonctionne indépendamment du thème actif.

Installation et utilisation

  1. Allez dans Extensions > Ajouter.
  2. Recherchez le plugin choisi par son nom.
  3. Cliquez sur Installer maintenant, puis sur Activer.
  4. Modifiez la page cible. Dans la barre latérale de l’éditeur de blocs ou sous l’éditeur classique, localisez la case à cocher Masquer le titre du plugin.
  5. Cochez la case et cliquez sur Mettre à jour.

Quand ne pas utiliser un plugin

Évitez d’ajouter un plugin uniquement à cette fin si vous disposez déjà d’Elementor Pro ou d’un thème qui prend en charge nativement la suppression des titres. Chaque plugin supplémentaire ajoute des requêtes HTTP, des requêtes de base de données, et une surface d’attaque potentielle. Sur un VPS avec cPanel optimisé pour les performances ou un environnement de serveur géré, la surcharge de plugins est une responsabilité de performance mesurable.

Comparaison des quatre méthodes

MéthodePortéeNécessite du codeCompatible SEOFonctionne sans Elementor ProIdéal pour
Bouton bascule Paramètres de page ElementorPar pageNonOui (suppression du DOM)OuiPages individuelles, modifications rapides
Personnalisateur de thème / métaboxGlobal ou par pageNonOui (suppression du DOM)OuiContrôle à l’échelle du site ou natif au thème
CSS personnaliséPar page ou globalOui (CSS)Partiel (DOM présent)OuiCiblage chirurgical, sans plugin
PluginPar page ou globalNonOui (suppression du DOM)OuiÉquipes non techniques, multisite

Gestion des cas particuliers et des échecs courants

Le bouton bascule n’est pas visible dans les Paramètres de page d’Elementor

Cela se produit lorsque le thème actif n’enregistre pas la prise en charge de title-tag ou lorsqu’un thème enfant remplace page.php sans vérifier les métadonnées d’Elementor. Solution : passez à la méthode CSS ou utilisez un plugin.

Le titre disparaît dans l’éditeur mais réapparaît en front-end

C’est presque toujours un problème de cache. Purgez le cache de votre plugin de cache, votre cache CDN (si vous utilisez Cloudflare ou BunnyCDN), et votre cache au niveau du serveur. Sur un Serveur dédié exécutant Nginx avec mise en cache FastCGI, exécutez :

sudo find /var/cache/nginx -type f -delete
sudo systemctl reload nginx

Le titre est masqué mais un espace vide reste en haut de la page

Le thème applique un rembourrage ou une marge au conteneur du titre même lorsque le texte du titre est masqué. Ciblez l’élément conteneur, pas seulement l’en-tête :

.page-id-123 .page-header,
.page-id-123 .entry-header {
  display: none;
}

Les types de publications personnalisés ne répondent pas au bouton bascule d’Elementor

Le bouton bascule d’Elementor ne fonctionne que sur les types de publications qu’Elementor prend explicitement en charge. Pour les types de publications personnalisés enregistrés par des plugins (produits WooCommerce, éléments de portfolio, etc.), utilisez la méthode CSS ou un plugin qui prend en charge nativement les types de publications personnalisés.

Masquer le titre casse les fils d’Ariane ou le balisage de schéma

Certains plugins de fil d’Ariane (Yoast SEO, RankMath, Breadcrumb NavXT) extraient le titre de la page depuis the_title() pour remplir les libellés de fil d’Ariane et les données structurées. Masquer le titre visuellement n’affecte pas ces éléments — ils lisent depuis la base de données, pas depuis le DOM. Cependant, si vous utilisez un thème qui supprime conditionnellement le titre du template entièrement, vérifiez que votre fil d’Ariane et votre sortie de schéma s’affichent toujours correctement en vérifiant la source de la page et le Test des résultats enrichis de Google.

Matrice de décision technique

Utilisez cette liste de contrôle pour sélectionner la bonne méthode pour votre situation :

  • Page unique, thème compatible Elementor, sans codage : Utilisez la Méthode 1 (bouton bascule Paramètres de page Elementor).
  • Plusieurs pages ou suppression à l’échelle du site, équipe non technique : Utilisez la Méthode 2 (Personnalisateur de thème) ou la Méthode 4 (Plugin).
  • Le thème ignore le bouton bascule d’Elementor, besoin d’une correction immédiate : Utilisez la Méthode 3 (CSS personnalisé) avec le sélecteur correct depuis les DevTools.
  • Réseau multisite ou types de publications personnalisés : Utilisez la Méthode 4 (Plugin) avec prise en charge des CPT.
  • Elementor Pro avec template de site complet du Theme Builder : Le page.php du thème est contourné — construisez votre en-tête directement dans le template Elementor et ne vous fiez à aucune des méthodes ci-dessus.
  • Après tout changement : Purgez toutes les couches de cache avant de tester en front-end.

Si votre installation WordPress fonctionne sur un Hébergement Web mutualisé, vous n’aurez peut-être pas accès à la purge du cache au niveau du serveur — utilisez plutôt la fonction de purge intégrée de votre plugin de cache.

Pour les sites où les performances, la terminaison SSL et le contrôle total du serveur sont importants — en particulier ceux qui exécutent Elementor Pro avec WooCommerce ou des structures de types de publications personnalisés lourdes — un environnement VPS Hosting vous donne le contrôle pour gérer la mise en cache, les workers PHP-FPM et les paramètres OPcache qui affectent directement la rapidité avec laquelle les modifications de template se propagent aux visiteurs. Associez cela à un Certificat SSL correctement configuré pour garantir que vos pages personnalisées sont servies de manière sécurisée.

FAQ

Masquer un titre de page dans WordPress affecte-t-il le SEO ?

Masquer le titre généré par le thème à l’aide du bouton bascule Elementor ou d’une méthode au niveau PHP supprime le <h1> du DOM entièrement. Cela est compatible SEO uniquement si votre mise en page Elementor contient un widget d’en-tête <h1> correctement structuré en remplacement. Si vous masquez le titre avec CSS (display: none), le <h1> reste dans le DOM et Google le lira toujours — mais vous risquez une structure d’en-têtes dupliquée si votre canevas contient également un <h1>.

Pourquoi le bouton bascule « Masquer le titre » d’Elementor ne fonctionne-t-il pas sur mon site ?

Le bouton bascule écrit une valeur de métadonnée de publication que votre thème doit explicitement vérifier. Les thèmes qui ne s’intègrent pas avec l’API des paramètres de page d’Elementor ignoreront cette clé de métadonnée. Le thème Hello Elementor et la plupart des thèmes commerciaux majeurs (Astra, GeneratePress, OceanWP) le prennent en charge. Si le vôtre ne le fait pas, utilisez le CSS personnalisé ou un plugin comme solution de repli.

Puis-je masquer le titre de la page pour toutes les pages à la fois dans Elementor ?

Le bouton bascule natif d’Elementor est uniquement par page. Pour un paramètre global, utilisez l’option Personnalisateur de votre thème, ajoutez une règle CSS ciblant .page .entry-title { display: none; } dans le CSS supplémentaire, ou utilisez un plugin qui prend en charge la suppression en masse des titres.

Masquer le titre de la page affectera-t-il le titre de l’onglet du navigateur ou le méta-titre SEO ?

Non. Le titre de l’onglet du navigateur est contrôlé par la balise <title> dans le <head>, et le méta-titre SEO est défini par votre plugin SEO (Yoast, RankMath, etc.). Masquer l’en-tête <h1> sur la page n’a aucun effet sur l’un ou l’autre.

Quelle est la différence entre masquer le titre et supprimer le titre dans Elementor ?

Vous ne pouvez pas « supprimer » le titre généré par le thème depuis le canevas Elementor — il est rendu par le template du thème, en dehors de la portée d’Elementor. « Masquer » signifie soit le supprimer au niveau PHP (bouton bascule, paramètre de thème, plugin), soit le dissimuler visuellement avec CSS. Si vous souhaitez le remplacer entièrement, construisez un widget d’en-tête personnalisé dans Elementor et supprimez le titre du thème en utilisant la Méthode 1 ou la Méthode 2.

15%

Économisez 15% sur tous les services d'hébergement

Testez vos compétences et obtenez Réduction sur tout plan d'hébergement

Utilisez le code :

Skills
Commencer