Как вручную загрузить шрифты Google в WordPress

Google шрифты Веб – шрифты API позволяет легко загружать пользовательские шрифты (в отличие от стандартных настольных шрифтов, как Arial, Georgia, Times New Roman или Helvetica) просто путем ссылки на таблицу стилей в теге заголовка вашего сайта. Если вы разрабатываете темы WordPress и хотите настроить шрифты своего сайта без использования плагина, вы можете легко поставить в очередь пользовательские шрифты Google на своем сайте для использования в вашем CSS.

Шаг 1. Выберите свой собственный шрифт Google.

Использовать шрифты Google очень просто. Если вы перейдете на главную страницу «Google Webfonts» и нажмете на любой шрифт, появится небольшое всплывающее окно, в котором вы сможете настроить шрифт и просмотреть правильный URL-адрес шрифта CSS.

Если вы создаете простой HTML-сайт или редактируете свою персональную настраиваемую тему WordPress, все, что вам нужно сделать для загрузки настраиваемого шрифта на свой веб-сайт, – это скопировать и вставить ссылку таблицы стилей на настраиваемый шрифт, который размещен в Google, в ваш тег (находится в header.php в WordPress).

Тем не менее, предпочтительный способ добавления шрифта Google в вашу тему WordPress (что очень важно при создании тем для распространения) – это использование хука действия WordPress wp_enqueue_scripts.

Шаг 2. Поставьте шрифт Google в очередь

Как упоминалось ранее, вы можете легко перетащить код из Google в файл header.php, однако лучше всего поставить скрипт в очередь с помощью обработчика действия, как отмечалось ранее. Это позволяет упростить модификацию дочерних тем, а также предотвращает конфликты со сторонними плагинами.

Шаг 1. Чтобы начать, вставьте следующий код в ваш файл functions.php (если этот файл не существует, создайте новый в папке вашей темы и убедитесь, что приведенный ниже код вставлен в теги php.

function myprefix_enqueue_google_fonts() { 
    wp_enqueue_style( 'roboto', 'https://fonts.googleapis.com/css?family=Roboto' ); 
}
add_action( 'wp_enqueue_scripts', 'myprefix_enqueue_google_fonts' ); 

В этом конкретном фрагменте мы использовали функцию wp_enqueue_style для загрузки шрифта Google «Roboto» на веб-сайт. Однако вы можете использовать эту функцию несколько раз для загрузки нескольких шрифтов.

Шаг 2: Теперь вам просто нужно открыть файл style.css и изменить имя шрифта для элементов, для которых вы хотите использовать собственный шрифт, или добавить пользовательский CSS на свой сайт, чтобы изменить шрифт, например, в следующем примере, чтобы изменить все тело шрифт для Roboto.

body { font-family: "Roboto"; }

Дополнительно: использование плагина Google Fonts для WordPress

Конечно, если вы не разрабатываете тему для распространения или не используете дочернюю тему для своего проекта, то для добавления шрифтов на сайт лучше всего использовать собственный плагин. В статье под названием «Улучшите типографику вашего веб-сайта WordPress с помощью шрифтов Google» мы рекомендуем несколько замечательных плагинов, которые позволят вам легко изменять шрифты на вашем сайте WordPress и, в частности, использовать шрифты Google.

Ваши мысли … Как вы используете Google Fonts?

А теперь за вас! Сообщите нам в комментариях, как вы используете шрифты Google в WordPress. Вы разрабатываете темы или плагины, создаете собственные веб-сайты или являетесь фрилансером, помогающим людям настраивать их текущий дизайн сайтов. Также сообщите нам, какие из ваших любимых шрифтов Google. Мои личные фавориты – Roboto, Lora и PT Serif.

Источник записи: https://www.wpexplorer.com