Как удалить загрузку шрифтов в WordPress для ускорения сайта

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

Почему важно убрать загрузку шрифтов в WordPress

Подключение внешних шрифтов создает дополнительные HTTP-запросы к серверам Google или другим источникам, что увеличивает время загрузки сайта. Кроме того, если сервер шрифтов недоступен, это может привести к проблемам с отображением текста. Для сайтов, ориентированных на высокую производительность и SEO, важно минимизировать эти задержки.

Удаление загрузки шрифтов особенно актуально при использовании тем, которые по умолчанию подключают Google Fonts без возможности отключения. В таких случаях приходится применять кодовые решения или плагины.

Как определить, какие шрифты загружаются на сайте

Для начала нужно понять, какие именно шрифты и откуда загружаются. Самый простой способ — открыть консоль браузера (F12) и перейти во вкладку Network (Сеть). Фильтруйте запросы по типу "font" или ищите URL с адресами вроде fonts.googleapis.com или fonts.gstatic.com.

Также можно использовать онлайн-инструменты для аудита сайта, например, PageSpeed Insights от Google. Он покажет, сколько времени тратится на загрузку шрифтов и даст рекомендации.

Способы удаления загрузки шрифтов в WordPress

1. Отключение шрифтов через functions.php

Если шрифты подключаются через wp_enqueue_style, их можно удалить, отписав стили в файле functions.php вашей темы или дочерней темы.

function wpdo_dequeue_google_fonts() {
    wp_dequeue_style('twentytwentyone-fonts'); // пример для темы Twenty Twenty-One
    wp_deregister_style('twentytwentyone-fonts');
}
add_action('wp_enqueue_scripts', 'wpdo_dequeue_google_fonts', 20);

Важно заменить 'twentytwentyone-fonts' на правильный идентификатор стиля, который можно узнать через просмотр кода темы или дебаг.

2. Удаление ссылок на шрифты из header.php или других шаблонов

Некоторые темы вставляют теги <link> на шрифты напрямую в файлы шаблонов. В этом случае можно вручную удалить эти строки из header.php или других частей темы.

3. Использование плагина Disable Google Fonts

Если вы не хотите править код, можно использовать бесплатный плагин Disable Google Fonts. Он автоматически отключает загрузку Google Fonts, подключаемых темами и плагинами.

Как заменить Google Fonts на локально установленные шрифты

Удалив внешние шрифты, лучше всего снабдить сайт локальными аналогами, чтобы сохранить дизайн и читаемость. Для этого:

• Скачайте нужные шрифты (например, Open Sans или Roboto) в формате WOFF или WOFF2.
• Загрузите файлы в папку вашей темы, например, /wp-content/themes/ваша_тема/fonts/.
• Добавьте в файл стилей style.css код для подключения:

@font-face {
    font-family: 'WPDOOpenSans';
    src: url('fonts/OpenSans-Regular.woff2') format('woff2'),
         url('fonts/OpenSans-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

body {
    font-family: 'WPDOOpenSans', Arial, sans-serif;
}

Таким образом, вы полностью контролируете шрифты и исключаете внешние запросы.

Дополнительные советы по оптимизации шрифтов в WordPress

Используйте плагин Clearfy Pro для управления ресурсами

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

Отложенная загрузка шрифтов (font-display swap)

Если вы не хотите полностью убирать шрифты, добавьте в @font-face свойство font-display: swap; для улучшения UX. Это позволяет сначала отображать системный шрифт, а когда загрузится внешний – заменить его.

Минимизация CSS и объединение файлов

После удаления лишних шрифтов стоит оптимизировать CSS, чтобы уменьшить общий вес страниц. Плагины кеширования или оптимизации, такие как WP Rocket, помогут в этом.

Пример функции для удаления Google Fonts из популярных тем

function wpdo_remove_google_fonts() {
    // Twenty Twenty-One
    wp_dequeue_style('twentytwentyone-fonts');
    wp_deregister_style('twentytwentyone-fonts');

    // Astra (пример)
    wp_dequeue_style('astra-google-fonts-css');
    wp_deregister_style('astra-google-fonts-css');
}
add_action('wp_enqueue_scripts', 'wpdo_remove_google_fonts', 20);

Вызов функции на хуке wp_enqueue_scripts с приоритетом 20 гарантирует, что стили будут удалены после их подключения.

Подводя итог, удаление загрузки шрифтов из WordPress — это эффективный способ снизить время загрузки страниц и повысить производительность сайта. Используйте описанные методы или плагины, чтобы сделать ваш сайт быстрее и удобнее для посетителей.