> For the complete documentation index, see [llms.txt](https://help.citrusad.com/retail-media-interface/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.citrusad.com/retail-media-interface/integration/fr/brand-pages/brand-page-retailer-integration-guide/module-capabilities.md).
# Capacités des modules
Ce document décrit chaque type de module disponible, ses champs, ses contraintes et ses options de configuration. Utilisez-le comme référence destinée aux distributeurs pour savoir ce que chaque module prend en charge et ce que les marques peuvent configurer lors de la création du contenu de leur page marque.
***
## Aperçu des types de modules
| Module | Objectif |
| ------------------- | ------------------------------------------------------------------------------- |
| Bannière Hero | Média pleine largeur avec titre, sous-titre et CTA |
| Image | Image unique avec légende, texte alternatif et lien facultatifs |
| Texte | Titre, slogan, corps de texte ou texte multiligne personnalisé |
| Disposition divisée | Disposition en deux colonnes ou empilée contenant des modules Image et/ou Texte |
| Galerie d'images | Grille d'images avec titre de section, description et CTA facultatifs |
| Menu de filtres | Barre de navigation d'éléments de filtrage étiquetés |
| Grille de produits | Grille de produits sélectionnée avec filtrage et CTA facultatifs |
## Champs communs (tous les modules)
Chaque module partage les champs suivants gérés par le système. Les marques ne les définissent pas directement.
| Champ | Description |
| --------------------------- | ------------------------------------------------------------------------------------------------ |
| `id` | Identifiant unique généré automatiquement |
| `brandPageModuleTemplateId` | Lie le contenu au modèle de module du distributeur |
| `order` | Position d'affichage sur la page (gérée par glisser-déposer) |
| `optionality` | Indique si l'ensemble du module est obligatoire ou peut être ignoré (défini par le distributeur) |
## 1. Bannière Hero
Une bannière pleine largeur qui combine une image de fond, un calque superposé, un texte de titre et un appel à l'action. Il s'agit généralement du premier module de la page marque.
### Média
| Champ | Obligatoire ? | Contraintes |
| ---------------- | ------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------- |
| Image | Obligatoire | Formats : `GIF`, `JPG`, `PNG`, `SVG` · Dimensions min. : définies par le distributeur · Taille max. du fichier : définie par le distributeur |
| Texte alternatif | Obligatoire ou Facultatif (défini par le distributeur) | Texte descriptif pour l'accessibilité |
{% hint style="info" %}
La prise en charge des vidéos est prévue mais pas encore disponible. Seule l'image est actuellement acceptée.
{% endhint %}
### Calque superposé
Le distributeur définit si un calque superposé est disponible sur ce module :
| Paramètre | Comportement |
| --------------------- | ------------------------------------------------------------------------------ |
| `disabled` | Pas de calque superposé — l'image est affichée sans aucune couche de couleur |
| `optional` (autorisé) | La marque peut choisir d'activer ou de désactiver le calque superposé |
| `required` | Le calque superposé est toujours affiché ; la marque ne peut pas le désactiver |
Lorsque le calque superposé est activé, la marque sélectionne le style d'arrière-plan. Le distributeur contrôle les styles proposés :
| Style | Description |
| ---------- | -------------------------------------- |
| `gradient` | Fondu progressif à partir de l'image |
| `solid` | Bloc de couleur unie derrière le texte |
Les deux options peuvent être rendues disponibles simultanément.
### Contenu textuel
| Champ | Obligatoire ? | Contraintes |
| ------------------- | ----------------------------------------------------------------- | --------------------------------------------------------------------------------- |
| Titre | Obligatoire | Nombre max. de caractères : défini par le distributeur |
| Sous-titre | Facultatif | Nombre max. de caractères : défini par le distributeur |
| Texte du bouton CTA | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | Nombre max. de caractères : défini par le distributeur |
| URL du lien du CTA | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | Nombre max. de caractères : défini par le distributeur · Doit être une URL valide |
{% hint style="info" %}
Le texte du CTA et le lien du CTA sont configurés ensemble. Si le CTA est désactivé, aucun des deux champs n'apparaît. Vous ne pouvez pas avoir de lien CTA sans bouton CTA, ou vice versa.
{% endhint %}
### Alignement du texte
Le distributeur définit les options d'alignement disponibles. Valeurs possibles : `left`, `center`, `right`. La marque choisit parmi l'ensemble proposé.
## 2. Image
Une image unique avec une légende facultative, un texte alternatif et une cible de lien.
### Importation d'image
| Champ | Obligatoire ? | Contraintes |
| ---------------- | ------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------- |
| Image | Obligatoire | Formats : `GIF`, `JPG`, `PNG`, `SVG` · Dimensions min. : définies par le distributeur · Taille max. du fichier : définie par le distributeur |
| Texte alternatif | Obligatoire ou Facultatif (défini par le distributeur) | Texte descriptif pour l'accessibilité |
### Légende
| Champ | Obligatoire ? | Contraintes |
| ------- | ------------- | --------------------------------------------------------------------- |
| Légende | Facultatif | Nombre max. de caractères : défini par le distributeur · Ligne unique |
{% hint style="info" %}
La disponibilité de la légende est définie par le distributeur. Si le distributeur n'a pas activé les légendes, le champ n'apparaît pas.
{% endhint %}
### Lien
Chaque image peut facultativement pointer vers une destination. La marque sélectionne l'un des trois types de liens :
| Type de lien | Description |
| ------------ | ----------------------------------------------------------------------------------- |
| `image` | Aucun lien — l'image est non interactive |
| `url` | Navigue vers une URL personnalisée lorsqu'elle est sélectionnée |
| `product` | Navigue vers une page produit spécifique (sélectionnée via le sélecteur de produit) |
### Lignes de texte supplémentaires
Certains modules Image prennent en charge des lignes de texte étiquetées supplémentaires à côté de l'image (par exemple, un titre ou une description affichés sous ou sur l'image). La disponibilité, les libellés, les tailles de police et le caractère obligatoire ou facultatif de chaque ligne sont tous définis par le distributeur.
## 3. Texte
Un module de texte flexible qui prend en charge des variantes sur une ou plusieurs lignes.
### Variantes
Le distributeur définit la variante utilisée par le module :
| Variante | Description |
| ---------- | ------------------------------------------------------------------------------------------------------ |
| `headline` | Une seule ligne de texte en évidence — grande, en gras |
| `tagline` | Une seule ligne d'accompagnement — plus petite que le titre |
| `body` | Un seul bloc de corps de texte — s'affiche sous forme de zone de texte |
| `lines` | Plusieurs lignes de texte nommées, chacune avec sa propre taille de police et son caractère facultatif |
### Champs — variantes sur une seule ligne (`headline`, `tagline`, `body`)
| Champ | Obligatoire ? | Contraintes |
| ----- | ------------- | ----------------------------------------------------------------------------------------- |
| Texte | Obligatoire | Nombre max. de caractères : défini par le distributeur (s'applique à l'ensemble du champ) |
### Champs — variante sur plusieurs lignes (`lines`)
Chaque ligne est définie indépendamment par le distributeur :
| Champ | Obligatoire ? | Contraintes |
| ----------------- | ----------------------------------------------------------------- | ----------------------------------------------------------------------------- |
| Texte de la ligne | Obligatoire ou Facultatif (par ligne, défini par le distributeur) | Nombre max. de caractères : défini par le distributeur (s'applique par ligne) |
| URL de la ligne | Facultatif | Uniquement disponible sur les lignes où `isHyperlink` est activé |
### CTA
| Champ | Obligatoire ? | Contraintes |
| ------------------- | ----------------------------------------------------------------- | ------------------------ |
| Texte du bouton CTA | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | — |
| URL du lien du CTA | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | Doit être une URL valide |
{% hint style="info" %}
Le caractère facultatif du CTA s'applique à la fois au texte et à l'URL. S'il est désactivé, aucun des deux champs n'apparaît.
{% endhint %}
### Alignement
Défini par le distributeur. Valeurs possibles : `left`, `center`, `right`. S'applique à tout le texte du module.
### Largeur maximale
Le distributeur définit une contrainte de `maxWidth` qui limite la largeur d'affichage du bloc de texte (par exemple, `600px` or `80%`). Il s'agit d'une contrainte d'affichage, pas d'une contrainte de contenu.
## 4. Disposition fractionnée
Un conteneur de disposition qui contient deux modules enfants ou plus organisés en colonnes ou en lignes. Les enfants sont des modules **Image** et/ou **Texte**. L'imbrication est prise en charge jusqu'à une profondeur de 2, mais vous ne pouvez pas imbriquer des dispositions fractionnées au niveau racine.
### Options de disposition
| Disposition | Options |
| ----------- | ----------------------------------------------------------------------------------------------------------- |
| `columns` | Côte à côte. Ratio : `50:50`, `33:67`, or `67:33` (définis par le distributeur selon les options proposées) |
| `rows` | Empilés verticalement |
### Espacement
L'espace entre les enfants est défini par le distributeur, à partir de l'échelle d'espacement du guide de style du distributeur.
### Enfants
| Propriété | Valeur |
| ------------------------- | -------------------------------------------------------------------------------------------------------------- |
| Types d'enfants autorisés | `Image`, `Text` |
| Nombre d'enfants | Défini par le distributeur (`numChildren`) |
| Imbrication | Une disposition fractionnée enfant peut elle-même contenir des modules `Image` et `Text` (profondeur max. : 2) |
{% hint style="info" %}
Important
Vous ne pouvez pas placer une Bannière Hero, une Galerie d'images, un Menu de filtres ou une Grille de produits à l'intérieur d'une disposition fractionnée.
{% endhint %}
## 5. Galerie d'images
Une grille d'images avec un en-tête de section facultatif, une description et un CTA en bas.
### En-tête de section
| Champ | Obligatoire ? | Contraintes |
| ---------------------- | ----------------------------------------------------------------- | ----------- |
| Titre de section | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | — |
| Description de section | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | — |
### Disposition de la galerie
Définit par le distributeur par point de rupture :
| Propriété | Description |
| ------------------ | ----------------------------------------------------------------------------------- |
| Colonnes | Nombre de colonnes sur mobile, tablette et ordinateur (défini par le distributeur) |
| Hauteur de l'image | Hauteur en pixels ou en pourcentage par point d'arrêt (définie par le distributeur) |
| Espacement | Espace entre les images (d'après la charte graphique du distributeur) |
### Images
| Propriété | Contraintes |
| ----------------------- | ----------------------------------------------------------------- |
| Nombre d'images minimum | Défini par le distributeur (doit en ajouter au moins ce nombre) |
| Nombre d'images maximum | Défini par le distributeur (ne peut pas dépasser ce nombre) |
| Formats | `GIF`, `JPG`, `PNG`, `SVG` |
| Dimensions min | Défini par le distributeur |
| Taille de fichier max | Défini par le distributeur |
| Texte alternatif | Obligatoire ou Facultatif par image (défini par le distributeur) |
| Légende par image | Facultatif, nombre max de caractères : défini par le distributeur |
| Lien par image | `image` (aucun) · `url` · `product` — identique au module Image |
### Lignes de texte supplémentaires par image
Identique au module Image — libellés, tailles de police et caractère facultatif par ligne définis par le distributeur.
### CTA (bas de la galerie)
| Champ | Obligatoire ? | Contraintes |
| ------------------- | ----------------------------------------------------------------- | ------------------------ |
| Texte du bouton CTA | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | — |
| URL du lien du CTA | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | Doit être une URL valide |
| Alignement du CTA | `left`, `center`, `right` (défini par le distributeur) | — |
## 6. Menu de filtres
Une barre de navigation horizontale d'éléments de filtrage étiquetés. Utilisez-la pour permettre aux acheteurs de filtrer le contenu sur la page (par exemple, par catégorie ou sous-catégorie).
### Éléments
| Propriété | Contraintes |
| ------------------------- | --------------------------------------------------------------------------------------------------------- |
| Nombre d'éléments minimum | Défini par le distributeur (doit en ajouter au moins ce nombre) |
| Nombre d'éléments maximum | Défini par le distributeur (ne peut pas dépasser ce nombre) |
| Texte du libellé | Nombre max. de caractères : défini par le distributeur |
| Valeur du filtre | Valeur interne utilisée par la logique de filtrage. Nombre max de caractères : défini par le distributeur |
### Alignement
Défini par le distributeur. Valeurs possibles : `left`, `center`.
Les éléments de filtrage peuvent être réordonnés. Le libellé est ce que l'acheteur voit ; la valeur est ce qui est appliqué comme filtre. Il n'est pas nécessaire qu'il s'agisse de la même chaîne de caractères.
## 7. Grille de produits
Une grille sélectionnée de produits choisis par la marque, avec en-tête de section, filtrage et CTA facultatifs.
### En-tête de section
| Champ | Obligatoire ? | Contraintes |
| ---------------------- | ----------------------------------------------------------------- | ----------- |
| Titre de section | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | — |
| Description de section | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | — |
### Produits
| Propriété | Contraintes |
| -------------------------- | ----------------------------------------------------------------------- |
| Nombre de produits minimum | Défini par le distributeur |
| Nombre de produits maximum | Défini par le distributeur |
| Source des produits | Sélectionné via le sélecteur de produits dans le catalogue de la marque |
| Ordre d'affichage | Glisser-déposer dans le module |
### CTA de la fiche produit
Le distributeur décide si un bouton CTA apparaît sur chaque fiche produit :
| Paramètre | Comportement |
| --------- | --------------------------------------------------------------------------------- |
| Désactivé | Aucun bouton CTA sur les fiches produits |
| Activé | Un bouton CTA est affiché ; le distributeur définit le texte du libellé du bouton |
{% hint style="info" %}
Lorsqu'il est activé, toutes les fiches produits de la grille partagent le même libellé de CTA (défini par le distributeur, non par la marque).
{% endhint %}
### Filtrage
Le distributeur peut facultativement activer le filtrage sur la page pour la grille de produits :
| Paramètre | Description |
| ------------------- | ------------------------------------------------------------------------- |
| `enabled` | Les acheteurs peuvent filtrer la grille de produits |
| `showActiveFilter` | Met en surbrillance le filtre actuellement actif |
| `showResultCount` | Affiche le nombre de résultats correspondant au filtre actif |
| `emptyStateMessage` | Message personnalisé affiché lorsqu'aucun produit ne correspond au filtre |
{% hint style="info" %}
Le filtrage fonctionne conjointement avec un module Menu de filtres. Les valeurs de filtre définies sur les produits doivent correspondre aux valeurs des éléments de filtrage du Menu de filtres.
{% endhint %}
### CTA (bas de la grille)
| Champ | Obligatoire ? | Contraintes |
| ------------------- | ----------------------------------------------------------------- | ------------------------ |
| Texte du bouton CTA | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | — |
| URL du lien du CTA | Obligatoire, Facultatif ou Désactivé (défini par le distributeur) | Doit être une URL valide |
| Alignement du CTA | `left`, `center`, `right` (défini par le distributeur) | — |
## Référence des contraintes
### `ContentLimit` — modèle de contrainte de champ texte
| Valeur | Signification |
| ----------------------- | ---------------------------------------------------------------------------------------- |
| `disabled` | Le champ n'est pas disponible dans ce modèle |
| `allowed` + `maxChars` | Le champ est facultatif ; s'il est renseigné, ne peut pas dépasser `maxChars` caractères |
| `required` + `maxChars` | Le champ doit être rempli ; ne peut pas dépasser `maxChars` caractères |
### `ImageConstraints` — modèle de contrainte de téléchargement d'image
| Propriété | Description |
| ----------------- | ------------------------------------------------------------------------------------- |
| `altOptionality` | `required` or `allowed` |
| `minWidth` | Largeur minimale de l'image en pixels (optionnel) |
| `minHeight` | Hauteur minimale de l'image en pixels (optionnel) |
| `maxFileSizeMb` | Taille maximale du fichier en mégaoctets (optionnel) |
| `acceptedFormats` | Sous-ensemble de `GIF`, `JPG`, `PNG`, `SVG` (optionnel — tous acceptés si non défini) |
### `CtaConfig` — modèle de contrainte d'appel à l'action
| Propriété | Description |
| ------------- | ----------------------------------- |
| `optionality` | `required` · `allowed` · `disabled` |
| `alignment` | `left` · `center` · `right` |
## Ce qui est défini par le distributeur vs. fixe
| Configuration | Le distributeur définit ceci | Fixé par la plateforme |
| ---------------------------------------------------- | :------------------------------------------------: | :------------------------------------: |
| Si un module peut être ignoré | ✅ | |
| Limites maximales de caractères | ✅ | |
| Dimensions min de l'image et taille max du fichier | ✅ | |
| Quels formats d'image sont acceptés | ✅ (sous-ensemble pris en charge par la plateforme) | |
| Si le CTA est obligatoire, optionnel ou désactivé | ✅ | |
| Si la superposition est disponible (Hero) | ✅ | |
| Quelles options d'alignement de texte sont proposées | ✅ | |
| Options de ratio de colonnes (Split Layout) | ✅ | |
| Nombre min/max d'images (Image Gallery) | ✅ | |
| Nombre min/max de produits (Product Grid) | ✅ | |
| Types de modules disponibles | | ✅ (7 types, fixe) |
| Type de média pris en charge (Hero) | | ✅ (image uniquement ; vidéo planifiée) |
| Types de liens pour les images | | ✅ (image · url · product) |
| Profondeur maximale d'imbrication du Split Layout | | ✅ (profondeur 2) |
| Types d'enfants autorisés pour le Split Layout | | ✅ (Image et Texte uniquement) |
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## 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, and the optional `goal` query parameter:
```
GET https://help.citrusad.com/retail-media-interface/integration/fr/brand-pages/brand-page-retailer-integration-guide/module-capabilities.md?ask=&goal=
```
`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.
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.