--- url: 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/demarrage/font-awesome-7' title: 'Font Awesome 7 dans DXPR Builder | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T14:42:45+00:00' updated: '2026-10-24T19:36:26+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: |- DXPR Builder fait passer ses icônes Font Awesome Free intégrées de la version 6.7.2 à la 7.3.1. Les pages continuent de fonctionner sans aucune modification : chaque icône d’une page enregistrée s’affiche toujours, à la même taille et au même endroit. Les icônes elles-mêmes sont redessinées, donc légèrement différentes. Cette page présente le changement et liste les quelques cas à vérifier après la mise à jour. tags: - 'Install and update' image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' published: true og: site_name: DXPR updated_time: '2026-10-24T19:36:26+0000' 'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.' schema: '@context': 'https://schema.org' '@graph': - mainEntity: { } - '@type': TechArticle headline: 'Font Awesome 7 dans DXPR Builder' description: |- DXPR Builder fait passer ses icônes Font Awesome Free intégrées de la version 6.7.2 à la 7.3.1. Les pages continuent de fonctionner sans aucune modification : chaque icône d’une page enregistrée s’affiche toujours, à la même taille et au même endroit. Les icônes elles-mêmes sont redessinées, donc légèrement différentes. Cette page présente le changement et liste les quelques cas à vérifier après la mise à jour. image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T14:42:45+0000' dateModified: '2026-10-24T19:36:26+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/demarrage/font-awesome-7' articleSection: 'Installer et mettre à jour' - '@type': WebPage '@id': 'https://dxpr.com/fr/hc/documentation/apprendre-dxpr-builder/demarrage/font-awesome-7' description: |- DXPR Builder fait passer ses icônes Font Awesome Free intégrées de la version 6.7.2 à la 7.3.1. Les pages continuent de fonctionner sans aucune modification : chaque icône d’une page enregistrée s’affiche toujours, à la même taille et au même endroit. Les icônes elles-mêmes sont redessinées, donc légèrement différentes. Cette page présente le changement et liste les quelques cas à vérifier après la mise à jour. 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) /[Commencer ici](/fr/hc/documentation/learn-dxpr-builder/start-here) /[Installer et mettre à jour](/fr/hc/documentation/learn-dxpr-builder/start-here/install) # Font Awesome 7 dans DXPR Builder. Apprendre DXPR BuilderCommencer iciInstaller et mettre à jour ## Dans ce guide Guides associés - [Bibliothèques d’icônes](/fr/hc/documentation/apprendre-dxpr-builder/personnalisation/bibliotheques-d-icones) - [Ajouter une icône](/fr/hc/documentation/apprendre-dxpr-builder/elements/icone) - [Mettre à jour DXPR Builder](/fr/hc/documentation/apprendre-dxpr-builder/demarrage/mettre-a-jour) - [Journal des changements](/fr/hc/documentation/apprendre-dxpr-builder/demarrage/journal-des-modifications) DXPR Builder fait passer ses icônes Font Awesome Free intégrées de la version 6.7.2 à la 7.3.1. Les pages continuent de fonctionner sans aucune modification : chaque icône d’une page enregistrée s’affiche toujours, à la même taille et au même endroit. Les icônes elles-mêmes sont redessinées, donc légèrement différentes. Cette page présente le changement et liste les quelques cas à vérifier après la mise à jour. ## Ce qui change sur vos pages - **Nouveaux dessins d’icônes.** Font Awesome 7 redessine ses icônes avec des formes plus épaisses et plus rondes. Les icônes Regular (contour) gagnent des traits plus épais. Les logos de marques ne changent quasiment pas. - **Même mise en page.** Font Awesome 7 donne à chaque icône une chasse fixe par défaut, ce qui décalerait les icônes étroites vers la droite. DXPR Builder conserve le comportement de Font Awesome 6 sur ses pages et dans l’éditeur, donc les icônes gardent leur position et leur espacement. Quelques icônes redessinées sont légèrement plus étroites, comme house et truck. Les icônes avec la classe `fa-fw`, comme les liens sociaux, gardent une chasse fixe comme avant. - **Mêmes noms de classes.** Les pages enregistrées gardent leurs classes d’icônes, comme `fas fa-house`. Les classes de Font Awesome 4 et 5 continuent de fonctionner grâce aux styles de compatibilité, qui couvrent toujours les mêmes 464 anciens noms. ## Avant et après Chaque vignette montre une icône deux fois. L’icône grise de gauche vient de Font Awesome 6.7.2 ; l’icône noire de droite vient de Font Awesome 7.3.1. ## Nouvelles icônes Le sélecteur d’icônes liste désormais 1 992 icônes gratuites, contre 1 895 avant. | Style | Font Awesome 6.7.2 | Font Awesome 7.3.1 | |---|---|---| | Solid | 1 402 | 1 422 | | Regular | 163 | 169 | | Brands | 495 | 572 | Les 103 nouvelles icônes comprennent des logos de marques comme Claude, Copilot, Gemini, Fediverse, Codeberg et Forgejo, ainsi que les signes du zodiaque. ## Icônes renommées et supprimées Cinq icônes ont de nouveaux noms. Les pages qui utilisent les anciens noms continuent d’afficher l’icône, car Font Awesome 7 les accepte toujours. Le sélecteur d’icônes ne propose que les nouveaux noms. | Ancien nom | Nouveau nom | |---|---| | `user-large` | `user` | | `user-large-slash` | `user-slash` | | `headphones-simple` | `headphones` | | `handshake-simple` | `handshake` | | `handshake-simple-slash` | `handshake-slash` | Une icône quitte l’ensemble gratuit : `vector-square`. Font Awesome 7 ne la propose que dans son édition payante Pro, donc une page qui utilise `fa-vector-square` n’affiche aucune icône après la mise à jour. Remplacez-la par une icône gratuite comme `draw-polygon` ou `object-group`. ## Ce qui ne change pas - **Licence.** Font Awesome Free garde les mêmes conditions. Les icônes sont sous CC BY 4.0, les polices sous SIL OFL 1.1 et le code sous MIT. - **Noms de bibliothèques.** La bibliothèque Drupal garde son nom machine, `dxpr_builder/elements.font_awesome_6_free`, car les pages enregistrées et le code sur mesure s’y réfèrent. Elle charge désormais Font Awesome 7. - **Prise en charge des navigateurs.** Font Awesome 7 ne livre que des polices WOFF2. Chaque navigateur pris en charge par DXPR Builder lit le WOFF2. ## Vérifiez votre site après la mise à jour 1. **Recherchez dans votre contenu `fa-vector-square`** et remplacez-la comme décrit ci-dessus. 2. **Vérifiez le CSS sur mesure du thème qui dessine lui-même des icônes Font Awesome.**Font Awesome 7 renomme ses polices en « Font Awesome 7 Free » et « Font Awesome 7 Brands ». Le CSS qui règle `font-family` sur « Font Awesome 6 Free » ou « Font Awesome 6 Brands » avec un point de code `content` n’affiche plus l’icône. Utilisez les nouveaux noms, ou les propriétés personnalisées `--fa-family-classic` et `--fa-family-brands`fournies par Font Awesome 7. 3. **Vérifiez le balisage du thème qui repose sur `sr-only`.** Font Awesome 6 définissait une classe `sr-only`, pas Font Awesome 7. Le texte qu’un thème masquait ainsi devient visible. Les thèmes Bootstrap 5 peuvent utiliser `visually-hidden` à la place. 4. **Vérifiez les icônes du thème hors du contenu DXPR Builder.** Les icônes que votre thème affiche hors d’une page DXPR Builder, comme dans un menu ou un pied de page, suivent la chasse fixe de Font Awesome 7. Pour garder aussi les anciennes chasses, définissez `--fa-width: auto` sur leur conteneur. 5. **Videz les caches.** Exécutez `drush cr` et purgez tout cache de CDN ou de proxy inverse pour que les visiteurs reçoivent les nouvelles feuilles de style et polices. ## Et ensuite ? - [Bibliothèques d’icônes](/fr/hc/documentation/learn-dxpr-builder/customization/icon-libraries) : les jeux d’icônes livrés par DXPR Builder et comment les restreindre par rôle. - [Ajouter une icône](/fr/hc/documentation/apprendre-dxpr-builder/elements/icone) : placez et stylisez des icônes sur une page. - [Mettre à jour DXPR Builder](/fr/hc/documentation/apprendre-dxpr-builder/demarrage/mettre-a-jour) : mettez le module à jour en sécurité. - [Journal des changements](/fr/hc/documentation/apprendre-dxpr-builder/demarrage/journal-des-modifications) : ce qui change dans chaque version.