--- url: 'https://dxpr.com/fr/hc/documentation/learn-dxpr-builder/customization/custom-fonts' title: 'Utiliser vos polices de marque sur les pages du builder | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T10:59:34+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: 'DXPR Builder n’a aucun réglage de police à lui : le texte des pages du builder utilise les polices de votre thème. Pour les changer, vous chargez une police web dans le thème et pointez le CSS du thème vers elle. À la fin, chaque page du builder montre votre police de marque, dans l’éditeur et pour les visiteurs. Si votre site tourne sous DXPR Theme, choisissez plutôt les polices dans ses réglages de thème.' tags: - 'Je huisstijl toepassen' image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' published: true og: site_name: DXPR updated_time: '2026-10-24T10:59:34+0000' 'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.' schema: '@context': 'https://schema.org' '@graph': - mainEntity: { } - '@type': TechArticle headline: 'Utiliser vos polices de marque sur les pages du builder' description: 'DXPR Builder n’a aucun réglage de police à lui : le texte des pages du builder utilise les polices de votre thème. Pour les changer, vous chargez une police web dans le thème et pointez le CSS du thème vers elle. À la fin, chaque page du builder montre votre police de marque, dans l’éditeur et pour les visiteurs. Si votre site tourne sous DXPR Theme, choisissez plutôt les polices dans ses réglages de thème.' 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:34+0000' dateModified: '2026-10-24T10:59:34+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/learn-dxpr-builder/customization/custom-fonts' articleSection: 'Je huisstijl toepassen' - '@type': WebPage '@id': 'https://dxpr.com/fr/hc/documentation/learn-dxpr-builder/customization/custom-fonts' description: 'DXPR Builder n’a aucun réglage de police à lui : le texte des pages du builder utilise les polices de votre thème. Pour les changer, vous chargez une police web dans le thème et pointez le CSS du thème vers elle. À la fin, chaque page du builder montre votre police de marque, dans l’éditeur et pour les visiteurs. Si votre site tourne sous DXPR Theme, choisissez plutôt les polices dans ses réglages de thème.' 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 --- [Help Center](/fr/hc)/[Documentation](/fr/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Manage the site](/hc/documentation/learn-dxpr-builder/manage) /[Je huisstijl toepassen](/hc/documentation/learn-dxpr-builder/customization) # Utiliser vos polices de marque sur les pages du builder. Learn DXPR BuilderManage the siteJe huisstijl toepassen ## In this guide Related guides - [Styliser le contenu du builder avec le CSS de votre thème](/fr/hc/documentation/learn-dxpr-builder/customization/custom-css) - [Typography](/hc/documentation/learn-dxpr-builder/element-settings/typography) - [Bibliothèques d’icônes](/fr/hc/documentation/learn-dxpr-builder/customization/icon-libraries) DXPR Builder n’a aucun réglage de police à lui : le texte des pages du builder utilise les polices de votre thème. Pour les changer, vous chargez une police web dans le thème et pointez le CSS du thème vers elle. À la fin, chaque page du builder montre votre police de marque, dans l’éditeur et pour les visiteurs. Si votre site tourne sous DXPR Theme, choisissez plutôt les polices dans ses réglages de thème. ## Avant de commencer - Il faut l’accès aux fichiers de votre thème ; utilisez un thème personnalisé ou un sous-thème. - Vérifiez que la licence de la police permet l’usage sur un site web. - Les étapes utilisent la bibliothèque `global-styling` et `css/custom.css` de [CSS personnalisé](/hc/documentation/learn-dxpr-builder/customization/custom-css). ## Configuration 1. Ajoutez la feuille de style de la police à la bibliothèque dans `mytheme.libraries.yml`. Pour une police Google : ```yaml global-styling: css: theme: 'https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap': { type: external } css/custom.css: {} ``` 2. Définissez la police dans `css/custom.css` : ```css body { font-family: 'Inter', sans-serif; } ``` 3. Videz les caches sous **Configuration** > **Development** > **Performance** (`/admin/config/development/performance`). 4. Ouvrez une page dans le builder et regardez un élément **Text**. ## Héberger la police vous-même Une police auto-hébergée évite une requête vers un tiers, ce qui peut compter pour les règles de confidentialité. 1. Téléchargez la police en format WOFF2 et placez les fichiers dans le dossier `fonts/` du thème. 2. Déclarez chaque graisse dans `css/custom.css`, au-dessus de la règle de l’étape 2 : ```css @font-face { font-family: 'BrandFont'; src: url('../fonts/brandfont.woff2') format('woff2'); font-weight: 400; font-display: swap; } ``` 3. Utilisez `'BrandFont'` dans vos règles `font-family`, retirez la ligne Google de la bibliothèque et videz les caches. ## Ce que vous voyez Le texte de chaque élément du builder utilise la nouvelle police, en mode modification et sur la page publiée. Le panneau **Style** de chaque élément règle toujours taille et couleur ; voir [Changer la taille et la couleur du texte](/hc/documentation/learn-dxpr-builder/element-settings/typography). Le bouton **Font family** de l’éditeur de texte est désactivé par défaut. Il liste les polices web standard de CKEditor, pas les vôtres, donc gardez-le désactivé pour garder les contributeurs dans la marque. ## DXPR Theme DXPR Theme a ses propres réglages de police. Accédez à **Appearance**, ouvrez les réglages de DXPR Theme (`/admin/appearance/settings/dxpr_theme`) et déployez **Fonts**. Il définit **Base Font**, **Headings**, **Navigation**, **Site Name** et **Blockquote** séparément, donc aucun CSS requis pour eux. ## Si vous ne voyez pas la police - **Le texte montre toujours l’ancienne police.** La bibliothèque n’est pas chargée, ou le cache garde l’ancien CSS. Vérifiez que `mytheme.info.yml` liste la bibliothèque, puis videz les caches sous `/admin/config/development/performance`. - **Des titres ou des encadrés gardent une autre police.** Une règle du thème pour cet élément est plus spécifique que `body`. Inspectez le texte dans le navigateur et ajoutez son sélecteur à votre règle. - **Un paragraphe montre une police différente.** Un contributeur lui a appliqué **Font family**. Sélectionnez le texte et cliquez sur **Remove format**, puis décochez **Font family** dans le profil ; voir [Éditeur de texte](/hc/documentation/learn-dxpr-builder/customization/text-editor#toolbar-buttons-per-role). ## Et ensuite ? - [CSS personnalisé](/hc/documentation/learn-dxpr-builder/customization/custom-css) : la bibliothèque et la feuille de style sur lesquelles ces étapes se construisent. - [Changer la taille et la couleur du texte](/hc/documentation/learn-dxpr-builder/element-settings/typography) : ce que les contributeurs règlent par élément. - [Bibliothèques d’icônes](/hc/documentation/learn-dxpr-builder/customization/icon-libraries) : les polices d’icônes livrées avec DXPR Builder.