Хук wp_footer в WordPress используется для добавления кода в нижнюю часть страницы, непосредственно перед закрывающим тегом

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

wp_footer часто используется для вставки JavaScript кода, который должен загружаться после основного HTML-контента страницы. Это помогает ускорить загрузку страницы, поскольку браузер сначала отображает содержимое, а затем подгружает дополнительные ресурсы.

Предположим, вам нужно подключить сторонний аналитический код или собственный JavaScript внизу страницы. Вот пример добавления кода через wp_footer:

function add_custom_js_to_footer() {
    echo '<script>
        console.log("Скрипт загружен через wp_footer");
    </script>';
}
add_action('wp_footer', 'add_custom_js_to_footer');

Этот код выведет в консоль сообщение, которое будет загружено и выполнено в конце страницы.

Подключение JavaScript файлов

Если вы хотите подключить внешний JavaScript файл (например, с CDN или вашего сервера), это также можно сделать через хук wp_footer. Вот пример:

function enqueue_custom_script_in_footer() {
    wp_enqueue_script('my-custom-js', get_template_directory_uri() . '/js/custom-footer.js', array(), '1.0', true);
}
add_action('wp_footer', 'enqueue_custom_script_in_footer');

Здесь wp_enqueue_script() подключает скрипт custom-footer.js и задаёт параметр true, чтобы скрипт был загружен в нижней части страницы перед закрывающим тегом </body>.

Преимущества использования wp_footer

  1. Оптимизация скорости загрузки: Скрипты, загруженные через wp_footer, не мешают основному контенту страницы и загружаются после того, как страница уже отобразилась. Это делает сайт быстрее для пользователей.
  2. Подключение сторонних сервисов: Часто коды для Google Analytics, Facebook Pixel или других сервисов нужно добавлять внизу страницы, чтобы они не блокировали отображение контента.
  3. Безопасность: WordPress сам заботится о корректной загрузке скриптов и стилей, что помогает избежать конфликтов и ошибок при ручной вставке.

Пример использования для аналитики

Если нужно добавить код Google Analytics или другой системы отслеживания, его также можно вставить через wp_footer:

function add_google_analytics() {
    ?>
    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXX-X"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', 'UA-XXXXXXX-X');
    </script>
    <?php
}
add_action('wp_footer', 'add_google_analytics');

Здесь мы добавляем код Google Analytics перед закрывающим тегом </body>, чтобы он не замедлял загрузку основной страницы.

Заключение

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

Почитаем еще?: