За последние несколько месяцев мы помогли клиенту перенести свой сайт WordPress на новую тему и оптимизировать свои усилия по входящему маркетингу, минимизируя настройки и улучшая системное взаимодействие, включая аналитику.

Клиент имеет доступ к LiveChat, фантастическому чат-сервису с мощной интеграцией с Google Analytics на каждом этапе процесса чата. LiveChat имеет отличный API для интеграции его с вашим веб-сайтом, включая возможность открыть окно чата с помощью события onClick в теге привязки. Вот как это выглядит:

<a href="#" onclick="parent.LC_API.open_chat_window();return false;">Chat Now!</a>

Это удобно, когда вы можете редактировать основной код или добавлять собственный HTML. Большинство тем заблокированы по соображениям безопасности, поэтому вы не можете добавить событие onClick к любому объекту. Однако всегда можно указать class на вашу кнопку или ссылку. Вот как вы можете добавить на свой сайт код, который будет открывать окно чата, когда у элемента есть класс. openchat нажимается.

Вот полный код, который вы можете добавить. Мы добавили его в функции дочерней темы в файле с именем livechat.js.

В functions.php:

// Load the livechat script
function my_livechat_scripts() {
    // Use get_stylesheet_directory_uri() to get the URL of your child theme folder
    wp_enqueue_script('my-live-chat', get_stylesheet_directory_uri() . '/livechat.js', array(), false, true);
}
add_action('wp_enqueue_scripts', 'my_livechat_scripts');

И внутри livechat.js:

// Asynchronously load the chat widget script and add event listeners after it loads
(function() {
    var lc = document.createElement('script');
    lc.type="text/javascript";
    lc.async = true;
    lc.src="

    // This function adds event listeners to elements with the class 'openchat'
    function addChatButtonListeners() {
        var openchatElements = document.querySelectorAll('.openchat');
        openchatElements.forEach(function(element) {
            element.addEventListener('click', function() {
                if (window.LC_API) {
                    // Check if the chat window is already open
                    if (!window.LC_API.chat_window_minimized()) {
                        // If the chat window is not minimized (i.e., it's open), do nothing
                        return false;
                    }
                    // If the chat window is minimized, open it
                    window.LC_API.open_chat_window();
                    gtag('event', 'open_chat_window', {
                        'event_category': 'Chat Interaction',
                        'event_label': 'Live Chat Opened'
                    });
                }
                return false;
            });
        });
    }    

    // When the script is loaded, add the chat button listeners
    lc.onload = function() {
        // Wait for the DOM to be fully loaded
        document.addEventListener("DOMContentLoaded", function(event) {
            // Add event listeners and show buttons
            addChatButtonListeners();
        });
    };

    // Insert the script tag into the DOM
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(lc, s);
})();

Кроме того, мы записываем в GA4 событие, когда кто-то нажимает на ссылку. Мы также добавили логику, позволяющую не пытаться открыть окно чата, если оно уже открыто.

Начните работу с LiveChat

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