Vkládání písem Google do webu Wordpress

Google Fonts se od svého vývoje v roce 2010 stal hlavním zdrojem pro vlastní webovou typografii. Existují tři hlavní důvody, proč se zde Google stal průkopníkem. Za prvé, neexistovaly žádné služby písem, které by byly dostatečně slušné, takže Google zaplnil prázdnotu. Za druhé, i na začátku byla rozmanitost, kterou nabízeli, poměrně velká. V současné době je k dispozici více než 800 písem v mnoha stylech. Za třetí, tato písma jsou k dispozici zdarma, což je činí obzvláště atraktivními.

Navíc je lze překvapivě snadno integrovat do vašich designových projektů. Ukážeme vám, jak můžete tato písma Google zahrnout do svého webu WordPress.

Písma Google

Chcete-li začít, musíte vybrat písmo, se kterým chcete pracovat. Existuje celá řada možností, takže máte na výběr z poměrně velkého menu. Můžete je najít, když přejdete na Stránka písem společnosti Google. Pokud hledáte konkrétní písmo, jednoduše zadejte název písma do pole Hledat a měl by vám přijít vzorek.

Existují také další parametry vyhledávání, které můžete použít. Přímo pod vyhledávacím polem je tlačítko s názvem Kategorie. Pokud na to kliknete, zobrazí se rozbalovací nabídka s pěti možnostmi. Jedná se o následující:

  • Serif – Jsou to písma s krátkými čarami vycházejícími z horních a dolních tahů písmene. Times New Roman a Sylfaen jsou dobrými příklady.
  • Sans Serif – Jak název napovídá, jedná se o fonty bez těch malých linek. Mívají jednoduchou a čistou estetiku.
  • Displej – Toto jsou písma, která lze nazvat poutavým písmem. Jsou vhodné spíše pro nadpisy než pro dlouhý text.
  • Ruční psaní – Tato písma působí, jako by je někdo psal ručně. Zjistíte, že mnoho z nich je psáno kurzívou nebo mají méně konzistentní mezery.
  • Monospace – Stejně jako u psacího stroje mají jejich písmena stejnou horizontální šířku. Jsou velmi důsledně rozmístěny.

Kromě toho máte na výběr také další možnosti, například výběr jazyka a vlastností písma. Ten zahrnuje počet stylů, tloušťku, sklon a šířku.

Vkládání písem do WordPressu

Pokud chcete na svůj web WordPress zahrnout tato jedinečná písma, můžete vyzkoušet několik metod.

Pomocí CSS

Klikněte na písmo z výběru Google a dostanete se na stránku s podrobnými písmy. V pravém horním rohu je znak „+“. Klikněte na to a otevře se boční okno. Klikněte na „Vložit“.

Nyní můžete kliknout @import. Tím se otevře kód CSS, který potřebujete zkopírovat. Přejděte na šablonu stylů vašeho motivu WordPress a vložte ji na začátek. Ujistěte se, že jste zkopírovali odkaz na import bez souboru  závorky. Ujistěte se, že jste uložili, a budete mít přidáno písmo.

Používání PHP

Postupujte podle prvních několika kroků a zkopírujte odkaz, který získáte po kliknutí na znaménko „+“. Nyní jej jednoduše přidejte do souboru header.php vašeho motivu. Nezapomeňte uložit, aby bylo možné přidat písmo.

Použití funkce Javascript

Můžete také zkusit něco známého jako „řazení do fronty“. K tomu budete muset použít funkci wp_enqueue_style. Pomocí této metody můžete přidat zvolené písmo do sekce záhlaví všech vašich webových stránek. Je to skvělý způsob, jak přidat více změn najednou.

Stačí získat odkaz na písmo (od http do ”) a přidat jej do souboru functions.php vašeho motivu s dodatečným kódem kolem něj. Zde je kód, který budete muset použít:

funkce custom_add_google_fonts() {

wp_enqueue_style( ‘custom-google-fonts’, https://fonts.googleapis.com/css2?family=Chelsea+Market&display=swap, false );

}

add_action( 'wp_enqueue_scripts', 'custom_add_google_fonts');

Kterákoli z těchto možností bude k integraci písem Google Fonts do vašeho webu WordPress fungovat dobře, takže je důležité vybrat tu, která vám bude nejvíce vyhovovat.