> 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/liste-de-molecules/modal.md).

# Modale

La molécule Modale vous permet d'ajouter des pop-ins à votre site sans avoir besoin de passer par un module externe.

Lorsque vous créez une Modale, vous ajoutez également un bouton sur votre site. Au clic sur ce bouton, une pop-in apparaît.

{% hint style="info" %}
A partir d'Atomic 1.4.3, la Modale permet également l’affichage d’une pop-in sans cliquer sur un bouton, à l’ouverture ou à la fermeture d’une page.&#x20;
{% endhint %}

### Exemples d’utilisation

* Afficher les options de livraison sur la fiche produit.
* Afficher un code de réduction.

### Options de configuration

* Ajout d’un titre du bouton pour afficher la modale
* Choix du style du bouton
* Gestion du contenu de la modal : titre et corps
* Choix de la taille de la modale
* Configurations des classes CSS

![](https://3705992037-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2Fatomic-suite%2F-Mk2WAqyJkTZAseBnqFS%2F-Mk2dZnH8FhZoszmaZiy%2F69.png?generation=1632148829922198\&alt=media)
