Вграждане на шрифтове на Google в сайта на Wordpress

Google Fonts се превърна в основния ресурс за персонализирана уеб типография от нейното разработване през 2010 г. Има три основни причини Google да стане лидер тук. Първо, нямаше достатъчно прилични услуги за шрифтове, така че Google запълни празнотата. Второ, дори в началото разнообразието, което предлагаха, беше сравнително голямо. В момента има над 800 шрифта, налични в множество стилове. Трето, тези шрифтове са достъпни безплатно, което ги прави особено привлекателни.

Освен това те са изненадващо лесни за интегриране във вашите дизайнерски проекти. Ще ви покажем как можете да включите тези шрифтове на Google във вашия WordPress сайт.

Google Fonts

За да започнете, ще трябва да изберете шрифта, с който искате да работите. Има различни опции, така че имате доста голямо меню, от което да избирате. Можете да ги намерите, като отидете на Страница с шрифтове на Google. Ако търсите конкретен шрифт, просто въведете името на шрифта в полето за търсене и той трябва да излезе с извадка.

Има и други параметри за търсене, които можете да използвате. Точно под полето за търсене има бутон, наречен Категории. Ако щракнете върху това, ще ви разкрие падащо меню с пет опции. Те са както следва:

  • Serif – Това са шрифтове с къси линии, произтичащи от горните и долните черти на буква. Times New Roman и Sylfaen са добри примери.
  • Sans Serif – Както подсказва името, това са шрифтове без тези малки линии. Те са склонни да имат проста и изчистена естетика.
  • Дисплей – Това са това, което може да се нарече привличащи вниманието шрифтове. Те са най-добри за заглавия, а не за дълъг текст.
  • Ръкопис – тези шрифтове създават впечатлението, че някой ги е написал на ръка. Ще откриете, че много от тях са в курсив или имат по-малко последователно разстояние.
  • Моноширина – Подобно на пишеща машина, техните букви заемат една и съща хоризонтална ширина. Те са много последователно разположени.

В допълнение към тях имате и други опции, от които да избирате, като избор на свойства на език и шрифт. Последното включва броя на стиловете, дебелината, наклона и ширината.

Вграждане на шрифтове в WordPress

Ако искате да включите тези уникални шрифтове във вашия WordPress сайт, има няколко метода, които можете да опитате.

Използване на CSS

Щракнете върху шрифта от селекцията на Google и той ще ви отведе до подробната страница с шрифтове. В горния десен ъгъл има знак „+“. Кликнете върху него и ще се отвори страничен прозорец. Кликнете върху „Вграждане“.

Сега можете да щракнете @import. Това ще отвори CSS кода, който трябва да копирате. Отидете в таблицата със стилове на вашата тема WordPress и я поставете в началото. Уверете се, че сте копирали връзката за импортиране без  скоби. Уверете се, че сте запазили и ще сте добавили шрифта.

Използване на PHP

Следвайте първите няколко стъпки и копирайте връзката, която получавате, след като щракнете върху знака „+“. Сега просто го добавете към файла header.php на вашата тема. Не забравяйте да запазите, за да бъде добавен шрифтът.

Използване на функция на Javascript

Можете също да опитате нещо, известно като „поставяне на опашка“. За това ще трябва да използвате функцията wp_enqueue_style. Чрез този метод можете да добавите избрания шрифт към заглавната секция на всички страници на вашия уебсайт. Това е чудесен начин да добавите няколко промени наведнъж.

Просто вземете връзката на шрифта (от http до ”) и добавете това към файла functions.php на вашата тема с допълнителен код около него. Ето кода, който трябва да използвате:

функция custom_add_google_fonts() {

wp_enqueue_style( ‘custom-google-fonts’, https://fonts.googleapis.com/css2?family=Chelsea+Market&display=swap, невярно );

}

add_action( ‘wp_enqueue_scripts’, ‘custom_add_google_fonts’);

Всяка от тези опции ще работи добре за интегриране на Google Fonts във вашия уебсайт на WordPress, така че е важно да изберете тази, с която се чувствате най-удобно.