Crawler da Web automático para extrair e preparar fontes do Google para uso local. Isso é desconhecido devido à lei européia de proteção de dados. (DSGVO) Download e vincular todos os arquivos de fontes à mão é arrumado. Então, escrevi um pequeno script Python para automatizar o processo.
Ao acessar as fontes do Google no URL "fonts.googleapis.com", o arquivo é gerado logo após a solicitação. Assim, é necessário um webcrawler para acessar os dados de font em tempo de execução.
Inicie a CLI do sistema na pasta principal deste repositório e execute o seguinte comando:
python getGoogleFonts.py
Depois disso, encontre o antigo Google-Font incluir o link. Deve parecer algo assim:
<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">
...
Digite apenas o URL no próprio Python CLI Promt:
Please copy your Google® fonts include URL here:
https://fonts.googleapis.com/css?family=Cormorant+Garamond:700,700i|Nunito+Sans:400,700,900
Depois export , você poderá acessar todos
Todas as fontes serão baixadas para as fonts -Folder. Além disso, é gerado um header.html como uma font.css -file.
O font.css -File se parece com o seguinte:
/* 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;
...
Coloque as fonts recém -geradas -Folder na dobra src da sua raiz principal do projeto. Se você não possui uma dobra src , basta criar um novo. Você também pode ajustar manualmente os caminhos de todas as fontes src -Atributes no font.css -File também como o header.html -File.
Coloque o font.css -File na dobra css da sua raiz principal do projeto. Se você quiser usar outra pasta do seu projeto, basta ajustar o caminho da última linha no header.html
Copie o conteúdo do header.html na seção de cabeçalho de todos os sites em que você deseja usar as fontes. Seu código deve parecer algo assim:
<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" />
...
O que ainda está para implementar