( TCH | 2022. 02. 03., cs – 14:19 )

Ha van pl. ez a link:

<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap" rel="stylesheet">

Akkor

wget "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap" -O fonts.css

és kapunk egy CSS fájlt:

@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v18/6xK1dSBYKcSV-LCoeQqfX1RYOo3qPa7g.ttf) format('truetype');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 600;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v18/6xKwdSBYKcSV-LCoeQqfX1RYOo3qPZY4lBdr.ttf) format('truetype');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v18/6xKwdSBYKcSV-LCoeQqfX1RYOo3qPZZclRdr.ttf) format('truetype');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v18/6xK3dSBYKcSV-LCoeQqfX1RYOo3aPw.ttf) format('truetype');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 600;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v18/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rAkA.ttf) format('truetype');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v18/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vAkA.ttf) format('truetype');
}

Leránthatjuk a fontokat:

wget `cat fonts.css | grep https | sed 's/  src: url(//g' | sed "s/) format('truetype');//g"`

Kicserélhetjük a CSS-ben az URL-t csak simán a fájlnévre:

sed -i 's/https:\/\/fonts.gstatic.com\/s\/sourcesanspro\/v18\///g' fonts.css

Az eredeti link módosul:

<link href="fonts.css" rel="stylesheet">

És ennyi. Annyi a fontos még, hogy a fontokat tök mindegy, hova tesszük, de a CSS-ben a relatív elérést mindig a CSS helyétől kell számítani és nem a CSS-t behúzó HTML-től, szóval, ha van egy index.html, ami behúzza a css/fonts.css fájlt, a fontok pedig a fonts könyvtárban vannak, akkor az elérés nem fonts/valami.ttf lesz, hanem ../fonts/valami.ttf