---
url: 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/personnalisation/modeles-personnalises'
title: 'Surcharger les modèles DXPR Builder | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T10:59:38+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  DXPR Builder rend ses éléments dans le navigateur, depuis des modèles compilés dans l’éditeur. Il n’y a aucun modèle d’élément à copier dans un thème. Le module livre quatre modèles Twig pour ses propres pages, et vous les surchargez de la façon Drupal normale. Cette page les liste, explique pourquoi le balisage des éléments ne peut pas être surchargé, et pointe vers les chemins que le module prend en charge.
  Modèles Twig surchargeables
  Les modèles vivent dans le dossier templates/ du module :
tags:
  - 'Match your brand'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T17:19:22+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Surcharger les modèles DXPR Builder'
      description: |-
        DXPR Builder rend ses éléments dans le navigateur, depuis des modèles compilés dans l’éditeur. Il n’y a aucun modèle d’élément à copier dans un thème. Le module livre quatre modèles Twig pour ses propres pages, et vous les surchargez de la façon Drupal normale. Cette page les liste, explique pourquoi le balisage des éléments ne peut pas être surchargé, et pointe vers les chemins que le module prend en charge.
        Modèles Twig surchargeables
        Les modèles vivent dans le dossier templates/ du module :
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T10:59:38+0000'
      dateModified: '2026-10-24T17:19:22+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/personnalisation/modeles-personnalises'
      articleSection: 'Aux couleurs de votre marque'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/personnalisation/modeles-personnalises'
      description: |-
        DXPR Builder rend ses éléments dans le navigateur, depuis des modèles compilés dans l’éditeur. Il n’y a aucun modèle d’élément à copier dans un thème. Le module livre quatre modèles Twig pour ses propres pages, et vous les surchargez de la façon Drupal normale. Cette page les liste, explique pourquoi le balisage des éléments ne peut pas être surchargé, et pointe vers les chemins que le module prend en charge.
        Modèles Twig surchargeables
        Les modèles vivent dans le dossier templates/ du module :
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Accueil
            item: 'https://dxpr.com/fr'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: fr
---
[Centre d’aide](/fr/hc)/[Documentation](/fr/hc/documentation) /[Apprendre DXPR Builder](/fr/hc/documentation/learn-dxpr-builder) /[Gérer le site](/fr/hc/documentation/learn-dxpr-builder/manage) /[Aux couleurs de votre marque](/fr/hc/documentation/learn-dxpr-builder/customization) # Surcharger les modèles DXPR Builder.

 Apprendre DXPR BuilderGérer le siteAux couleurs de votre marque

   ## Dans ce guide

 Guides associés

- [Créer une page à partir d’un modèle](/fr/hc/documentation/apprendre-dxpr-builder/modeles-reutilisables/modeles-de-page)
- [Theming](/hc/documentation/learn-dxpr-builder/development/theming)

DXPR Builder rend ses éléments dans le navigateur, depuis des modèles compilés dans l’éditeur. Il n’y a aucun modèle d’élément à copier dans un thème. Le module livre quatre modèles Twig pour ses propres pages, et vous les surchargez de la façon Drupal normale. Cette page les liste, explique pourquoi le balisage des éléments ne peut pas être surchargé, et pointe vers les chemins que le module prend en charge.

## Modèles Twig surchargeables

Les modèles vivent dans le dossier `templates/` du module :

| Modèle | Utilisé pour | Variables |
|---|---|---|
| `dxpr-license-info.html.twig` | Le résumé d’usage sur les pages **User Licenses** et **Content items**, et le bloc **License info** correspondant | `used_count`, `total_count`, `limit`, `block_label`, `total_label`, `used_label`, `more_info_link` |
| `page--dxpr-builder--media-library.html.twig` | L’enveloppe de page du dialogue de médiathèque sous `/dxpr_builder/media-library` | les variables `page` standard |
| `html--dxpr-builder--media-library.html.twig` | L’enveloppe `<html>` du même dialogue | les variables `html` standard |
| `page--people-list.html.twig` | Un point de départ pour la page **People** (`/admin/people`) avec un résumé de licence | les variables `page` standard plus `user_license` |

Les trois premiers marchent tels quels. Drupal ne charge pas `page--people-list.html.twig` depuis le module. DXPR Builder ajoute seulement la suggestion `page__people_list` et la variable `user_license` sur la page People. Pour y montrer le résumé, copiez le fichier dans votre thème d’admin.

Pour surcharger un modèle :

1. Copiez le fichier depuis `modules/contrib/dxpr_builder/templates/` dans le dossier `templates/` du thème qui le rend. Les pages d’admin et le dialogue de médiathèque utilisent le thème d’admin. Le bloc **License info** utilise le thème de la région où vous l’avez placé.
2. Modifiez la copie.
3. Videz les caches avec `drush cr`.

## Pourquoi le balisage des éléments ne peut pas être surchargé

Le balisage de chaque élément est un modèle twig.js dans `dxpr_builder/templates/`, par exemple `elements/alert/alert.twig.html`. Le build compile ces modèles dans `dxpr_builder/dxpr_templates.js`. L’éditeur les rend dans le navigateur et enregistre le HTML résultant dans le champ. Deux choses s’ensuivent :

- Un modèle changé exige une reconstruction de l’éditeur. Les sites qui chargent l’éditeur depuis le CDN DXPR ne peuvent pas du tout utiliser un modèle changé.
- Les pages enregistrées gardent le HTML avec lequel elles ont été enregistrées. Un nouveau modèle n’affecte que les éléments rendus après le changement.

Le module n’offre donc aucune surcharge par site des modèles d’élément. Utilisez l’un des chemins ci-dessous.

## Chemins de personnalisation pris en charge

| Objectif | Chemin |
|---|---|
| Mises en page réutilisables pour les contributeurs | [Modèles de page](/fr/hc/documentation/apprendre-dxpr-builder/modeles-reutilisables/modeles-de-page) et [Modèles d’utilisateur](/fr/hc/documentation/learn-dxpr-builder/reusable-templates/user-templates), tous deux choisis dans le builder |
| Changer l’aspect des éléments | [CSS personnalisé](/fr/hc/documentation/apprendre-dxpr-builder/personnalisation/css-personnalise) dans le thème, visant vos propres classes ou les classes `az-*` fournies |
| Donner aux contributeurs des styles nommés | [Classes utilitaires](/fr/hc/documentation/apprendre-dxpr-builder/personnalisation/classes-utilitaires) depuis le `.info.yml` du thème, et [styles personnalisés](/fr/hc/documentation/apprendre-dxpr-builder/personnalisation/editeur-de-texte#set-up) pour l’éditeur de texte |
| Jeux d’icônes supplémentaires | [Bibliothèques d’icônes](/fr/hc/documentation/apprendre-dxpr-builder/personnalisation/bibliotheques-d-icones) |
| Nouveaux types d’éléments | [Créer des éléments personnalisés](/fr/hc/documentation/apprendre-dxpr-builder/developpement/elements-personnalises) |

## Et ensuite ?

- [Modèles de page](/fr/hc/documentation/apprendre-dxpr-builder/modeles-reutilisables/modeles-de-page) : le système de modèles utilisé par les contributeurs.
- [Thématiser DXPR Builder](/hc/documentation/learn-dxpr-builder/development/theming) : comment le CSS du builder et votre thème vont ensemble.