Ajoute une nouvelle police de caractère à DIVI

par | Mar 20, 2018 | Aller + Loin avec Divi, Documentation | 0 commentaires

Tu as envie de mettre ta « The Police de Caractère » dans ton DIvi.

La bonne nouvelle c’est que c’est possible de le faire sans plugin 😉

La mauvaise c’est qui va falloir faire un ptit peu de code 🙁

Mais je suis là pour t’accompagner 😉

Allez on arrête les grands discours, et on passe à la technique.

Récupérer sa « The police de caractère »

Rend toi « à la rue de la paix » , euh non excuse-moi c’était une boutade 😉 On va plûtot aller chez « Google Font« , je te laisse trouver ta « The Police », en ce qui me concerne je vais pendre la police « Courgette ». Une fois sur la page de ta police, clique sur « Select This Font » qui se situe en haut à droite en rouge.
Ajouter une nouvelle police de caractère dans DIVI
Une barre noire doit apparaitre avec le nom « Family selected ». Elle est situé en bas de ton écran
Ajoute une news police de caractère dans DIVI
Une fois que tu as cliqué qur la barre noire. Les détails de ta font va s’aficher.
Ajoute une font à ton thème DIVI

Il va te falloir maintenant copier la ligne de code  1. 

Ajouter sa Font Google dans son DIVI

Tu le colles dans ton thème DIVI > Option du thème > intégration et tu cherches la ligne « Ajouter ligne de code à lade ton blog.

Pense bien à savegarder les changements, Autrement tu vas devoir recommencer 🙂 !

Ajoute une font dans DIVI
Retourne sur l’avant dernière capture et copie la ligne de code 2, puis  tu retournes dans DIVI > toutes en bas de l’onglet Général > Personnaliser CSS et colle la ligne de code 2. Il va te falloir rajouter un peu de texte : 

  • Si tu veux que toute la police du site soit impactée : 

body { font-family: ‘Courgette’, cursive; }

  • Si tu veux que seul les titres en h1 de ton site soit impacté :

h1 { font-family: ‘Courgette’, cursive; }

  • Si tu veux que seul les titres en p de ton site soit impacté :
  • p { font-family: ‘Courgette’, cursive; }
J'installe une font Google dans DIVI
Tu peux te rendre sur ton site, et voir le résultat ! 😉  

0 commentaires

Soumettre un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *