wpcorp.ru wordpress WP Corp

Как создать настройку отслеживания событий в WordPress с примерами кода

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

Что такое отслеживание событий в WordPress и зачем оно нужно

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

В WordPress можно реализовать отслеживание событий несколькими способами:

  • Через плагины аналитики и трекинга.
  • Собственные скрипты с JavaScript и AJAX.
  • Использование хуков и действий PHP для регистрации данных на сервере.

Далее рассмотрим практические примеры.

Использование плагина для отслеживания событий: WP Event Manager

Один из популярных плагинов для отслеживания событий — WP Event Manager. Он позволяет создавать и регистрировать события с подробной настройкой триггеров и условий.

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

  • Простая настройка без программирования.
  • Поддержка различных типов событий.
  • Интеграция с Google Analytics и другими сервисами.

Для установки:

  1. Зайдите в панель управления WordPress → Плагины → Добавить новый.
  2. Найдите «WP Event Manager» и установите.
  3. Активируйте плагин и перейдите в настройки для создания событий.

Создание собственного отслеживания события с помощью PHP и AJAX

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

1. Добавление скрипта и кнопки на страницу

Сначала зарегистрируем и подключим JavaScript файл, который будет отправлять данные на сервер через AJAX.

function wpcorp_enqueue_event_scripts() {
    wp_enqueue_script('wpcorp-event-tracker', get_template_directory_uri() . '/js/event-tracker.js', array('jquery'), '1.0', true);
    wp_localize_script('wpcorp-event-tracker', 'wpcorp_ajax_obj', array(
        'ajax_url' => admin_url('admin-ajax.php'),
        'nonce' => wp_create_nonce('wpcorp_event_nonce')
    ));
}
add_action('wp_enqueue_scripts', 'wpcorp_enqueue_event_scripts');

В шаблоне или через шорткод добавим кнопку:

<button id="wpcorp-track-btn">Нажми меня</button>

2. JavaScript для обработки клика и отправки AJAX

jQuery(document).ready(function($) {
    $('#wpcorp-track-btn').on('click', function() {
        $.ajax({
            url: wpcorp_ajax_obj.ajax_url,
            method: 'POST',
            data: {
                action: 'wpcorp_track_event',
                nonce: wpcorp_ajax_obj.nonce,
                event_type: 'button_click',
                event_data: 'Нажата кнопка на главной'
            },
            success: function(response) {
                console.log('Событие зарегистрировано:', response);
            },
            error: function() {
                console.log('Ошибка при отправке события');
            }
        });
    });
});

3. Обработка события на стороне сервера

function wpcorp_handle_track_event() {
    check_ajax_referer('wpcorp_event_nonce', 'nonce');

    $event_type = sanitize_text_field($_POST['event_type']);
    $event_data = sanitize_text_field($_POST['event_data']);
    $user_id = get_current_user_id();
    $time = current_time('mysql');

    global $wpdb;
    $table_name = $wpdb->prefix . 'wpcorp_events';

    // Создание таблицы, если её нет (один раз)
    if($wpdb->get_var("SHOW TABLES LIKE '{$table_name}'") != $table_name) {
        $charset_collate = $wpdb->get_charset_collate();
        $sql = "CREATE TABLE {$table_name} (
            id mediumint(9) NOT NULL AUTO_INCREMENT,
            user_id bigint(20) NOT NULL,
            event_type varchar(100) NOT NULL,
            event_data text NOT NULL,
            event_time datetime DEFAULT '0000-00-00 00:00:00' NOT NULL,
            PRIMARY KEY  (id)
        ) {$charset_collate};";
        require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
        dbDelta($sql);
    }

    $wpdb->insert($table_name, array(
        'user_id' => $user_id,
        'event_type' => $event_type,
        'event_data' => $event_data,
        'event_time' => $time
    ));

    wp_send_json_success('Событие сохранено');
}
add_action('wp_ajax_wpcorp_track_event', 'wpcorp_handle_track_event');
add_action('wp_ajax_nopriv_wpcorp_track_event', 'wpcorp_handle_track_event');

Как использовать данные отслеживания событий

Собранные данные можно анализировать в админке, строить отчёты или интегрировать с внешними сервисами. Например, можно создать страницу в админке, которая выводит таблицу с событиями:

function wpcorp_events_admin_page() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'wpcorp_events';
    $events = $wpdb->get_results("SELECT * FROM {$table_name} ORDER BY event_time DESC LIMIT 100");

    echo '<div class="wrap"><h1>Отслеживаемые события</h1><table class="widefat fixed">';
    echo '<thead><tr><th>ID</th><th>Пользователь</th><th>Тип события</th><th>Данные</th><th>Время</th></tr></thead>';
    echo '<tbody>';
    foreach($events as $event) {
        echo "<tr><td>{$event->id}</td><td>{$event->user_id}</td><td>{$event->event_type}</td><td>{$event->event_data}</td><td>{$event->event_time}</td></tr>";
    }
    echo '</tbody></table></div>';
}

function wpcorp_add_events_menu() {
    add_menu_page('Отслеживаемые события', 'События', 'manage_options', 'wpcorp-events', 'wpcorp_events_admin_page');
}
add_action('admin_menu', 'wpcorp_add_events_menu');

Таким образом, вы получаете собственный инструмент для мониторинга пользовательских действий.

Интеграция с Google Analytics через события

Если вы используете Google Analytics, можно отправлять события туда для более продвинутой аналитики. Например, добавим вызов gtag в JavaScript:

jQuery(document).ready(function($) {
    $('#wpcorp-track-btn').on('click', function() {
        // Отправка события в Google Analytics
        if(typeof gtag === 'function') {
            gtag('event', 'button_click', {
                'event_category': 'WPCorp',
                'event_label': 'Нажата кнопка на главной'
            });
        }
        // Отправка на сервер
        $.ajax({
            url: wpcorp_ajax_obj.ajax_url,
            method: 'POST',
            data: {
                action: 'wpcorp_track_event',
                nonce: wpcorp_ajax_obj.nonce,
                event_type: 'button_click',
                event_data: 'Нажата кнопка на главной'
            }
        });
    });
});

Это позволит одновременно хранить события в базе и анализировать их в GA.

Заключение по настройке отслеживания событий в WordPress

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

Для расширения функционала можно использовать плагин Clearfy Pro, который помогает оптимизировать и расширять возможности WordPress, в том числе по части аналитики и безопасности.

×
Оптимизируй свой сайт!

Скидка -15% на премиум плагин Clearfy Pro

Купить плагин сейчас ⋙