Как создать настройку для отключения Emoji в WordPress

WordPress по умолчанию загружает скрипты и стили для поддержки Emoji на фронтенде и в админке. Это увеличивает количество HTTP-запросов, что может замедлить загрузку сайта. Если вы не используете Emoji или хотите оптимизировать производительность, разумно отключить эту функциональность.

Почему нужно отключать Emoji в WordPress

Emoji в WordPress добавляются через встроенный скрипт wp-emoji-release.min.js. Этот скрипт подгружается на каждую страницу, даже если Emoji не используются. Это влияет на скорость загрузки и производительность сайта. Особенно это заметно на мобильных устройствах и при медленном соединении.

Отключение Emoji помогает:

• Уменьшить количество HTTP-запросов
• Снизить размер загружаемых ресурсов
• Улучшить скорость загрузки страниц
• Снизить нагрузку на сервер

Для сайтов, которые не используют Emoji, это простой и эффективный способ оптимизации.

Как создать настройку в админке для отключения Emoji

Давайте реализуем опцию в админке WordPress, которая позволит включать или отключать Emoji по вашему выбору. Это удобно, если вы хотите иметь возможность быстро управлять этой функцией без редактирования кода.

Создание страницы настроек

Добавим новую страницу в меню «Настройки» с чекбоксом для управления Emoji:

function wpexamples_register_emoji_settings_page() {
    add_options_page(
        'Настройки Emoji',
        'Emoji',
        'manage_options',
        'wpexamples-emoji-settings',
        'wpexamples_emoji_settings_page_html'
    );
}
add_action('admin_menu', 'wpexamples_register_emoji_settings_page');

function wpexamples_emoji_settings_page_html() {
    if (!current_user_can('manage_options')) {
        return;
    }
    if (isset($_POST['wpexamples_disable_emoji'])) {
        check_admin_referer('wpexamples_emoji_settings_save', 'wpexamples_emoji_nonce');
        update_option('wpexamples_disable_emoji', $_POST['wpexamples_disable_emoji']);
        echo '<div class="updated notice"><p>Настройки сохранены.</p></div>';
    }
    $value = get_option('wpexamples_disable_emoji', '0');
    ?>
    <div class="wrap">
        <h1>Настройки Emoji</h1>
        <form method="post" action="">
            <?php wp_nonce_field('wpexamples_emoji_settings_save', 'wpexamples_emoji_nonce'); ?>
            <table class="form-table">
                <tr valign="top">
                    <th scope="row">Отключить Emoji</th>
                    <td>
                        <input type="checkbox" name="wpexamples_disable_emoji" value="1" <?php checked('1', $value); ?> />
                        <p class="description">Если включено, Emoji будут отключены на сайте.</p>
                    </td>
                </tr>
            </table>
            <input type="submit" class="button button-primary" value="Сохранить" />
        </form>
    </div>
    <?php
}

Объяснение кода

Мы добавили страницу настроек в раздел «Настройки» с чекбоксом «Отключить Emoji». Значение сохраняется в опцию wpexamples_disable_emoji. Для безопасности используется nonce.

Отключение Emoji на фронтенде и в админке

Теперь нужно реализовать логику отключения Emoji, если опция включена. Для этого удалим соответствующие скрипты и фильтры WordPress.

function wpexamples_disable_emoji_scripts() {
    if (get_option('wpexamples_disable_emoji', '0') === '1') {
        // Удаляем скрипты и стили Emoji
        remove_action('wp_head', 'print_emoji_detection_script', 7);
        remove_action('admin_print_scripts', 'print_emoji_detection_script');
        remove_action('wp_print_styles', 'print_emoji_styles');
        remove_action('admin_print_styles', 'print_emoji_styles');
        // Отключаем фильтры для контента
        remove_filter('the_content_feed', 'wp_staticize_emoji');
        remove_filter('comment_text_rss', 'wp_staticize_emoji');
        remove_filter('wp_mail', 'wp_staticize_emoji_for_email');
        // Отключаем DNS prefetch
        add_filter('emoji_svg_url', '__return_false');
    }
}
add_action('init', 'wpexamples_disable_emoji_scripts');

Подробности реализации

Функция wpexamples_disable_emoji_scripts проверяет опцию и при необходимости удаляет обработчики, которые подгружают скрипты и стили Emoji. Также отключается фильтр, который превращает Emoji в SVG внутри контента и почты.

Удаление этих действий и фильтров полностью отключает Emoji, что снижает нагрузку на сайт.

Проверка работы и полезные рекомендации

После включения настройки и сохранения проверьте исходный код страниц сайта. Скрипты и стили, связанные с Emoji, должны отсутствовать. Также можно проверить скорость загрузки сайта с помощью инструментов типа Google PageSpeed Insights — отключение Emoji часто улучшает показатель.

Если в будущем понадобится обратно включить Emoji, просто снимите галочку в настройках и сохраните.

Совместимость с плагинами

Отключение Emoji может повлиять на плагины, которые используют Emoji. Рекомендуется проверить совместимость, особенно если у вас установлены плагины для социальных сетей, комментариев или визуальных редакторов.

Если вы используете плагин Clearfy Pro с wpshop.ru, он также позволяет отключить Emoji одним кликом, что удобно для быстрого управления:

<a href="https://wpshop.ru/clearfy-pro/?utm_source=wpexamples.ru&utm_medium=article&utm_campaign=kak-sozdat-nastroyku-dlya-otkljuchenija-emoji-v-wordpress" target="_blank" rel="nofollow noopener">Clearfy Pro — отключение Emoji</a>

Заключение и расширения

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

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