# Bannière

Elles se distinguent des Images par l'option d'ajouter un lien et/ou une description par dessus l'image.

### Exemples d’utilisation

* Ajouter une bannière sur la page “Contactez-nous” pour indiquer aux clients les horaires d’ouverture de la boutique ou du SAV
* Ajouter une bannière avec les détails d’une promo sur la page d’accueil qui redirige vers la page des produits concernés
* Ajouter des informations à propos des frais de livraison gratuits sur les fiches produits de tous les articles ayant un prix supérieur à 50€.
* Afficher une bannière avec les informations à propos des frais de livraison et un lien vers la page des Conditions de livraison dans le menu du site.

### Options de configuration

* Possibilité d’ajouter une image spécifique pour la version mobile de votre site
* Créer une redirection rapide vers une page spécifique au clique sur la bannière
* Ajouter un texte au dessus de la bannière
* Gestion des styles CSS avancés

![](/files/-Mk2dZn26LgL96A1StAj)

Les molécules de type "bannière" peuvent être configurées en mode "*Lazy Loading*". Cette option retardera le téléchargement de l'image qui sera affichée après l’affichage de tout le contenu de la page. Cela permet de réduire l'impact des images sur la vitesse de chargement de la page.

{% hint style="info" %}
À partir de la version 1.3.0 d’Atomic Suite,vous pouvez configurer une banniere pour ouvrir le lien dans le même onglet du navigateur ou dans un nouvel onglet.
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://atomic-suite.gitbook.io/atomic-suite/documentation-atomic/documentation-utilisateur/animation-des-contenus-dans-atomic-suite/liste-de-molecules/banniere.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.