Как добавить JS-скрипт на определенные страницы в WordPress?

Вопрос или проблема

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

Когда я попытался вставить код ниже в файл темы function.php, чат-облако вообще не отображается.

Думаю, в коде может быть ошибка.

Заранее спасибо, если кто-то может мне с этим помочь!

Вот мой сайт https://staymeander.com/en/meander1948-en/

function wpb_hook_javascript_footer() {
    if(is_page( array('3854','253') ) ) {
    ?>
        <script type="text/javascript">
    (function () {
        var options = {
            line: "//lin.ee/gl1UqsC", // URL QR кода Line
            call: "+886225588812", // Номер телефона
            call_to_action: "Напишите нам", // Призыв к действию
            button_color: "#FF6550", // Цвет кнопки
            position: "right", // Положение может быть 'right' или 'left'
            order: "line,call", // Порядок кнопок
        };
        var proto = document.location.protocol, host = "getbutton.io", url = proto + "//static." + host;
        var s = document.createElement('script'); s.type="text/javascript"; s.async = true; s.src = url + '/widget-send-button/js/init.js';
        s.onload = function () { WhWidgetSendButton.init(host, proto, options); };
        var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
    }   
})();
</script>
    <?php
    }
}
add_action('wp_footer', 'wpb_hook_javascript_footer');

Если вы используете идентификаторы для is_page(), их следует указывать как целые числа, а не строки. В противном случае WordPress ищет страницы с slug “3854”, а не страницу с этим идентификатором.

Таким образом, вместо:

if ( is_page( array( '3854', '253' ) ) ) {}

Используйте:

if ( is_page( array( 3854, 253 ) ) ) {}


Ответ или решение

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

Пошаговое руководство по добавлению JS скрипта на конкретные страницы WordPress

1. Понимание введенного кода

На данный момент вы пытаетесь добавить JavaScript-скрипт через файл functions.php вашей темы. Здесь ключевой момент заключается в том, что вы используете функцию is_page() для определения страниц, на которых скрипт должен быть исполнен.

2. Исправление ошибки с использованием ID страниц

Первоначально скрипт не работал из-за того, что вы передали ID страниц как строки, а не как целые числа. WordPress воспринимает строки как слаги, поэтому проверяет на соответствие с URL-частью страницы, а не её ID. Вам необходимо изменить условие в коде, чтобы использовать целые числа:

function wpb_hook_javascript_footer() {
    if (is_page(array(3854, 253))) {
        ?>
        <script type="text/javascript">
        (function () {
            var options = {
                line: "//lin.ee/gl1UqsC", // URL QR-кода Line
                call: "+886225588812", // Номер для звонков
                call_to_action: "Message us", // Призыв к действию
                button_color: "#FF6550", // Цвет кнопки
                position: "right", // Позиция кнопки: 'right' или 'left'
                order: "line,call", // Порядок кнопок
            };
            var proto = document.location.protocol, host = "getbutton.io", url = proto + "//static." + host;
            var s = document.createElement('script'); s.type="text/javascript"; s.async = true; s.src = url + '/widget-send-button/js/init.js';
            s.onload = function(){ WhWidgetSendButton.init(host, proto, options); };
            var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s, x);
        })();
        </script>
        <?php
    }
}
add_action('wp_footer', 'wpb_hook_javascript_footer');

3. Убедитесь в правильности ID страниц

Прежде чем вносить изменения, убедитесь, что вы используете правильные ID страниц из административной панели WordPress. Если вы не уверены, как их получить, откройте страницу редактирования нужной страницы, и вы увидите ID в URL браузера.

4. Альтернативный подход: использование плагина

Если внесение изменений в файл functions.php кажется слишком сложным или рискованным, можно рассмотреть использование плагинов, как-то Code Snippets, которые позволяют добавлять кастомный код без необходимости вмешательства в файлы темы.

Заключение

Теперь ваш JavaScript должен работать только на указанных страницах. Правильное использование ID страниц является ключевым моментом. Кроме того, убедитесь, что ваш сайт использует данную тему активно, иначе изменения в functions.php не будут осуществлены.

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

Оцените материал
Добавить комментарий

Капча загружается...