wpcat.ru wordpress WPCat.ru

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

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

Почему стоит реализовать отслеживание событий самостоятельно

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

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

Конечно, это требует базовых знаний PHP, JavaScript и работы с WordPress API, но в итоге вы получите гибкое и понятное решение.

Основные подходы к отслеживанию событий в WordPress

Для отслеживания действий пользователей можно использовать несколько методов:

  1. JavaScript-события (например, клик по кнопке) с отправкой данных на сервер через AJAX.
  2. Отслеживание загрузок страниц и переходов с помощью хука template_redirect.
  3. Использование REST API для приема и обработки событий.

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

Создаем таблицу для хранения событий

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

Добавим функцию, которая создаст таблицу при активации темы или плагина:

function wpcat_create_events_table() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'wpcat_user_events';
    $charset_collate = $wpdb->get_charset_collate();

    $sql = "CREATE TABLE IF NOT EXISTS $table_name (
        id BIGINT(20) UNSIGNED NOT NULL AUTO_INCREMENT,
        user_id BIGINT(20) UNSIGNED NULL,
        event_name VARCHAR(100) NOT NULL,
        event_data TEXT NULL,
        event_time DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
        PRIMARY KEY  (id)
    ) $charset_collate;";

    require_once( ABSPATH . 'wp-admin/includes/upgrade.php' );
    dbDelta( $sql );
}
register_activation_hook( __FILE__, 'wpcat_create_events_table' );

Эта функция создаст таблицу wp_wpcat_user_events (префикс зависит от вашей установки) с необходимыми полями для хранения ID пользователя, названия события, дополнительных данных и времени.

Отслеживаем клики на кнопках с помощью JavaScript и AJAX

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

Добавим в тему или плагин регистрацию и подключение JS-файла:

function wpcat_enqueue_scripts() {
    wp_enqueue_script( 'wpcat-event-tracker', get_template_directory_uri() . '/js/wpcat-event-tracker.js', array('jquery'), '1.0', true );
    wp_localize_script( 'wpcat-event-tracker', 'wpcat_ajax', array(
        'ajax_url' => admin_url( 'admin-ajax.php' )
    ));
}
add_action( 'wp_enqueue_scripts', 'wpcat_enqueue_scripts' );

Создаем файл js/wpcat-event-tracker.js с таким содержанием:

jQuery(document).ready(function($) {
    $('.wpcat-track-click').on('click', function() {
        var eventName = $(this).data('event-name');
        var eventData = $(this).data('event-data') || '';

        $.post(wpcat_ajax.ajax_url, {
            action: 'wpcat_track_event',
            event_name: eventName,
            event_data: eventData
        });
    });
});

Теперь, чтобы отслеживать клик на кнопке, достаточно добавить ей класс wpcat-track-click и атрибуты data-event-name и опционально data-event-data:

<button class="wpcat-track-click" data-event-name="subscribe_click" data-event-data="form1">Подписаться</button>

Обработка AJAX-запроса и сохранение события

Опишем PHP-функцию, которая будет принимать данные и записывать в базу:

function wpcat_handle_track_event() {
    if ( ! isset( $_POST['event_name'] ) ) {
        wp_send_json_error('No event name');
        wp_die();
    }

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

    $user_id = get_current_user_id() ?: null;
    $event_name = sanitize_text_field( wp_unslash( $_POST['event_name'] ) );
    $event_data = isset( $_POST['event_data'] ) ? wp_kses_post( wp_unslash( $_POST['event_data'] ) ) : '';

    $wpdb->insert(
        $table_name,
        array(
            'user_id' => $user_id,
            'event_name' => $event_name,
            'event_data' => $event_data,
            'event_time' => current_time( 'mysql' ),
        ),
        array('%d', '%s', '%s', '%s')
    );

    wp_send_json_success();
    wp_die();
}
add_action('wp_ajax_wpcat_track_event', 'wpcat_handle_track_event');
add_action('wp_ajax_nopriv_wpcat_track_event', 'wpcat_handle_track_event');

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

Просмотр и анализ собранных данных

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

Пример функции для вывода последних 20 событий:

function wpcat_show_events_table() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'wpcat_user_events';

    $results = $wpdb->get_results( "SELECT * FROM $table_name ORDER BY event_time DESC LIMIT 20" );

    echo '<table><thead><tr><th>ID</th><th>Пользователь</th><th>Событие</th><th>Данные</th><th>Время</th></tr></thead><tbody>';

    foreach ( $results as $row ) {
        $user_info = $row->user_id ? get_userdata( $row->user_id ) : null;
        $user_name = $user_info ? esc_html( $user_info->user_login ) : 'Гость';

        echo '<tr>';
        echo '<td>' . intval( $row->id ) . '</td>';
        echo '<td>' . $user_name . '</td>';
        echo '<td>' . esc_html( $row->event_name ) . '</td>';
        echo '<td>' . esc_html( $row->event_data ) . '</td>';
        echo '<td>' . esc_html( $row->event_time ) . '</td>';
        echo '</tr>';
    }

    echo '</tbody></table>';
}

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

Дополнительные советы и рекомендации

Оптимизация и безопасность

Обязательно используйте функции очистки данных, такие как sanitize_text_field и wp_kses_post, чтобы избежать уязвимостей. Не забывайте про защиту от CSRF — здесь AJAX-запросы идут через admin-ajax.php, что уже предусматривает nonce, но при необходимости можно добавить собственные проверки.

Расширение функционала

Вы можете дополнить систему отслеживанием других событий: загрузки страниц, заполнение форм, ошибок JavaScript и т.д. Например, для отслеживания загрузки страниц можно использовать хуки wp или template_redirect и сохранять события автоматически.

Использование плагинов WPGPT и Clearfy Pro

Если хотите автоматизировать и расширить возможности, рекомендуем обратить внимание на плагин WPGPT, который позволяет создавать умные чатботы и собирать данные пользователей, а также Clearfy Pro — для оптимизации и настройки безопасности сайта, что также повысит качество сбора данных.

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

×

AI-плагин

WPGPT
Сам создает статьи для вашего сайта WordPress

SEO и мета-теги

Парсинг конкурентов

Изображения

Комментарии

Подробнее