vendredi 25 septembre 2026

À propos

Contact

FSE

Pages 404 et résultats de recherche dans un thème bloc : search.html et 404.html

Deux templates souvent négligés lors d'une migration vers un thème bloc : les résultats de recherche et la page introuvable. Construction pas à pas avec les blocs Query, Search et patterns.

Par Clément Hadrot • 10 août 2022 • 4 min de lecture • Aucun commentaire
Pages 404 et résultats de recherche dans un thème bloc : search.html et 404.html

Lors de l’audit d’un thème bloc en cours de construction pour un client, deux pages ont attiré notre attention par leur absence : aucun gabarit dédié pour les résultats de recherche, aucun gabarit pour la page 404. Le site affichait, dans ces deux cas, le template générique index.html, avec un rendu peu engageant et surtout aucun message d’accompagnement pour l’utilisateur.

Ces deux templates se construisent pourtant rapidement une fois qu’on connaît les bons blocs à assembler. Voici la méthode suivie pour les remettre en place.

Construire search.html

Le fichier search.html répond spécifiquement aux requêtes de recherche. Sa structure combine généralement un titre affichant le terme recherché, un bloc Recherche pour permettre d’affiner, et un bloc Query Loop réglé pour respecter automatiquement le contexte de recherche courant, sans filtre supplémentaire à préciser.

<!-- wp:template-part {"slug":"header"} /-->
<!-- wp:query-title {"type":"search"} /-->
<!-- wp:search /-->
<!-- wp:query {"query":{"inherit":true}} -->
    <!-- wp:post-template -->
        <!-- wp:post-title /-->
        <!-- wp:post-excerpt /-->
    <!-- /wp:post-template -->
<!-- /wp:query -->
<!-- wp:template-part {"slug":"footer"} /-->

Le message « aucun résultat »

L'essentiel à retenir : search.html combine bloc Recherche et bloc Query Loop ; 404.html se contente d'un message et d'un lien de retour ; Le message aucun résultat se configure dans Query Loop

Le bloc Query Loop propose, dans son panneau latéral, une zone spécifique appelée « Aucun résultat », qui n’apparaît que lorsque la requête ne renvoie aucun article. C’est l’endroit idéal pour insérer un message rassurant plutôt qu’une page vide : une phrase invitant à reformuler la recherche, éventuellement accompagnée d’un lien vers la page d’accueil ou vers les catégories principales du site.

Construire 404.html

Le gabarit 404.html suit une logique différente : il n’y a, par définition, aucun contenu à interroger. Sa structure se limite généralement à un titre, un court message et un lien de retour, éventuellement accompagné d’un champ de recherche pour aider le visiteur égaré à retrouver ce qu’il cherchait.

Éléments à inclure

  • Un titre clair indiquant que la page n’existe pas ou plus.
  • Un lien explicite vers la page d’accueil, pas seulement le logo du menu.
  • Un champ de recherche, particulièrement utile sur les sites à fort volume de contenu.

Un point de vigilance sur le SEO

Il est facile d’oublier de vérifier que la page 404 renvoie bien un code de statut HTTP 404, et non 200, même lorsque le contenu affiché paraît correct visuellement. Ce comportement dépend du cœur de WordPress et non du template lui-même, mais une vérification avec un outil d’inspection d’en-têtes HTTP reste une bonne pratique après toute migration de thème.

Différencier 404.html du template général du site

Une erreur relevée sur un autre projet audité mérite d’être mentionnée : le template 404.html reprenait, par copier-glisser depuis index.html, un bloc Query Loop censé afficher les derniers articles. Rien de grave en apparence, sauf que ce bloc masquait en partie le message d’erreur, donnant l’impression trompeuse que la page recherchée existait bel et bien, simplement noyée dans une liste d’articles récents sans rapport avec la requête initiale. Un gabarit 404 gagne à rester volontairement sobre, centré sur le message d’erreur plutôt que sur une liste de contenu qui prête à confusion.

Pour aller plus loin

Ces deux templates ne demandent pas un travail de composition complexe, mais leur absence se remarque immédiatement par les utilisateurs, souvent au pire moment : lorsqu’ils cherchent quelque chose de précis et ne le trouvent pas. Les intégrer systématiquement à la check-list de recette d’un thème bloc évite ce genre d’oubli, qui reste étonnamment fréquent même sur des projets par ailleurs soignés.

Partager :

À propos de l'auteur

Clément Hadrot

Développeur WordPress, passionné par Elementor, le FSE et l’automatisation par IA.

Voir tous ses articles

Dans la même veine

À lire aussi