Egyéni betűtípusok

A weboldal tipográfiája nagy hatással van arra, hogyan hat a webhely, ezért érdemes időt fordítani a helyes beállítására. A Bricks bármilyen betűtípust használni enged: a webbiztos betűtípusoktól a Google-betűtípusokon át a saját betűtípusok feltöltéséig a WordPress felületén, a Bricks → Egyéni betűtípusok menüpontban. Ez a fejezet az utóbbit mutatja be részletesen. A szerkesztőn belüli kezelésről a Betűtípuskezelő fejezet szól.

Az Egyéni betűkészletek előtöltése beállítással (Bricks → Beállítások → Teljesítmény) a feltöltött egyéni betűtípusokat előtöltheted, hogy elkerüld a formázatlan szöveg villanását (FOUT).

Egyéni betűtípus létrehozása és feltöltése

https://minta-bolt.hu/wp-admin/edit.php?post_type=bricks_fonts

Új egyéni betűtípus létrehozásához nyisd meg a Bricks → Egyéni betűtípusok oldalt, és kattints az Új egyéni betűtípus hozzáadása gombra. A lista oszlopai: Betűcsalád, Betűtípus előnézete, WOFF2 fájl, WOFF fájl és TTF fájl.

https://minta-bolt.hu/wp-admin/post-new.php?post_type=bricks_fonts

Először add meg a betűtípus címét. Ez a cím jelenik meg a font-family legördülőben, amikor a szerkesztőben a tipográfiát szerkeszted.

Ezután töltsd fel a betűtípusfájlokat minden változathoz (betűvastagság és betűstílus), amelyet használni fogsz. Egy változat sorában kiválasztható a betűvastagság (például 400 (Normál)) és a stílus (Normál), mellette pedig látszik egy előnézeti szöveg. A sor végén van a Szerkesztés és a Törlés gomb.

Ha például a normál (400) vastagságú, Normál stílusú változathoz feltöltöttél egy .woff és egy .woff2 fájlt, és van 700-as (félkövér) vastagságú, dőlt stílusú fájlod is, kattints a Betűtípus-változat hozzáadása gombra, válaszd ki a 700-as vastagságot és a dőlt stílust, majd töltsd fel az ahhoz tartozó fájlokat.

Amikor minden változatot létrehoztál, és minden fájlt feltöltöttél, mentsd a betűtípust a Közzététel gombbal. Az új egyéni betűtípus ezután elérhető a szerkesztőben.

Az egyéni betűtípus feltöltése csak a Bricks tipográfiai vezérlőiben teszi elérhetővé. A frontenden való használathoz válaszd ki a betűtípust egy tipográfiai beállításban, például egy elemen, egy globális osztályban, a sablonstílusban, az oldalbeállításokban vagy a sablonbeállításokban.

Ha az egyéni betűtípusnak több vastagsága vagy stílusa van, a megfelelő betűcsaládot és a vastagságot/stílust ugyanabban a tipográfiai vezérlőben együtt válaszd ki. Így a Bricks a beállítást a megfelelő mentett változathoz tudja párosítani, különösen, ha az Egyéni betűkészletek előtöltése be van kapcsolva.

A betűtípus előnézetét a szerkesztésekor és az Egyéni betűtípusok oldalon is láthatod.

Támogatott betűtípusformátumok

Alapból ezek a formátumok engedélyezettek:

• WOFF (Web Open Font Format): az ajánlott formátum, amelyet minden modern böngésző használ. A betűtípusadatok tömörítettek, ezért gyorsabban töltődnek be, mint ugyanaz a TrueType vagy OpenType fájlként. Az IE9-től felfelé teljes a támogatottsága.
• WOFF2 (Web Open Font Format 2.0): TrueType/OpenType betűtípus a WOFF 1.0-nál is jobb tömörítéssel. IE böngészőkben nem támogatott.
• TTF (TrueType Font): tömörítetlen betűtípusadat, részleges IE9+ támogatással.

Az ajánlott formátum a WOFF, mivel a jelenlegi böngészők nagy többsége támogatja.

További betűtípusformátumok engedélyezése

Ha az IE8-at is támogatnod kell, programozottan engedélyezheted az EOT formátumot (vagy bármely másikat) a következő kód hozzáadásával a Bricks gyermektémádhoz:

add_filter( 'bricks/custom_fonts/mime_types', function( $mime_types ) {
  // EOT formátum engedélyezése az IE9-nél régebbi böngészők támogatásához
  array_unshift( $mime_types, ['eot' => 'font/eot'] );

  return $mime_types;
} );

Ha legalább egy egyéni betűtípust létrehoztál, minden font-family vezérlőben a Szabványos betűtípusok alatt megjelenik az Egyéni betűtípusok szakasz az összes egyéni betűtípusoddal.

Tipp: GDPR-megfelelés a Google-betűtípusok saját kiszolgálásával

Ha Google-betűtípust használsz a weboldaladon, a betűtípus megjelenítése előtt a látogatók hozzájárulását kell kérned. Ezt elkerülheted úgy, hogy letöltöd a használni kívánt Google-betűtípusok összes változatát, és egyéni betűtípusként feltöltöd a Bricks-be.

A Bricks lehetővé teszi a Google Fonts teljes letiltását is a Bricks Teljesítmény beállításai között a Google Fonts letiltása kapcsolóval.

https://minta-bolt.hu/wp-admin/admin.php?page=bricks-settings

A letöltést a szerkesztőben a Betűtípuskezelő is elvégzi helyetted: egy Google-betűtípus letöltése egyéni betűtípust hoz létre a webhelyen.