Modifier la police de son blog

6 5412
modifier police ecriture

Il se peut que lorsqu’un thème vous plait, il n’en soit pas de même avec la police d’écriture de ce dernier.

La plupart des thèmes utilisent des polices d’écritures standards, et compatible tous explorateurs. Nous allons voir comment modifier celle-ci.

Modification de la police de son blog

Si pour une raison ou une autre vous voulez changer la police d’écriture de vos textes, voici la méthode sans plugin, accessible à tous.

Elle vous permet de choisir une typographie différente en fonction de votre texte (paragraphe) ou vos titres (balisage h1,h2,h3, …)

Quelle police choisir ?

Oui avant de faire la modif, encore faut il savoir quelle police mettre en place. Pour cela, voici une place de marché de police, disponibles et gratuites :

http://www.dafont.com/fr/

Lorsque vous aurez fait votre choix, cliquer sur télécharger, et on vous propose le téléchargement des fichiers de votre future police.

Dézippez celui-ci dans un coin sur votre bureau d’ordinateur, un dossier va alors apparaître, avec dedans le fichier de votre police en .ttf

Allez mettre le contenu de celui-ci via votre ftp, dans le même dossier que le fichier .css de votre thème.

Indiquer où la typographie doit être activée

Bon une fois la typographie disponible sur votre site, il faut indiquer sur quoi elle doit agir. Est-ce sur vos titres ? sur votre contenu ?

Modifier la  police de vos titres

Pour cela, rendez-vous dans votre fichier .css et faites une recherche de cette ligne de code suivante :

h1, h2, h3, h4, H5, H6 {
font-family : nomdelatypo,nomdelatyposecondaire;
}

Et ajoutez votre nouvelle typo devant les autres, afin qu’elle soit prise en considération prioritairement. A l’inverse, si un navigateur n’est pas compatible avec votre nouvelle typographie, il ira chercher la typo secondaire…

Voici votre bout de code maintenant :

h1, h2, h3, h4, H5, H6 {
font-family : nomdevotrenouvelletypo,nomdelatyposecondaire;
}

Modifier la police de vos textes

Pour modifier la typographie de vos textes, il faut chercher dans ce même fichier .css la ligne de code « body », et non plus la ligne « h1, h2, h3, h4, h5, h6 ».

Et là même principe, vous repérez les polices d’écriture déjà présente, et venez mettre en avant le nom de votre nouvelle typographie.

Bon reste à valider, et vous rendre sur votre site pour admirer.

6 Commentaires

  1. Salut Rodrigue,

    Petit tuto sympa et accessible à tous qui devrait ravir les débutants (et les autres) ! A mes débuts avec WP j’aurais été content de tomber dessus (pas faute d’avoir cherché pourtant)… ;)

  2. Hello,
    Il faut quand même préciser qu’il est toujours préférable sur un site internet de n’utiliser que des websafe fonts. L’ajout de polices manuellement, et le chargement de celles-ci grâce au CSS peut très fortement alourdir les pages et donc ralentir l’affichage des pages et même causer de sérieux problème lorsqu’il y a un problème de téléchargement.

  3. Salut,

    Petite question de débutant, que pense tu d’intégrer les polices via Google Font ? C’est une meilleur solution que de télécharger la police sur le ftp ou pas ?
    Ma question est bien évidement pour éviter le temps de chargement trop long..

    Merci.

  4. @Jean decoshop : Il faut mesurer le temps d’accès. Je présume qu’il sera plus rapide en venant de Google, cependant, bon nombre de polices risques de ne pas se trouver sur Google Font. Et puis si demain Google ferme le service Google Font, tu seras de la revue… mais bon c’est valable pour tous les services en ligne.

  5. Petit débutant qui réflechit avant de se lancer prend toutes les petites astuces et tutos de ce genre! Merci BEAUCOUP!

  6. A préciser que le fait de faire appel à une police via Google Font créé une requête supplémentaire, ce qui augmente le temps de chargement de la page. Google prend de plus en plus en compte la rapidité d’un site pour le positionner plus ou moins bien dans ses résultats de recherches.

Réagis