Как локально подключить Google Fonts

Мы любим Google за то, что они дали нам эти красивые шрифты Google Fonts. Но как только мы их используем, это снижает скорость и наш рейтинг в Pagespeed Insights. А скорость — один из важнейших факторов ранжирования.

Продолжайте использовать ваши Google шрифты, размещая их локально:

С помощью плагина CAOS for Webfonts

Плагин CAOS for Webfonts

Все, что вам нужно сделать, это установить плагин, выбрать шрифты и нажать несколько кнопок:

1. Установите плагин CAOS for Webfonts из официального репозитория WordPress.

2. Определите какие шрифты используются у вас на сайте. Для этого можно воспользоваться онлайн-сервисом capyba.ru/services/fontfinder.

Определить все шрифты используемые на странице

Правда список, помимо Google-шрифтов, включает автономные шрифты используемые темой. Для поиска тольк гугл-шрифтов в коде страницы ищите «googleapis».

3. Перейдите в Настройки/Optimize Webfonts.
Введите имя шрифта в строке поиска.
Добавьте столько шрифтов, сколько необходимо.

4. Нажмите «Скачать шрифты» и дождитесь завершения загрузки.
Нажмите «Создать таблицу стилей».
Готово!

5. Теперь остается только удалить упоминание о внешних шрифтах Google из вашего сайта. Для этого я использую:

  • установите флажок Remove Google Fonts в самом плагине (предпочтительный вариант);
  • или встроенную опцию плагина Autoptimize:

    Удалить шрифты Google

  • или пункт в плагине Fast Velocity Minify:

    Fast Velocity Minify Remove Google Fonts completely

К сожалению у меня (на теме Jarida) шрифт копировался локально, для него создавался CSS. Но если посмотреть этот стиль — он пустой и соответственно ничего не работает.

Плагином Use Any Font

Плагин Use Any Font

К сожалению плагин не заработал еще на этапе получения тестового API ключа, просто выдав «Error» …

Плагином Self-Hosted Google Fonts

Еще один по функциональности плагин, который предстоит протестировать более детально. Пока при активации и удалении Google-шрифтов не происходит переключение на локальный шрифт.

Чаще всего невозможность подключить Google Fonts локально связано с используемой темой WordPress. В моем случае при настройке сайта с другой темой все прекрасно установилось и настроилось.
Современные темы WordPress многие шрифты локально имеют изначально и не требуют подключения.

По мотивам: https://daan.dev/wordpress/host-google-fonts-locally/



Оцените, пожалуйста, статью, я старался :)

Задайте вопрос в комментариях