Téléchargement d'une police Google et création d'un site hors ligne qui l'utilise

Question

J'ai un modèle qui contient une référence à une police Google comme celle-ci :

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600,300' rel='stylesheet' type='text/css'>

Comment puis-je le télécharger et le configurer pour l'utiliser dans mes pages qui fonctionnent hors ligne en permanence ?

Answer 1

Vous devez télécharger la police et la référencer localement.

Télécharger le CSS à partir du lien que vous avez posté, puis téléchargez tous les WOFF et (si nécessaire) les convertir en TTF .

Ensuite, changez le CSS du lien que vous avez posté pour inclure les polices localement.

De

url(http://themes.googleusercontent.com/static/fonts/opensans/v6/
DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff)

A

url(/path/to/font/font.woff)

Voila ! Il y a peut-être d'autres choses à faire, mais ce qui précède est l'essentiel. Cet article explique un peu mieux.

Answer 2

Il suffit de télécharger la police et de l'extraire dans un dossier, puis de lier cette police. le code ci-dessous a fonctionné pour moi correctement.

body { 
  color: #000; 
  font-family:'Open Sans';
  src:url(../../font/Open_Sans/OpenSans-Light.ttf); 
}