Polices gratuites dans PrestaShop avec Adobe Edge Web Fonts

Intégration, Tips
  • Accueil
  • Blog
  • Polices gratuites dans PrestaShop avec Adobe Edge Web Fonts

Quand on parle intégration, on parle forcément design, or pour réaliser une belle charte graphique, on a souvent recours à des polices qui sortent du lot habituel (Arial, Times, Tahoma, etc.), c’est pourquoi Adobe vient de sortir un service simple et pratique pour utiliser des polices web via sa plate-forme…ça me rappelle Google Web Fonts tout ça 😉
Pour faire simple, Adobe Edge Web Fonts, c’est une plate-forme gratuite proposant des polices web plus ou moins sympas pour insérer autre chose que du Arial dans votre webdesign.

Très bien, et dans PrestaShop ?

Comment utiliser ces web fonts dans PrestaShop ? C’est très simple et ça se passe en deux étapes.
Sur le site d’AEWF – http://html.adobe.com/edge/webfonts – vous choisissez dans le menu déroulant la police qui vous plait.

Une fois que vous aurez choisi la police web voulue, vous aurez deux bouts de code à copier-coller dans les fichiers header.tpl et global.css de votre thème PrestaShop.

adobe-edge-font-1

Vous devriez donc avoir votre fichier header.tpl avec ceci :
[php]
{$HOOK_HEADER}
<!–Adobe Edge Web Fonts–>
<script src="http://use.edgefonts.net/league-gothic.js"></script>
</head>
[/php]
Et votre fichier global.css avec cela :
[css]
body {
background-color:white;
font-size:11px;
font-family:league-gothic, serif;
color:#5d717e;
text-align:center
}
[/css]
Voici le résultat :

test-web-fonts-prestashop

Vous l’aurez compris avec cet exemple, on appliqué la web font à la balise body or dans notre cas c’est pas joli joli et par dessus tout illisible, donc prudence et surtout testez encore et encore !
Pour aller plus loin, voici la documentation Adobe Edge Web Fonts et l’ensemble des services Edge d’Adobe.
A vous de jouer 🙂
 

Laisser un avis

Consultez les autres articles