Skip to content

Tout pour WordPress, le développement web — et plus encore

🔤 Polices personnalisées pour un site WordPress : un guide étape par étape 2026

🔤 Polices personnalisées pour un site WordPress : un guide étape par étape 2026

La police par défaut trahit un site WordPress au premier coup d’œil. Une police système crie «je n’ai rien configuré» plus fort que n’importe quel template gratuit.

Changer la police prend dix minutes. Vous n’avez pas besoin d’être développeur front-end, et vous n’avez pas besoin de payer. Les cinq méthodes ci-dessous couvrent tout: des débutants qui ont peur de toucher au code aux propriétaires de site qui veulent un contrôle total.

Nous avons compilé des méthodes qui fonctionnent en 2026. De la pire approche encore recommandée dans des tutoriels obsolètes jusqu’à la méthode canonique «WordPress».

💡 Aperçu rapide:

  • Choisissez une police: Google Fonts (gratuit, plus de 1500 polices), Adobe Fonts (abonnement Creative Cloud), ou hébergez votre propre fichier WOFF2 sur votre serveur.
  • Décidez si vous avez besoin d’une extension (plus simple, interface dans le personnalisateur) ou d’une connexion manuelle via functions.php (plus propre, plus rapide, sans dépendance à un code tiers).
  • Pour la méthode manuelle: ajoutez wp_enqueue_style dans functions.php et font-family dans le CSS.
  • Pour la méthode par extension: installez EasyFonts ou Use Any Font, sélectionnez une police et enregistrez.
  • Testez le résultat dans différents navigateurs et sur mobile: chaque police supplémentaire ajoute 50 à 200 Ko au chargement de la page.

Pourquoi changer les polices de votre site

La police façonne les premières impressions plus vite que les couleurs ou les images. Des chercheurs de l’Université du Michigan ont montré dès 2008 qu’un texte composé dans une police complexe est inconsciemment perçu comme «difficile». Les lecteurs sont moins enclins à suivre des instructions et surestiment le temps nécessaire pour accomplir une tâche.

Le choix entre empattement et sans empattement compte aussi. Les polices à empattement (Georgia, Merriweather) augmentent le temps de lecture mais renforcent l’autorité perçue. Les polices sans empattement (Roboto, Inter) accélèrent la lecture et fonctionnent mieux sur les écrans mobiles. Ce n’est pas une supposition: une revue des recherches sur la psychologie de la typographie confirme l’effet en pratique.

Pour un site WordPress, la bonne police résout trois problèmes:

  • Reconnaissance de marque. Une police de titrage unique évite que votre site ressemble à «un blog de plus sur un thème standard».
  • Lisibilité. Une taille, une hauteur de ligne et un contraste appropriés réduisent le taux de rebond.
  • Hiérarchie visuelle. Des polices différentes pour les titres et le corps du texte guident le regard du visiteur.

Passons maintenant à la pratique.

Où trouver des polices pour WordPress

Il existe trois sources: Google Fonts, Adobe Fonts et l’auto-hébergement. Examinons chacune d’elles.

Google Fonts: gratuit et sans inscription

La source la plus évidente. Plus de 1500 polices, licence ouverte, mise en cache via le CDN de Google. Convient à 95% des sites.

Rendez-vous sur fonts.google.com. L’interface vous accueille avec une grille de cartes montrant un échantillon de chaque police.

Page d'accueil de Google Fonts avec la grille de polices

Les filtres se trouvent à gauche. Vous pouvez filtrer par catégorie (Serif, Sans Serif, Display, Handwriting, Monospace), langue, nombre de styles et graisse. Les filtres s’appliquent instantanément et les résultats se mettent à jour sans rechargement.

Survolez une police pour voir un menu permettant de modifier le texte d’exemple. Saisissez votre propre titre ou paragraphe et voyez le rendu.

Aperçu de la police au survol dans Google Fonts

Cliquez sur «Voir le spécimen» pour ouvrir la page de la police avec tous les styles, la table des glyphes et des échantillons dans différentes tailles.

Page détaillée d'une police dans Google Fonts montrant tous les styles

Si une police vous plaît, cliquez sur le plus rouge dans le coin de la carte. La police est ajoutée au panneau de collection en bas de l’écran. Vous pouvez ajouter plusieurs familles: une pour les titres, une autre pour le corps du texte.

Panneau de collection avec les polices sélectionnées dans Google Fonts

Développez le panneau de collection pour voir les onglets «Intégrer» et «Personnaliser».

Onglet Intégrer avec le code pour ajouter des polices à un site

Dans l’onglet «Personnaliser», sélectionnez les styles dont vous avez besoin. Important: ne cochez pas tout. Chaque style est un fichier supplémentaire que le navigateur charge. Pour un site classique, Regular (400) et Bold (700) suffisent, parfois Italic. L’indicateur de vitesse dans le coin supérieur droit montre à quel point la police ralentira le chargement.

Onglet Personnaliser pour sélectionner les styles de police dans Google Fonts

Si votre site utilise un alphabet non latin, sélectionnez le jeu de caractères approprié en bas de la page. Pour le cyrillique, il s'agit de Cyrillic.

Sélection du jeu de caractères linguistiques pour une police dans Google Fonts

Deux boutons fléchés en haut: celui de gauche permet de partager la collection, celui de droite télécharge les fichiers de la police sur votre ordinateur. Pratique pour Photoshop ou si vous décidez d'héberger la police vous-même.

Boutons Partager la collection et Télécharger les polices dans Google Fonts

Adobe Fonts (anciennement Typekit)

Si vous disposez d'un abonnement Creative Cloud, Adobe Fonts vous donne accès à des polices professionnelles comme Futura, Minion Pro et Myriad. Les polices se connectent via CSS, de manière similaire à Google Fonts. L'offre Creative Cloud gratuite inclut un jeu de base, ce qui suffit pour la plupart des projets.

Polices personnalisées en WOFF2

Vous avez acheté une police sous licence ou téléchargé une police libre depuis Font Squirrel? Convertissez-la en WOFF2 (format moderne pour polices web, compression Brotli, pris en charge par 97% des navigateurs) et téléversez-la sur votre serveur. Avantage: aucune dépendance à un CDN tiers et conformité RGPD. Inconvénient: la police se charge depuis votre serveur, ce qui est inévitablement plus lent que le CDN de Google.

5 Façons d’ajouter des polices personnalisées à WordPress

Il existe exactement cinq méthodes. Nous allons passer de «à éviter» à la méthode idéale pour WordPress.

Méthode 1: CSS @import (à éviter)

Google Fonts propose un onglet @import avec une chaîne CSS prête à l’emploi. Cela semble pratique: copier, coller, terminé.

Onglet Importer dans Google Fonts avec le code CSS prêt

Techniquement, le code se place au début du fichier style.css de votre thème enfant:

1/*
2 Theme Name: Twenty Seventeen Child
3 Theme URI: https://wordpress.org/themes/twentyseventeen/
4 Template: twentyseventeen
5 Author: the WordPress team
6 Author URI: https://wordpress.org/
7 Version: 1.0
8*/
9
10@import url('https://fonts.googleapis.com/css?family=Open+Sans|Roboto');
11
12/* additional CSS goes here */

Pourquoi est-ce la pire option? @import empêche le navigateur de charger plusieurs feuilles de style en parallèle. Le navigateur télécharge le fichier CSS, y découvre la directive @import, et seulement ensuite va chercher la police. Un chargement séquentiel au lieu de parallèle, cela représente 200 à 400 ms perdues par police. Sur mobile, c’est critique.

N’utilisez jamais @import pour les polices.

Les bibliothèques de polices fournissent une balise <link> à insérer dans le <head>. Vous pouvez la placer directement dans header.php, le fichier de template que possède chaque thème WordPress.

Modification du fichier header.php du thème WordPress pour insérer des polices

Placez la balise <link> entre les balises <head> et </head>. Si vous travaillez avec un thème enfant, copiez le header.php du thème parent dans le thème enfant et modifiez-le à cet endroit.

Cette méthode fonctionne mais elle est fragile: les mises à jour du thème écraseront vos modifications si vous n’utilisez pas de thème enfant. De plus, mélanger contenu et code dans les templates est une mauvaise pratique. Cela peut convenir pour un test ponctuel, pas pour un usage permanent.

Méthode 3: @font-face et auto-hébergement des polices

Si la police se trouve sur votre serveur, vous devez la déclarer avec la directive @font-face dans votre feuille de style. Commencez par téléverser les fichiers de police (WOFF2, WOFF) via FTP dans le dossier de votre thème enfant, par exemple wp-content/themes/yourtheme-child/fonts/.

Ajoutez ensuite ceci dans style.css:

1@font-face {
2 font-family: 'Roboto';
3 src: url('fonts/Roboto-Regular.woff2') format('woff2'),
4 url('fonts/Roboto-Regular.woff') format('woff');
5 font-weight: normal;
6 font-style: normal;
7 font-display: swap;
8}

Le paramètre font-display: swap est important: il indique au navigateur d’afficher d’abord le texte avec une police système, puis de basculer sur la police personnalisée une fois celle-ci chargée. Sans cela, les visiteurs voient un écran blanc pendant le chargement de la police.

N’oubliez pas de remplacer le nom et le chemin de la police. Si votre fichier source est au format TTF ou OTF, convertissez-le en WOFF2 avec le convertisseur en ligne Font Squirrel.

Cette méthode offre un contrôle total mais perd en rapidité face à Google Fonts: votre serveur est presque certainement plus lent que le CDN de Google. Pour les sites recevant jusqu’à 10 000 visiteurs par mois, la différence est imperceptible. Pour les projets à fort trafic, elle devient critique.

Méthode 4: functions.php et wp_enqueue_style (la méthode WordPress canonique)

La méthode la plus correcte du point de vue de l’architecture WordPress. Au lieu d’insérer du code dans un template, vous «enqueuez» la feuille de style contenant la police via le hook wp_enqueue_scripts.

Le code se place dans le fichier functions.php du thème actif ou du thème enfant. Voici un exemple fonctionnel pour Google Fonts:

1function techblog_add_google_fonts() {
2 wp_enqueue_style(
3 'techblog-google-fonts',
4 'https://fonts.googleapis.com/css2?family=Inter:wght@400;700&family=Playfair+Display:wght@700&display=swap',
5 array(),
6 null
7 );
8}
9add_action( 'wp_enqueue_scripts', 'techblog_add_google_fonts' );

La fonction wp_enqueue_style prend quatre paramètres: un nom unique (handle), l’URL de la feuille de style, un tableau de dépendances (vide ici) et la version (null, WordPress y substituera la sienne). Le hook wp_enqueue_scripts garantit que le code s’exécute au bon moment lors du chargement de la page.

Pour les polices Adobe, on utilisait auparavant JavaScript et wp_enqueue_script. Désormais, Adobe Fonts est passé à une approche CSS similaire à Google Fonts, donc wp_enqueue_style couvre les deux services.

Pourquoi c’est la meilleure méthode manuelle:

  • Les polices ne seront pas écrasées lors des mises à jour du thème (si vous êtes dans un thème enfant).
  • WordPress gère l’ordre de chargement et résout les dépendances.
  • Le code est isolé dans functions.php, les templates restent propres.
  • D’autres plugins peuvent désactiver ou modifier votre appel via les hooks standards.

Méthode 5: un plugin (si vous ne voulez pas toucher au code)

Vous n’êtes pas prêt à plonger dans functions.php? Un plugin résout le problème sans écrire une seule ligne de code.

Easy Google Fonts (exemple visuel, mais pas pour des sites en production)

Le plus ancien plugin de polices du répertoire WordPress. Il fournit une interface dans le personnalisateur: sélectionnez une police, visualisez les changements en temps réel, enregistrez.

L’installation est standard: Extensions → Ajouter → recherchez «Easy Google Fonts» → InstallerActiver.

Option Typographie dans l'outil de personnalisation WordPress après installation d'Easy Google Fonts

Après activation, une nouvelle entrée «Typographie» apparaît dans Apparence → Personnaliser. Cliquez dessus, sélectionnez Typographie par défaut, et vous verrez les contrôles de police pour les paragraphes et les titres.

Contrôles de police dans l'extension Easy Google Fonts

Cliquez sur la liste déroulante à côté de l’élément que vous souhaitez modifier. Un menu se déploie:

Menu déroulant de sélection de police dans l'extension Easy Google Fonts

L’option la plus importante est Font Family. Vous avez ici accès à l’intégralité de la bibliothèque Google Fonts (plus de 600 polices). Les polices sont regroupées par catégorie: serif, sans-serif, Display, Handwriting, Monospace. Vous pouvez effectuer une recherche par nom.

Cliquez sur une police et les modifications sont immédiatement visibles dans l’aperçu à droite.

Aperçu en temps réel de la police sélectionnée dans l'outil de personnalisation

Viennent ensuite les réglages fins. L’onglet Font Weight/Style contrôle la graisse. Text Decoration ajoute un soulignement, un barré ou un surlignement. Text Transform modifie la casse: tout en majuscules, tout en minuscules ou première lettre en majuscule.

Dans l’onglet Appearance: couleur de la police, couleur d’arrière-plan, taille, interlignage et espacement des lettres.

Paramètres d'apparence du texte dans l'extension Easy Google Fonts

L’onglet Positioning: marges, espacements internes, bordures, rayon de bordure et la propriété display.

Paramètres de positionnement de la police dans l'extension Easy Google Fonts

Quand vous avez terminé, cliquez sur Save and Publish en haut.

Avertissement honnête: Easy Google Fonts n’a pas été mis à jour depuis 2020. Sous WordPress 6.4+, le plugin peut ne pas fonctionner. Certains utilisateurs signalent que l’option «Typography» n’apparaît pas dans le personnalisateur. Nous le montrons ici pour illustrer la logique: la plupart des plugins de polices fonctionnent via le même mécanisme du personnalisateur.

Que faire si la police ne change pas

Certains thèmes utilisent des sélecteurs CSS non standard. Un titre peut ne pas être simplement <h1> mais <h1 class="entry-title">, et le plugin «ne voit pas» cet élément.

Solution: créez votre propre contrôle de police dans Settings → Google Fonts.

Création d'un contrôle de police personnalisé dans les paramètres d'Easy Google Fonts

Associez le sélecteur CSS requis au nouveau contrôle et activez le forçage prioritaire. Après l’enregistrement, le contrôle apparaîtra dans le personnalisateur à côté des contrôles standard.

Plugins alternatifs (à jour en 2026)

Easy Google Fonts n’est pas la seule option. Trois alternatives fonctionnelles:

  • EasyFonts héberge les Google Fonts en local sur votre serveur. Il détecte automatiquement les polices utilisées, les télécharge et les sert depuis votre domaine. Plus rapide que les requêtes CDN classiques, avec en plus une conformité RGPD totale. Le plus léger des trois en termes d’impact sur les performances.
  • Use Any Font vous permet de téléverser vos propres polices sans CSS. Le plugin convertit les formats TTF/OTF/WOFF en format web et les héberge sur votre serveur. Adapté aux polices commerciales achetées sous licence.
  • Fonts Plugin est un gestionnaire Google Fonts alternatif avec aperçu dans le personnalisateur. Contrairement à l’obsolète Easy Google Fonts, il est régulièrement mis à jour et testé avec les versions actuelles de WordPress.

Appliquer la police aux éléments du site

La police est connectée mais reste encore «en l’air». Vous devez indiquer au navigateur à quels éléments l’appliquer.

Voici le CSS de base pour remplacer la police des titres. Ajoutez-le via Appearance → Customize → Additional CSS:

1h1,
2h2,
3h3,
4h4,
5h5,
6h6 {
7 font-family: 'Roboto', sans-serif;
8}

Pour le corps du texte:

1body,
2p,
3li {
4 font-family: 'Inter', sans-serif;
5}

Nuance importante: le nom de la police dans font-family doit correspondre exactement à la déclaration faite par la bibliothèque. Google Fonts utilise 'Roboto', tandis qu'Adobe Fonts peut renvoyer 'open-sans' (sans espace et sans guillemets). Examinez attentivement le code fourni par le service, et non le nom de la police affiché sur le site.

Vous pouvez ajouter ce CSS de trois manières: via l'outil de personnalisation (la plus simple, elle résiste aux mises à jour du thème), via le fichier style.css du thème enfant, ou via le hook wp_head. Nous vous recommandons la première.

⁉️🤔 Foire aux questions

Combien de polices peut-on ajouter à un site sans perdre en vitesse?

Idéalement, deux familles: une pour les titres, une pour le corps du texte. Chaque police supplémentaire ajoute une requête HTTP et 50 à 200 Ko de poids de page. Trois polices, c’est déjà le plafond. Et ne connectez que les styles dont vous avez besoin: Regular (400) et Bold (700) pèsent deux fois moins qu’un jeu de 5 ou 6 styles.

Google Fonts ou Adobe Fonts: lequel choisir?

Pour 9 sites sur 10, Google Fonts. Gratuit, rapide (CDN Google), plus de 1500 polices, le cyrillique est disponible dans presque toutes les typographies populaires. Adobe Fonts a du sens si vous avez déjà un abonnement Creative Cloud et avez besoin d’une police commerciale spécifique comme Futura ou Minion Pro.

Peut-on utiliser un fichier TTF téléchargé depuis son ordinateur?

Vous pouvez, mais convertissez-le d’abord en WOFF2 (format compressé moderne pour le web). Les fichiers TTF ne sont pas compressés et occupent nettement plus de place. Le WOFF2 avec compression Brotli réduit la taille du fichier plusieurs fois. Convertisseur: Font Squirrel Webfont Generator.

Plugin ou functions.php: qu’est-ce qui est le plus fiable?

functions.php est plus fiable pour un usage à long terme: pas de dépendance supplémentaire, le code est transparent, les mises à jour de plugin ne vous impactent pas. Les plugins l’emportent sur la commodité: 5 minutes contre une demi-heure pour apprendre les hooks. Pour un site en production, choisissez wp_enqueue_style dans un thème enfant. Pour un prototype rapide ou un site client qui a besoin d’une interface simple, utilisez un plugin.

Pourquoi la police s’affiche-t-elle différemment sur mobile et sur ordinateur?

Les navigateurs mobiles substituent parfois les polices système ou gèrent l’anticrénelage différemment. Sans compter que les tailles d’écran ne sont pas les mêmes: 16px sur ordinateur se lit bien, mais sur un téléphone cela peut être trop grand. Solution: définissez une taille relative avec clamp() (par exemple font-size: clamp(16px, 2.5vw, 20px)) et testez sur un appareil réel, pas sur un émulateur.

En résumé: quoi utiliser sur votre site en 2026

Si l’on résume tout en cinq phrases:

  • Google Fonts est la source de polices par défaut. Suffisante pour 95% des projets: rapide, gratuite, le cyrillique est disponible partout.
  • functions.php + wp_enqueue_style est la meilleure méthode manuelle. Propre, survit aux mises à jour du thème, le code est transparent.
  • Le plugin EasyFonts fonctionne si vous voulez un hébergement local des Google Fonts sans vous embêter avec le code. Plus rapide que le CDN standard et conforme au RGPD.
  • Deux styles par police, pas plus: Regular et Bold. Chaque style supplémentaire vole 30 à 50 Ko de chargement.
  • WOFF2, pas TTF: convertissez avant de téléverser sur votre serveur. Cela économise un demi-mégaoctet par page.

Changer les polices fait partie de ces tâches où une heure de paramétrage soigné apporte des années de bénéfice visuel. Commencez tout de suite: allez sur le site Google Fonts, trouvez deux ou trois typographies pour votre projet, et essayez la méthode 4 de la liste ci-dessus.