> For the complete documentation index, see [llms.txt](https://help.impact.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.impact.com/brand/fr/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/customize-microsite-layouts-and-pages.md).

# Personnaliser les mises en page et pages du microsite

Les microsites sont l’un des points de contact clés des participants pour votre programme de parrainage. Cet article d’aide explique comment utiliser le *éditeur de microsite* pour personnaliser votre microsite existant afin d’en faire un espace qui reflète votre marque et offre une expérience engageante à vos utilisateurs finaux.

Si vous n’avez pas encore [configuré de microsite](/brand/fr/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/set-up-a-microsite.md) vous devrez d’abord le faire.

1. Dans le menu de navigation de gauche, sélectionnez ![](https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-230534471fef5f40808e921e41ee44e4a06ded03%2Fe6cb9548999afdc1ed3ce4942e4cb5b45b5cecbd323267aac2a7cd1915fccc09.svg?alt=media) **\[Engage] → Contenu**.
2. Sur la *carte Microsite* sélectionnez **Modifier le contenu**.
   * Cette action ouvre l’éditeur de microsite et affiche le *carte Microsite* volet coulissant.
3. Utilisez l’éditeur de microsite pour mettre à jour votre identité visuelle ou ajouter du nouveau contenu, comme des mises en page et des pages.

<div data-with-frame="true"><figure><img src="https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fu8WZu3QIIhdEbGgIEptB%2FScreenshot%202026-05-18%20at%2010.44.26.png?alt=media&#x26;token=45c65550-6e83-4e79-8372-ec2793c4c913" alt="" width="563"><figcaption></figcaption></figure></div>

{% hint style="warning" %}
**Avertissement :** L’éditeur de microsite n’enregistre pas automatiquement vos modifications. Enregistrez fréquemment pour vous assurer de ne pas perdre votre travail.
{% endhint %}

{% stepper %}
{% step %}

## **Étape 1 : modifier l’identité visuelle de votre microsite (facultatif)**

{% tabs %}
{% tab title="Couleurs et police" %}
Votre mise en page Base inclut un composant conteneur de marque qui contrôle la police et les couleurs de marque de votre microsite. Les couleurs de marque sont appliquées à différentes parties du microsite, notamment les couleurs de surbrillance et les couleurs des boutons.

1. Dans le *carte Microsite* volet coulissant, sélectionnez le **mise en page Base**.
2. À gauche, sous *Mise en page actuelle*, sélectionnez **Calques**.
3. Sélectionnez le **Conteneur de marque**.
4. À droite, dans le *Conteneur de marque* menu, modifiez la **couleur de marque** et **police de marque**.

<div data-with-frame="true"><figure><img src="https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-f58dfdd168765b914fd22b232cabd8030450c27f%2F6f54642b7524983137442de4c4ecc2a20984c511b5e26423a5edadc0060f9a45.png?alt=media" alt="" width="223"><figcaption></figcaption></figure></div>

5. Sélectionnez **Enregistrer** dans le coin supérieur droit.
   {% endtab %}

{% tab title="En-tête du site" %}
Vous pouvez ajouter une image d’en-tête cliquable qui redirige vos participants vers une page que vous désignez. Configurez-la dans la mise en page Base.

1. Dans le *carte Microsite* volet coulissant, sélectionnez le **mise en page Base**.
2. À gauche, sous *Mise en page actuelle* ou *Page actuelle*, sélectionnez **Calques**.
3. À droite, dans le *Contenu de l’en-tête du cadre du microsite* menu, fournissez une image et ajustez sa hauteur et sa largeur selon vos besoins.
4. Définissez le chemin de redirection. C’est là que vos participants seront redirigés lorsqu’ils cliqueront sur l’image.
5. Sélectionnez **Enregistrer**.
   {% endtab %}
   {% endtabs %}
   {% endstep %}

{% step %}

## **Étape 2 : créer une mise en page ou une page**

{% tabs %}
{% tab title="Ajouter une page" %}

1. Dans le *carte Microsite* volet coulissant, sélectionnez **carte Microsite**.
   * Cette action ouvre la vue de structure de votre microsite, qui affiche toutes les mises en page et pages.
2. Sélectionnez le **Ajouter une page** bouton.
3. Si nécessaire, utilisez la **Mise en page héritée** liste déroulante pour sélectionner la mise en page que vous souhaitez utiliser comme mise en page parente.

{% hint style="info" %}
**Exemple :** Si vous souhaitez ajouter une page d’accueil à votre site que tout le monde peut voir, qu’il s’agisse ou non d’un participant connecté, vous pouvez imbriquer une nouvelle page dans la mise en page de base.
{% endhint %}

4. Saisissez le **titre de la page** ou le nom de la mise en page.
5. Si nécessaire, ajustez la **clé de page** de votre page. Une clé de page est générée automatiquement à partir du titre de la page, mais vous pouvez la modifier si vous le souhaitez.
6. Saisissez le **URL** de votre page.
   * Ajoutez une barre oblique avant le nom que vous souhaitez utiliser et utilisez des tirets pour une URL comportant plusieurs mots, par ex. `/company-info`.
7. Dans la **Utilisateurs autorisés** liste déroulante, sélectionnez le groupe d’utilisateurs qui peut accéder à la page.
   * **Public :** Visible par tout le monde.
   * **Vérifié :** Participants connectés uniquement.
   * **Non vérifié :** Participants connectés qui n’ont pas vérifié leur adresse e-mail.
8. Dans la **Redirection pour les utilisateurs non autorisés** liste déroulante, sélectionnez la page vers laquelle vous souhaitez rediriger les participants non autorisés.
9. Sélectionnez **Ajouter**.
10. Dans le coin supérieur droit de la page, sélectionnez **Enregistrer**.
    {% endtab %}

{% tab title="Ajouter une mise en page" %}

1. Dans le *carte Microsite* volet coulissant, sélectionnez **carte Microsite**.
   * Cette action ouvre la vue de structure de votre microsite, qui affiche toutes les mises en page et pages.
2. Sélectionnez **Ajouter une mise en page**.
3. Si nécessaire, utilisez la **Mise en page héritée** liste déroulante pour sélectionner la mise en page que vous souhaitez utiliser comme mise en page parente. Ceci est surtout utile pour organiser le site.
4. Saisissez le **Nom de la mise en page** de votre mise en page.
5. Si nécessaire, ajustez la **Clé de mise en page** de votre mise en page. Une clé de mise en page est générée automatiquement à partir du titre de la page, mais vous pouvez la modifier si vous le souhaitez.
6. Sélectionnez **Ajouter**.
7. Dans le coin supérieur droit de la page, sélectionnez **Enregistrer**.
   {% endtab %}
   {% endtabs %}
   {% endstep %}

{% step %}

## **Étape 3 : appliquer un modèle**

Vous pouvez appliquer un modèle à votre nouvelle mise en page ou page si vous ne voulez pas partir de zéro.

1. Dans la *carte Microsite* volet coulissant, utilisez la vue de structure pour sélectionner la mise en page ou la page pour laquelle vous souhaitez utiliser le modèle.
2. À gauche, sous *Mise en page actuelle* ou *Page actuelle*, sélectionnez **Modèles**.
3. Parcourez les modèles disponibles, puis sélectionnez **Appliquer le modèle** sur la carte du modèle que vous souhaitez utiliser.

<div data-with-frame="true"><figure><img src="https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2FmANLKNh0KRWXP8G7Abj6%2FScreenshot%202026-05-18%20at%2010.40.44.png?alt=media&#x26;token=6fec0d57-89af-4cbc-8e23-2fe243a13882" alt="" width="267"><figcaption></figcaption></figure></div>

4. Dans le coin supérieur droit de la page, sélectionnez **Enregistrer**.
   {% endstep %}

{% step %}

## **Étape 4 : modifier la barre latérale du microsite**

Ceci est recommandé si vous souhaitez que les participants connectés puissent accéder à une page depuis le menu de navigation latéral du microsite. Ces étapes vous montreront comment procéder, mais vous pouvez les adapter si vous souhaitez ajouter un élément de barre latérale à une autre mise en page.

1. Dans la *carte Microsite* volet coulissant, sélectionnez **Mise en page Connecté** depuis la vue de structure.
   * Sélectionnez ![](https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-90673bb8db696bdefe7b207cfc07c46caf1d43f1%2Fce7a994978f06dd84cc6a31b890071502b4831990afd8fdd73f73c6d2e203660.png?alt=media) **\[Icône de sortie]** pour fermer le volet coulissant et accéder au canevas d’édition.
2. À droite, dans le *Ajouter* menu, développez la catégorie *Composants du microsite* puis sélectionnez **Élément de barre latérale**.

<div data-with-frame="true"><figure><img src="https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-87da46ebfa6e69752ed1c574a17d0036746d311d%2F125bfdb46d75238f2772523663950b1311a17055d85a39bca25033bc56a45d5e.jpg?alt=media" alt=""><figcaption></figcaption></figure></div>

3. Dans le canevas d’édition, faites glisser le *élément de barre latérale* composant vers une position valide. Les positions disponibles sont indiquées par un message **Ajouter au contenu de la barre latérale** .
   * Sur les écrans plus petits, sélectionnez le ![](https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-71ccc0ed9e3023e12691656e4a063341060fe3bd%2F69bc484dc36b22c013f4fde7e0360a7ae9b8d39164beff2b6fabc9ea6d0efb1d.svg?alt=media) **\[menu hamburger]** pour accéder au **Ajouter au contenu de la barre latérale** bouton.
4. À droite, dans le *Modifier* menu, sélectionnez une **Icône** et **Étiquette** pour représenter la page.
5. Dans la **Chemin de navigation** liste déroulante, sélectionnez le chemin URL de la page vers laquelle les utilisateurs doivent être dirigés.
6. Dans le coin supérieur droit de la page, sélectionnez **Enregistrer**.
   {% endstep %}

{% step %}

## **Étape 5 : prévisualiser et enregistrer**

{% tabs %}
{% tab title="Prévisualiser votre microsite" %}
Vous pouvez prévisualiser l’apparence du microsite pour vos participants.

1. Dans la barre de menu supérieure, basculez entre ![](https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-9a50309ee9d0e10094bf68c9b9ae1999dbec4f48%2F7cf9c6c1f6544aa358de22e77201e216647a70ab22c854c02334f51f45892424.svg?alt=media) **\[Ordinateur]**, ![](https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-02123f07d293035e9e37f19e086187c0e90e7dd0%2F1b889798dd233ebb71c2adcc44be0e2887772538ce7c6357d7ef1ea246c0e564.svg?alt=media) **\[Tablette]** ou ![](https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-04b329f4eb244c77b35e32d9988afc78f428a88f%2Fe05ee6fbf869c562df0a7fbc8a38b177082975c06ddf6adcda9d4c00bd0e43ac.svg?alt=media) **\[Mobile]** pour voir à quoi ressemblera le microsite sur chaque appareil.
2. Pour entrer en mode aperçu, sélectionnez ![](https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-190c6a03e6a68d67509d00452b10fd803bee5c87%2F57c7cba09bd1b97dd75b7c245e517c8d1ca0469d7c57bdc13ee6e427b75a860a.svg?alt=media) **\[Afficher]** dans la barre de menu supérieure.
3. Pour revenir à l’interface d’édition, sélectionnez ![](https://4048883401-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FwMLlMoFBtKJa8ptd3zaw%2Fuploads%2Fgit-blob-60e9ace573178da411cb3be9c6f3b0f4b7e5b524%2F4094fadf599e544cfc618c18eb22087defdb9be38a580cd0041a242a88294e1e.svg?alt=media) **\[Modifier]** dans la barre de menu supérieure.
   {% endtab %}

{% tab title="Enregistrer votre microsite" %}
L’éditeur de microsite n’enregistre pas automatiquement vos modifications. Enregistrez fréquemment pour vous assurer de ne pas perdre votre travail.

1. Après avoir apporté toutes les modifications nécessaires, sélectionnez **Enregistrer** dans le coin supérieur droit.
2. Une fois enregistré, les modifications apparaîtront instantanément dans la version en ligne de votre microsite.
   {% endtab %}
   {% endtabs %}
   {% endstep %}
   {% endstepper %}

Consultez notre article sur [Explication des composants de widget et de microsite](/brand/fr/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/widget-and-microsite-components-explained.md) pour en savoir plus sur les aspects des composants des microsites et des widgets.


---

# 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 by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://help.impact.com/brand/fr/what-would-you-like-to-learn-about/advocate-program/manage-advocate-participant-experiences/microsite-experiences/customize-microsite-layouts-and-pages.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.
