> For the complete documentation index, see [llms.txt](https://atomic-suite.gitbook.io/atomic-suite/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://atomic-suite.gitbook.io/atomic-suite/documentation-atomic/documentation-utilisateur/animation-des-contenus-dans-atomic-suite/afficher-une-molecule/quest-ce-que-cest-emplacement-dans-le-front-office/comment-afficher-une-molecule-sur-toutes-les-pages-de-votre-site.md).

# Sur toutes les pages

<mark style="background-color:red;">Grâce au type d'emplacement “Structure des pages” vous pouvez ajouter une molécule sur toutes les pages de votre site.</mark>&#x20;

OU --&#x20;

<mark style="background-color:red;">Si vous souhaitez l'afficher sur</mark> [<mark style="background-color:red;">chaque page de votre boutique</mark>](/atomic-suite/documentation-atomic/documentation-utilisateur/animation-des-contenus-dans-atomic-suite/afficher-une-molecule/quest-ce-que-cest-emplacement-dans-le-front-office/comment-afficher-une-molecule-sur-toutes-les-pages-de-votre-site.md)<mark style="background-color:red;">, veuillez utiliser "Structure des pages". --</mark>

Il est recommandé de passer par la page “Structure des pages” (disponible via le menu) pour choisir un hook et ajouter une molécule.

![Atomic Suite By 202 > Animation de Contenu > Structure des pages](/files/-Mk2dZmd0kWHEW8-f8XW)

Il existe 5 groupes de hooks qu’on peut utiliser pour ajouter une molécule :

### **1 - Éléments de navigation : En-tête (Header)**

![](/files/-Mk2dZmeeXcRbTd5bVFQ)

* **displayBanner** : ce hook affiche de nouveaux éléments en haut des pages.
* **displayMenuMobile** : ce hook affiche les nouveaux éléments du menu du mobile.
* **displaySearch** : ce hook affiche les nouveaux éléments à côté de la recherche en haut des pages.
* **displayNav** : ce hook affiche les éléments de navigation de type “Mon compte”, “Panier”.
* **displayNavFullWidth** : ce hook affiche un menu de navigation en pleine largeur en haut de vos pages.
* **displayTop** : ce hook affiche des éléments supplémentaires en haut de vos pages.

![](/files/-Mk2dZmfONsZxgynZOed)

### **2 - Éléments de navigation : Pied de page (Footer)**

![](/files/-Mk2dZmgxImAzaadTDzM)

* **displayFooterBefore** : ajouter des éléments dans une zone au-dessus du pied de page.
* **displayFooter** : ce hook affiche de nouveaux blocs dans le pied de page.
* **displayFooterAfter** : ajouter des éléments dans une zone sous le pied de page.

### **3 - Éléments de navigation : Colonnes**

* **displayLeftColumn** : ce hook affiche les nouveaux éléments dans la colonne de gauche.
* **displayRightColumn** : ce hook affiche les nouveaux éléments dans la colonne de droite.

![Apparence > Thème et logo](/files/-Mk2dZmhFiOZIboxdoGf)

### **4 - Contenu de la page**

* **displayWrapperTop** : ce hook permet d'afficher de nouveaux éléments entre les breadcrumbs et le titre de la catégorie.
* **displayContentWrapperTop** : ce hook affiche de nouveaux éléments au-dessus de la liste des produits.
* **displayContentWrapperBottom** : ce hook permet d'afficher de nouveaux éléments au-dessous de la liste des produits.
* **displayWrapperBottom** : ce hook permet d'afficher de nouveaux éléments au-dessous de la colonne de gauche et de la liste des produits.

### **5 - Éléments avancés**

* **displayAfterBodyOpeningTag** : utilisez ce hook pour la publicité ou les modales que vous souhaitez charger en premier *(l’utilisation par l’équipe 202 est recommandé).*
* **displayBeforeBodyClosingTag** : utilisez ce hook pour vos modaux ou tout contenu que vous souhaitez charger à la fin *(l’utilisation par l’équipe 202 est recommandé).*

<mark style="background-color:purple;">En ajoutant une molécule sur un de ces hooks vous allez l’afficher sur toutes les pages de votre site sauf si vous choisissez de</mark> [<mark style="background-color:purple;">limiter son affichage à certaines pages</mark>](/atomic-suite/documentation-atomic/documentation-utilisateur/animation-des-contenus-dans-atomic-suite/afficher-une-molecule/affichage-conditionnel/comment-limiter-laffichage-dune-molecule-a-certaines-pages.md)<mark style="background-color:purple;">.</mark>