Nous utilisons des cookies pour améliorer votre expérience de visite de notre site Web. Pour plus d'informations, Cliquez ici.
Mentions légales
×

Vue d'ensemble de la vie privée

Ce site utilise des cookies afin que nous puissions vous fournir la meilleure expérience utilisateur possible. Les informations sur les cookies sont stockées dans votre navigateur et remplissent des fonctions telles que vous reconnaître lorsque vous revenez sur notre site Web et aider notre équipe à comprendre les sections du site que vous trouvez les plus intéressantes et utiles.

Vous pouvez régler tous vos paramètres de cookies en naviguant sur les onglets sur le côté gauche.

Nom du cookieAcceptez
GDPR PRO - Règlement sur la protection des données générales - tout en 1 Ce module aide le site adevenir conforme à la norme RGPD en ajoutant les fonctionnalités conformes à la loi.
unknown

Prestashop : comment cacher haut de page ?

tout servces prestashop

1. PrestaShop : Masquer le haut de page avec du CSS personnalisé

Vous pouvez cacher le haut de page PrestaShop en appliquant une règle CSS via le fichier de personnalisation du thème. Cela permet de masquer visuellement l’ensemble du bloc contenant le logo, le menu et la recherche.

Cette méthode est rapide et n’implique pas de toucher au code source. Elle est idéale pour des modifications temporaires ou pour adapter l’apparence sur certaines pages spécifiques de votre boutique en ligne.


2. PrestaShop : Utiliser une condition dans les fichiers du thème

Il est possible de masquer le haut de page en insérant une condition dans les fichiers de votre thème, notamment dans celui dédié à l’en-tête. Cela permet de définir sur quelles pages le header doit apparaître ou non.

Cette approche offre une grande flexibilité, surtout si vous souhaitez cacher le header uniquement sur la page d’accueil ou sur certaines pages CMS. C’est une solution propre et modulaire pour ajuster la structure de votre site.


3. PrestaShop : Cacher le haut de page sur mobile uniquement

Certains e-commerçants souhaitent masquer le haut de page uniquement sur mobile, notamment pour gagner de l’espace visuel. Cela peut être fait en ciblant les écrans de petite taille via les réglages du thème.

Ce choix peut améliorer l’expérience utilisateur mobile, surtout si le header contient beaucoup d’éléments. Il permet de simplifier l’interface sans impacter la version desktop de votre boutique.


4. PrestaShop : Désactiver le module d’en-tête depuis les positions

Le haut de page de PrestaShop est composé de modules positionnés sur un emplacement spécifique. En allant dans les paramètres d’affichage des modules, vous pouvez retirer ou déplacer celui qui gère le header.

Cela supprime automatiquement l’affichage du bloc concerné sur toutes les pages. C’est une méthode simple et efficace pour désactiver rapidement l’affichage sans avoir à modifier les fichiers du thème.


5. PrestaShop : Créer un thème enfant avec un header vide

Pour une solution plus durable, vous pouvez créer un thème enfant dans lequel le header est volontairement supprimé ou allégé. Cela vous permet de conserver le thème principal intact.

C’est une bonne pratique pour les boutiques qui veulent faire des tests d’affichage ou créer des pages sans éléments de navigation. Cela garantit aussi une meilleure gestion des mises à jour du thème original.


6. PrestaShop : Masquer le header uniquement sur une page CMS

Il peut être pertinent de cacher le haut de page uniquement sur une ou plusieurs pages de type CMS, comme une page de conditions générales, une page promo ou une page de formulaire.

Cela permet de focaliser l’attention sur le contenu central sans distraction. C’est particulièrement utile pour des pages marketing ou des pages d’atterrissage que vous souhaitez rendre plus épurées.


7. PrestaShop : Supprimer dynamiquement l’affichage avec JavaScript

Une autre solution consiste à utiliser un script côté client pour cacher dynamiquement le header. Cela se fait sans toucher aux fichiers du thème ni aux modules installés.

Cette méthode est à privilégier si vous ne pouvez pas modifier directement le code ou les fichiers du thème. Elle permet de gérer l’affichage en fonction de certains critères comme la page visitée ou la taille de l’écran.


8. PrestaShop : Cacher le header grâce aux classes de page

Chaque page de PrestaShop possède une classe spécifique selon son type (produit, catégorie, CMS…). Vous pouvez exploiter ces classes pour appliquer un style spécifique qui masque le haut de page sur certaines pages seulement.

C’est une solution pratique et propre pour ajuster l’affichage selon le contexte de navigation. Elle évite d’avoir à créer plusieurs versions du thème ou à gérer des exceptions dans le code.


9. PrestaShop : Désactiver les blocs du header dans les modules

Si le header est constitué de blocs distincts (logo, barre de recherche, panier…), vous pouvez les désactiver un à un depuis le gestionnaire de modules. Cela permet de vider le contenu du haut de page sans en supprimer la structure.

Cette solution est utile si vous souhaitez conserver la mise en page générale tout en allégeant visuellement la partie supérieure du site. Elle convient bien aux boutiques minimalistes ou en cours de refonte.


10. PrestaShop : Créer un contrôleur sans affichage du header

Pour les développeurs avancés, il est possible de créer un contrôleur personnalisé qui génère une page sans inclure le haut de page. Cela permet de concevoir des pages totalement indépendantes de la structure classique du thème.

C’est la solution la plus technique, mais aussi la plus propre pour des pages spéciales, comme des campagnes publicitaires ou des intégrations externes. Elle assure un contrôle total sur l’affichage de la page.