Code pour afficher une balise H1 dynamiquement en fonction de la page

Partagez si vous aimez ->

Le faux-débat sur le nombre de balise H1, son intérêt et sa valeur sémantique a été maintes fois abordée sur Internet. J’aimerais aborder aujourd’hui le côté technique: quel code employez-vous pour afficher dynamiquement une balise H1 sur la page d’accueil ?

Si vous en êtes encore au stade de vous demander comment utiliser correctement cette balise et son impact sur le référencement de votre site web, un petit tour sur cet article devrait vous apprendre les bases.

Personnellement, j’ai déjà fait mon choix : une balise dans le header sur le nom du site _pas sur le logo_ pour la page d’accueil, et une balise sur le titre principal de la page (le titre de l’article) pour le restant du site.

Comment afficher une balise h1 dynamiquement?

Sur WordPress

Les utilisateurs de WordPress bénéficient de fonctions spéciales. Pour comprendre ces fonctions, il faut comprendre que les pages ne sont pas toutes les mêmes. Elles possèdent un « type » particulier en fonction de leur rôle.

  • is_home() est une fonction qui permet de vérifier si la page en cours est la page d’accueil du blog (une liste d’articles par ordre chronologique inversé).
  • is_front_page() est une fonction qui permet de vérifier si la page en cours est la page d’accueil du site.

Voici le code pour afficher le titre du site dans une balise H1, uniquement sur la page d’accueil.

<!--?php if (is_home()){ ?-->
<!-- Page accueil du blog -->
<h1></h1>
<!--?php } ?-->
Après avoir fait ces changements, n’oubliez pas de vérifier que vous utilisez bien des balises h1 pour les titres de vos articles (sur single.php).
<!--?php if (is_front_page()){ ?-->
<!-- Page accueil du site-->
<h1></h1>
<!--?php } ?-->

EDIT: Ne mettez jamais un élément H1 en « display:none », cela n’apportera rien à votre référencement et risque de vous faire passer pour un tricheur aux yeux de Google.

<!-- NE JAMAIS FAIRE!! -->
<h1 style="display: none;"></h1>

Ces fonctions sont bien pratiques mais ne fonctionneront que si votre thème respecte la hiérarchie des templates de WordPress. or, certains développeurs/designers ne s’embêtent pas avec cette notion. Ils utilisent pour la page d’accueil, une page classique, configurée pour qu’elle apparaisse « en tant que » première page du site ou du blog.

En surface, cette « bidouille » n’est pas gênante puisque la manœuvre est invisible pour le visiteur. Mais quand on veut aller plus loin, on doit abandonner les facilités de WordPress et revenir à de la programmation plus « générique ».

La solution PHP générique pour tous les webmasters

Le technique utilisée ici va être de vérifier si l’url de la page courante est (ou n’est pas) d’une certaine valeur. Cette astuce est reproductible pour n’importe quelle page dont vous connaissez l’url.

Nous allons tester la valeur de « REQUEST_URI » qui correspond à tout ce qui se trouve après le nom de domaine. Par exemple, l’URL de cet article est « /afficher-balise-h1-dynamiquement/ ». (Notez que l’URL est encadré par deux slashs)

Pour la page d’accueil, on testera si l’URL est égal à « / ».

<!--?php if ($_SERVER&#91;"REQUEST_URI"&#93; == '/'){ ?-->
<!-- Page d'accueil -->
<h1></h1>
<!--?php } ?-->

A vous d’adapter le code pour qu’il corresponde à vos besoins !

Partagez si vous aimez ->

Youcef

Concepteur de Sites Web et entrepreneur, l'écriture et la pédagogie font aussi partie de mes passions. Mon objectif est de vous aider à trouver la solution idéale pour créer votre propre Site Internet.

Vous aimerez aussi...

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Simple Share Buttons