> ## Documentation Index
> Fetch the complete documentation index at: https://translations.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Experiment Center et intégration des modèles de page

> Comment le contexte d’expérience se transmet dans les modèles de page et les partials d’Auth0 Universal Login, et comment adapter le rendu du modèle selon la variante.

export const ReleaseStageNotice = ({feature, stage, plans, contact, terms}) => {
  const stageTextMap = {
    "beta": "Bêta",
    "ea": "Accès anticipé"
  };
  const stageText = stageTextMap[stage] || "une étape du cycle de publication";
  const prsLink = "/docs/troubleshoot/product-lifecycle/product-release-stages";
  const linkify = (text, url) => {
    return <a href={url} target="_blank" rel="noreferrer" class="link">{text}</a>;
  };
  const includeDetails = (plans, contact, terms) => {
    const hasDetails = terms || plans || contact;
    if (!hasDetails) return null;
    return <span data-as="p">
            {plans && <>Cette fonctionnalité est offerte avec les {linkify(`${plans} forfaits`, "https://auth0.com/pricing")}. </>}
            {contact && "Pour y participer, communiquez avec " + contact + ". "}
            {terms && <>En utilisant cette fonctionnalité, vous acceptez les conditions applicables de l’essai gratuit énoncées dans le {linkify("Master Subscription Agreement", "https://www.okta.com/legal")} d’Okta.</>}
        </span>;
  };
  return <Warning>
            <span data-as="p">
                <strong>La fonctionnalité {feature} est en {linkify(stageText, prsLink)}.</strong>
            </span>

            {includeDetails(plans, contact, terms)}
        </Warning>;
};

<ReleaseStageNotice feature="Auth0 Experiment Center" stage="beta" terms="true" contact="assistance Auth0" />

Lorsqu’une expérience est active et qu’une variante est attribuée, Experiment Center injecte automatiquement le contexte de l’expérience dans le contexte de rendu du [modèle de page](/fr-CA/docs/customize/login-pages/universal-login/customize-templates#customize-universal-login-page-templates). Les modèles de page ne nécessitent aucune étape d’activation : le contexte de l’expérience est transmis à tous les modèles sans condition lorsqu’une expérience est active. Les modèles reçoivent ce contexte sous la forme d’une variable locale nommée `experiment`.

<Warning>
  Pendant la période bêta, Experiment Center fonctionne uniquement sur les locataires de développement. Les locataires de production ne sont pas pris en charge.
</Warning>

<div id="available-context-fields">
  ## Champs de contexte disponibles
</div>

Les champs suivants sont disponibles dans le modèle de page lorsqu’une expérience est active :

| **Variable**               | **Type** | **Description**                                                       |
| -------------------------- | -------- | --------------------------------------------------------------------- |
| `experiment.experiment_id` | string   | L’ID de l’expérience active                                           |
| `experiment.variation_id`  | string   | L’ID de la variante attribuée                                         |
| `experiment.config`        | object   | Configuration fusionnée : paramètres de base + surcharges de variante |
| `experiment.is_control`    | boolean  | Indique s’il s’agit de la variante témoin                             |

Lorsqu’aucune expérience n’est active, `experiment` est `null` (ou n’est pas présent). Vérifiez toujours que la valeur n’est pas nulle avant de l’utiliser.

<div id="experimentconfig-structure">
  ### Structure de `experiment.config`
</div>

`experiment.config` est un dictionnaire clé-valeur dans lequel chaque clé correspond à un nom de paramètre et chaque valeur est un objet doté d’une propriété `value` :

```
experiment.config.my_param.value  → the parameter's value for this variation
```

Chaque paramètre défini dans l’indicateur de fonctionnalité a une valeur dans `config`. Experiment Center fusionne les paramètres de base avec les remplacements de la variante avant de les injecter; vous n’avez donc jamais à chercher vous-même la valeur par défaut.

<div id="read-a-parameter-in-a-template">
  ## Lire un paramètre dans un modèle
</div>

Les modèles de page Auth0 Universal Login utilisent EJS. Les exemples ci-dessous utilisent la syntaxe EJS.

**Syntaxe EJS :**

```html theme={null}
<%= experiment && experiment.config.heading_text.value %>
```

Avec une vérification de valeur nulle :

```html theme={null}
<% if (experiment) { %>
  <h1><%= experiment.config.heading_text.value %></h1>
<% } else { %>
  <h1>Create your account</h1>
<% } %>
```

<div id="customize-signup-and-login-with-partials">
  ## Personnaliser Signup et Login avec des Partials
</div>

Lorsque vous personnalisez les invites Signup et Login à l’aide de [partials](/fr-CA/docs/customize/login-pages/universal-login/customize-signup-and-login-prompts#manage-partials-programmatically), le contexte de l’expérience est transmis explicitement dans votre partial.

Dans le partial, la même variable `experiment` est disponible :

```html theme={null}
<!-- partials/signup-header.ejs -->
<header>
  <h1>
    <% if (experiment && experiment.config.heading_text) { %>
      <%= experiment.config.heading_text.value %>
    <% } else { %>
      Create your account
    <% } %>
  </h1>
</header>
```

<div id="example-signup-headline-copy-variant">
  ## Exemple : variante du texte du titre de la page d’inscription
</div>

Cet exemple montre un indicateur de fonctionnalité avec un paramètre String qui contrôle le titre de la page d’inscription. La variante témoin utilise "Créez votre compte" ; la variante de traitement utilise "Inscrivez-vous en quelques secondes."

**Paramètres du indicateur de fonctionnalité :**

```json theme={null}
{
  "signup_headline": {
    "type": "string",
    "value": "Create your account",
    "description": "Headline text on the signup screen"
  }
}
```

**Variante témoin :** overrides vides (hérite de `signup_headline: "Create your account"`)

**Variante de traitement :**

```json theme={null}
{
  "overrides": {
    "signup_headline": { "value": "Join in seconds" }
  }
}
```

**Code du modèle :**

```html theme={null}
<!-- signup.ejs -->
<div class="signup-container">
  <h1>
    <% if (experiment) { %>
      <%= experiment.config.signup_headline.value %>
    <% } else { %>
      Create your account
    <% } %>
  </h1>

	{%- auth0:widget -%}
</div>
```

Les utilisateurs affectés à la variante témoin voient "Créez votre compte." Les utilisateurs du groupe test voient "Inscrivez-vous en quelques secondes." Les utilisateurs sans expérimentation active voient aussi "Créez votre compte" (la branche else).

<div id="example-conditional-ui-element">
  ## Exemple : élément d’interface utilisateur conditionnel
</div>

Cet exemple utilise un paramètre booléen pour afficher ou masquer un élément d’interface utilisateur supplémentaire :

```html theme={null}
<!-- login.ejs -->
<% if (experiment && experiment.config.show_social_proof.value === true) { %>
  <div class="social-proof">
    <p>Join 2 million people who sign in with their passkey.</p>
  </div>
<% } %>

{%- auth0:widget -%}
```

La comparaison `=== true` (plutôt qu’un test « truthy ») empêche l’élément de s’afficher lorsque `experiment` est `null` ou lorsque le paramètre est absent.

<div id="safe-defaults-when-no-experiment-is-active">
  ## Valeurs par défaut sûres lorsqu’aucune expérience n’est active
</div>

Lorsqu’aucune expérience n’est active, `experiment` vaut `null` dans le contexte du modèle. Structurez vos modèles de façon à ce qu’ils s’affichent toujours correctement, même en l’absence de contexte d’expérience :

```html theme={null}
<h1>
  <%= (experiment && experiment.config.page_title && experiment.config.page_title.value)
      || "Default page title" %>
</h1>
```

Ou utilisez des blocs if/else explicites (plus lisibles lorsque les conditions sont complexes) :

```html theme={null}
<% if (experiment && experiment.config.page_title) { %>
  <h1><%= experiment.config.page_title.value %></h1>
<% } else { %>
  <h1>Default page title</h1>
<% } %>
```

Codez en dur les valeurs de repli dans vos modèles. Elles correspondent à la base de référence de la variante témoin, de sorte que vos modèles se comportent correctement autant lorsqu’aucune expérience n’est en cours que lorsque la variante témoin est attribuée.