Ajouter une typographie sur WordPress

typographie wordpress

Si vous cherchez à améliorer le design de votre site WordPress, la typographie est un excellent moyen de parvenir à vos fins. Une police adaptée peut rendre votre contenu plus attrayant visuellement, et peut également aider à transmettre votre message d’une manière plus percutante. Dans cet article, nous allons voir comment modifier la police de votre site WordPress, que ce soit de façon manuelle ou avec un plugin WordPress d’importation de typographie. C’est parti !

Table des matières

Où trouver une police WordPress?

Les sites pour télécharger des polices gratuites

Il existe une variété de sites Web où vous pouvez trouver des polices gratuites pour votre site WordPress. Parmi les options populaires, citons :

Gardez à l’esprit que toutes les polices ne sont pas compatibles avec WordPress, alors assurez-vous de faire vos recherches avant de choisir une police. Veillez également à respecter les conditions de licence pour toutes les polices que vous choisirez d’utiliser.

Avec ou sans Sérif ?

Les polices de caractères peuvent être divisées en deux catégories : celles avec empattements (Sérif) et celles sans empattements (sans Sérif). Les polices avec empattement sont des polices qui comportent des petites lignes ou des traits à la fin de chaque lettre, tandis que les polices sans empattement ne comportent pas ces lignes.

Les polices avec empattement sont généralement considérées comme plus traditionnelles et formelles, tandis que les polices sans empattement sont considérées comme plus modernes et informelles. Cependant, ce n’est pas toujours le cas, et il existe de nombreuses polices de caractères qui défient ces généralisations. Certaines personnes préfèrent les polices avec empattement pour le corps du texte parce qu’elles les trouvent plus faciles à lire, tandis que d’autres préfèrent les polices sans empattement parce qu’elles leur semblent plus propres et plus modernes. En définitive, c’est à chacun de décider quel type de police lui convient le mieux.

Comment importer une police dans WordPress ?

WordPress vous permet de télécharger des polices sur votre site de deux manières : avec une CSS ou avec une extension.

Pour ajouter une police avec CSS, vous devrez ajouter du code à la feuille de style de votre site. Cette méthode, un peu plus technique, permet de stocker les éléments sur le serveur et évite l’ajout d’une extension.

Pour ajouter une police avec une extension, vous devrez ajouter une extension dédiée et suivre une procédure simple pour importer votre police.

Nous allons maintenant voir des deux méthodes en détail et vous ferez votre choix.

Première option : via le CSS

Téléchargez les fichiers de votre nouvelle police

Vous aurez besoin des fichiers suivants :

Un fichier Embedded OpenType Font (.eot)
Un fichier Scalable Vector Graphic (.svg)
Un fichier Police TrueType (.ttf)
Un fichier Web Open Font Format (.woff)
Un fichier Web Open Font Format 2.0 (.woff2)

Si vous n’avez qu’un fichier sur les 5 nécessaires, vous pouvez les obtenir ici.

Voici comment vous y prendre concrètement :

Uploadez votre font :

1

Choisissez le mode expert :

2

Choisissez vos formats :

3

Validez et downloadez :

4

Téléchargez les fichiers dans le dossier «fonts» de votre thème 

Pour cela, vous avez deux solutions :

Via FTP 

Il vous faut pour ce faire vous connecter via FTP (par exemple avec Filezilla téléchargeable pour PC et Mac). Si vous ne savez pas utiliser Filezilla, faites une recherche Google ou bien indiquez le dans les commentaires, je l’ajouterai au tutoriel 🙂

Vous irez déposer vos fichiers dans le dossier Fonts situé en général dans les dossiers du thème. 

Via HPanel

si vous êtes comme moi hébergé chez Hostinger, vous aurez accès à tous vos fichiers via un Hpanel. Cela évite de télécharger un logiciel FTP, un outil de moins ouf !

Via le Hpanel de Hostinger, on trouve tous les fichiers du site via un de ces deux encarts :

hostigner cpanel

Puis dans le dossier « public_html », le sous-dossier « wp-content », puis « thèmes », puis le dossier du thème activé sur votre site et enfin dans le dossier « fonts ».

Note : dans les deux cas, si vous ne voyez pas de fichier fonts, il faudra le créer. Par exemple, pour moi qui utilise ici le thème Astra, le fichiers fonts se trouve en suivant ce chemin exactement sauf qu’il y a un dossier intermédiaire nommé « assets » au sein du dossier Astra :

fonts astra wordpress

Connectez la nouvelle police à votre thème

Pour cela, il suffit d’entrer le code suivant dans le fichier css de votre site (pour l’exercice, j’ai entré la police « Optima regular », il vous suffit de remplacer son nom par le nom de votre police) :

@font-face {
font-family: ‘optima-regular‘;
src: url(‘optima-regular.eot’);
src: url(‘optima-regular.eot?#iefix’) format(’embedded-opentype’),
url(‘optima-regular.woff2′) format(‘woff2’),
url(‘optima-regular.woff’) format(‘woff’),
url(‘optima-regular.ttf’) format(‘truetype’),
url(‘optima-regular.svg#svgwpf‘) format(‘svg’);
}

Pour accéder au fichier css de votre site, encore deux chemins possibles :

  • soit via les fichiers du site en suivant ce chemin : wp-content/themes/MonTheme/style.css (vous prendrez soin de faire une copie du fichier avant de le modifier. Par ailleurs, cette solution suppose de travailler avec un thème enfant, au risque sinon de voir ce bout de code supprimé lors de la mise à jour du thème)
  • soit via la personnalisation du thème à partir du tableau de bord de votre site WordPress (cette seconde option évite d’entrer dans le fichier css et que le code ajouté soit supprimé lors de la mise à jour du thème – on n’a donc pas besoin de thème enfant avec cette option) :

css additionnel wordpress

Choisissez la destination de la police

Maintenant que tout est en place, il suffit de choisir où vous souhaitez voir apparaître votre nouvelle police. Dans notre exemple, nous l’avons placée dans les Hn et dans les paragraphes :

fonts css

Seconde option : via une extension

Plusieurs extensions existent pour télécharger directement une nouvelle police dans son site WordPress. Cela prend moins de temps, cependant, cela ajoute une extension à votre site, donc potentiellement cela peut ralentir le site ou créer un conflit avec une autre extension.
A vous de choisir entre la méthode un peu technique et la méthode express !

Je vous recommande Custom Fonts, extension gratuite, qui fonctionne particulièrement bien avec le thème Astra (que je recommande chaudement), avec Elementor et aussi Beaver Builder.

custom fonts wordpress 

Concrètement,vous aurez une seule étape à franchir : entrer votre police dans l’extension et vous la retrouverez ensuite dans la liste des typographies disponibles :

custom fonts demo

Conclusion

La typographie peut être un outil puissant pour rendre votre site WordPress plus attrayant visuellement et vous aider à vous démarquer de la concurrence. Nous vous avons montré comment trouver des polices, ajouter une police dans WordPress, et les utiliser dans vos articles et vos pages. Pour vraiment profiter de la typographie sur votre site WordPress, nous vous suggérons d’utiliser un thème qui a des contrôles de police intégrés, comme Astra. Avec Astra, vous pouvez facilement changer la police de tous les textes de votre site en quelques clics. Découvrez la puissance de la typographie dès aujourd’hui !

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée.

Vous appréciez cet article? Partagez-le !

Vous aimerez aussi :

Les 8 meilleurs thèmes WordPress pour un site vitrine

Top 8 des thèmes WordPress pour faire un site vitrine

Accueil Le site vitrine est la façade virtuelle d’une entreprise. Internet étant le lieu de toutes les opportunités, présenter son entreprise par le biais d’un site vitrine est la meilleure des choses à faire. Une présence sur le web booste les activités d’une entreprise en améliorant la prospection et en accroissant la notoriété de cette

Lire plus »
Relier son tunnel de vente system.io à son site WordPress

Relier son tunnel de vente systeme.io à son site WordPress

Accueil Que l’on souhaite avoir un site vitrine, un blog ou un site pour vendre des services et des produits, WordPress reste une option de qualité. Non seulement ce CMS est facile à utiliser, à personnaliser et à promouvoir, mais en plus, il existe toutes sortes d’outils et de plugins pour atteindre ses objectifs.  En

Lire plus »

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée.

Retour haut de page