Styler vos textes avec des polices exotiques

Eh oui, les utilisateurs de JimdoFree peuvent eux aussi bénéficier des polices exotiques proposées par JimdoPro et JimdoBusiness ! Dans ce tutoriel, je vous donne 15 codes pour styler les textes de votre site avec ces polices qui sortent de l'ordinaire. Pour utiliser ces mêmes polices afin de styler le titre du header de votre site, suivez ce lien. Pour les appliquer aux titres de votre site, c'est par ici.

Etape 1 : choisir une police exotique

Je vous donne ci-dessous les 15 polices qu'on trouve dans JimdoPro et JimdoBusiness ! Faites votre marché en sélectionnant une (ou plusieurs) polices pour styler les titres de votre site.

Où insérer le code fourni ?

Copiez-collez le code fourni dans le cadre de saisie qui apparaît quand vous cliquez, dans la barre d'admin de votre site, sur Paramètres > Modifier le Head :

Capture de Paramètres > Modifier le head
Paramètres > Modifier le head

N'oubliez pas d'enregistrer votre modification.

1. Police Dancing Script

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Dancing+Script%3A400);
body, p, td, li {font-family: "Dancing Script", cursive !important;}

/*]]>*/
</style>

2. Police Coming Soon

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Coming+Soon%3A400);
body, p, td, li {font-family: "Coming Soon", cursive !important;}

/*]]>*/
</style>

3. Police Droid Sans

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Droid+Sans%3A400);
body, p, td, li {font-family: "Droid Sans", sans-serif !important;}

/*]]>*/
</style>

4. Police Josefin Sans

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Josefin+Sans%3A400);
body, p, td, li {font-family: "Josefin Sans", sans-serif !important;}


/*]]>*/
</style>

5. Police Oleo Script

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Oleo+Script%3A400);
body, p, td, li {font-family: "Oleo Script", cursive !important;}

/*]]>*/
</style>

6. Police Bitter

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Bitter%3A400);
body, p, td, li {font-family: Bitter, serif !important;}

/*]]>*/
</style>

7. Police Droid Serif

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Droid+Serif%3A400%);
body, p, td, li {font-family: "Droid Serif", serif !important;}

/*]]>*/
</style>

8. Police Marck Script

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Marck+Script%3A400);
body, p, td, li {font-family: "Marck Script", cursive !important;}

/*]]>*/
</style>

9. Police Shadows into light

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Shadows+Into+Light%3A400);
body, p, td, li {font-family: "Shadows Into Light", cursive !important;}

/*]]>*/
</style>

10. Police Crimson Text

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Crimson+Text%3A400);
body, p, td, li {font-family: "Crimson Text", serif !important;}

/*]]>*/
</style>

11. Police Raleway

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Raleway%3A100);
body, p, td, li {font-family: Raleway, cursive !important;}

/*]]>*/
</style>

12. Police Vollkorn

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */
@import url(http://fonts.googleapis.com/css?family=Vollkorn%3A400);
body, p, td, li {font-family: Vollkorn, serif !important;}

/*]]>*/
</style>

13. Police Share

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Share%3A400);
body, p, td, li {font-family: Share, cursive !important;}

/*]]>*/
</style>

14. Police Oswald

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Oswald%3A400);
body, p, td, li {font-family: Oswald, sans-serif !important;}

/*]]>*/
</style>

15. Police Lobster

<style type="text/css">
/*<![CDATA[*/

/* Police exotique des textes */

@import url(http://fonts.googleapis.com/css?family=Lobster%3A400);
body, p, td, li {font-family: Lobster, cursive !important;}

/*]]>*/
</style>

Etape 2 : définir la taille, la couleur (etc) de la police

Il vous reste à ajuster la taille de votre police, sa couleur, son interligne, etc. Alors, là, c'est facile... puisque c'est comme d'habitude ! Cliquez, dans la barre d'administration de votre site sur Style puis Texte :

Généralement, les polices exotiques nécessitent une taille de police plus grande pour être lisibles (16px ou 18px). N'hésitez pas non plus à augmenter l'interligne (en %) pour gagner en lisibilité. Choisissez enfin la couleur des textes, facilement, en visuel.

C'est à vous !

Écrire commentaire

Commentaires : 0
Ruban