googleFontCrawler
1.0.0
Crawler Web automatique pour l'extraction et la préparation des polices Google à un usage local. Ceci est en raison de la loi européenne sur la protection des données. (DSGVO) Le téléchargement et la liaison de tous les fichiers de polices à la main sont ridices. J'ai donc écrit un petit script Python pour automatiser le processus.
Lorsque vous accédez à Google Fonts sur l'URL "Fonts.googleapis.com", le fichier est généré peu de temps après la demande. Ainsi, un webcrawler est nécessaire pour accéder aux données de police au moment de l'exécution.
Démarrez la CLI système dans le dossier principal de ce dépôt et exécutez la commande suivante:
python getGoogleFonts.py
Après cela, trouvez l'ancien lien incluant Google-Font. Cela devrait ressembler à ceci:
<html>
<header>
<title>My website</title>
...
<link href="https://fonts.googleapis.com/css?family=Cormorant+Garamond:700,700i|Nunito+Sans:400,700,900" rel="stylesheet">
...
Entrez juste l'URL elle-même dans la Python CLI Prom:
Please copy your Google® fonts include URL here:
https://fonts.googleapis.com/css?family=Cormorant+Garamond:700,700i|Nunito+Sans:400,700,900
Après cela, vous pourrez accéder à tous les fichiers Nesssary au sein de l' export -Folder
Toutes les polices seront téléchargées sur le fonts -Folder. En plus de cela, un font.css header.html tête.
Le font.css -FILE ressemble à ceci:
/* CORMORANT GARAMOND | latin-ext */
/* italic-700 */
@font-face{
font-family: 'Cormorant Garamond';
font-style: italic;
font-weight: 700;
src: url('../src/fonts/Cormorant-Garamond-italic-700-latin-ext.woff2') format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* normal-700 */
@font-face{
font-family: 'Cormorant Garamond';
font-style: normal;
font-weight: 700;
...
Mettez le fonts -Folder nouvellement généré dans le src -Folder de votre racine principale du projet. Si vous n'avez pas de Folder src , créez-en un nouveau. Vous pouvez également ajuster manuellement les chemins de toutes les polices src -attributes dans le file de font.css -lefile en header.html -file.
Placez le fichier font.css dans le Folder css de votre racine principale du projet. Si vous souhaitez utiliser un autre dossier de votre projet, ajustez simplement le chemin de la dernière ligne dans header.html
Copiez le contenu de header.html dans la section d'en-tête de chaque site sur lequel vous souhaitez utiliser les polices. Votre code devrait ressembler à ceci:
<html>
<header>
<title>My website</title>
...
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Cormorant-Garamond-italic-700-latin-ext.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Cormorant-Garamond-normal-700-latin-ext.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Cormorant-Garamond-italic-700-latin.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Cormorant-Garamond-normal-700-latin.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Nunito-Sans-normal-400-latin-ext.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Nunito-Sans-normal-700-latin-ext.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Nunito-Sans-normal-900-latin-ext.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Nunito-Sans-normal-400-latin.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Nunito-Sans-normal-700-latin.woff2" crossorigin="anonymous" />
<link as="font" rel="preload" type="font/woff2" href="./src/fonts/Nunito-Sans-normal-900-latin.woff2" crossorigin="anonymous" />
<link rel="preload stylesheet" as="style" href="./css/font.css" />
...
Quoi encore à implémenter
