WordPress高级教程：开发网站用户行为分析工具
概述：为什么需要用户行为分析工具
在当今数字时代，了解用户在网站上的行为模式对于优化用户体验、提高转化率和制定有效的内容策略至关重要。WordPress作为全球最流行的内容管理系统，虽然拥有众多分析插件，但开发自定义的用户行为分析工具可以为您提供更精准、更符合业务需求的数据洞察。
本教程将引导您开发一个完整的WordPress用户行为分析工具，该工具将跟踪用户在网站上的点击、滚动、停留时间等关键行为，并将数据可视化呈现。我们将采用模块化设计，确保代码的可维护性和扩展性。
项目架构设计
我们的用户行为分析工具将包含以下核心模块：
- 数据收集模块：通过JavaScript捕获用户行为事件
- 数据处理模块：通过AJAX将数据发送到WordPress后端
- 数据存储模块：将数据安全地存储到数据库中
- 数据分析模块：处理和分析收集到的数据
- 数据可视化模块：通过管理界面展示分析结果
第一步：创建插件基础结构
首先，我们需要创建一个WordPress插件来容纳我们的用户行为分析工具。
<?php
/**
* Plugin Name: WordPress用户行为分析工具
* Plugin URI: https://yourwebsite.com/
* Description: 跟踪和分析用户在WordPress网站上的行为
* Version: 1.0.0
* Author: 您的名字
* License: GPL v2 or later
* Text Domain: wp-user-behavior-analytics
*/
// 防止直接访问
if (!defined('ABSPATH')) {
exit;
}
// 定义插件常量
define('WP_UBA_VERSION', '1.0.0');
define('WP_UBA_PLUGIN_DIR', plugin_dir_path(__FILE__));
define('WP_UBA_PLUGIN_URL', plugin_dir_url(__FILE__));
// 主类
class WP_User_Behavior_Analytics {
private static $instance = null;
public static function get_instance() {
if (null === self::$instance) {
self::$instance = new self();
}
return self::$instance;
}
private function __construct() {
$this->init_hooks();
}
private function init_hooks() {
// 激活和停用钩子
register_activation_hook(__FILE__, array($this, 'activate'));
register_deactivation_hook(__FILE__, array($this, 'deactivate'));
// 初始化
add_action('plugins_loaded', array($this, 'init'));
}
public function activate() {
// 创建数据库表
$this->create_tables();
// 设置默认选项
$this->set_default_options();
}
public function deactivate() {
// 清理临时数据
// 注意：这里不清除分析数据，以便重新激活后可以继续使用
}
public function init() {
// 加载前端跟踪脚本
add_action('wp_enqueue_scripts', array($this, 'enqueue_tracking_scripts'));
// 加载管理界面
add_action('admin_menu', array($this, 'add_admin_menu'));
// 注册AJAX处理函数
add_action('wp_ajax_wp_uba_track_event', array($this, 'handle_tracking_event'));
add_action('wp_ajax_nopriv_wp_uba_track_event', array($this, 'handle_tracking_event'));
// 初始化数据库类
require_once WP_UBA_PLUGIN_DIR . 'includes/class-wp-uba-database.php';
WP_UBA_Database::init();
}
private function create_tables() {
global $wpdb;
$charset_collate = $wpdb->get_charset_collate();
$table_name = $wpdb->prefix . 'uba_user_events';
$sql = "CREATE TABLE IF NOT EXISTS $table_name (
id bigint(20) NOT NULL AUTO_INCREMENT,
user_id bigint(20) DEFAULT NULL,
session_id varchar(64) NOT NULL,
event_type varchar(50) NOT NULL,
event_value text,
page_url varchar(500) NOT NULL,
element_info text,
viewport_width int(11),
viewport_height int(11),
scroll_depth int(11) DEFAULT 0,
time_on_page int(11) DEFAULT 0,
created_at datetime DEFAULT CURRENT_TIMESTAMP,
PRIMARY KEY (id),
KEY user_id (user_id),
KEY session_id (session_id),
KEY event_type (event_type),
KEY created_at (created_at)
) $charset_collate;";
require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
dbDelta($sql);
}
private function set_default_options() {
$default_options = array(
'track_clicks' => true,
'track_scroll' => true,
'track_time' => true,
'exclude_admin' => true,
'data_retention_days' => 90,
'anonymize_ip' => true
);
add_option('wp_uba_settings', $default_options);
}
public function enqueue_tracking_scripts() {
// 检查是否排除管理员
$settings = get_option('wp_uba_settings');
if ($settings['exclude_admin'] && current_user_can('manage_options')) {
return;
}
// 注册并排队跟踪脚本
wp_enqueue_script(
'wp-uba-tracker',
WP_UBA_PLUGIN_URL . 'assets/js/tracker.js',
array('jquery'),
WP_UBA_VERSION,
true
);
// 传递数据到JavaScript
wp_localize_script('wp-uba-tracker', 'wpUba', array(
'ajax_url' => admin_url('admin-ajax.php'),
'nonce' => wp_create_nonce('wp_uba_tracking_nonce'),
'session_id' => $this->generate_session_id(),
'user_id' => get_current_user_id(),
'settings' => $settings
));
}
private function generate_session_id() {
if (isset($_COOKIE['wp_uba_session_id'])) {
return sanitize_text_field($_COOKIE['wp_uba_session_id']);
}
$session_id = md5(uniqid(wp_rand(), true));
setcookie('wp_uba_session_id', $session_id, time() + (86400 * 30), '/');
return $session_id;
}
public function add_admin_menu() {
add_menu_page(
'用户行为分析',
'行为分析',
'manage_options',
'wp-user-behavior-analytics',
array($this, 'render_admin_page'),
'dashicons-chart-area',
30
);
// 添加子菜单
add_submenu_page(
'wp-user-behavior-analytics',
'分析仪表板',
'仪表板',
'manage_options',
'wp-user-behavior-analytics',
array($this, 'render_admin_page')
);
add_submenu_page(
'wp-user-behavior-analytics',
'设置',
'设置',
'manage_options',
'wp-uba-settings',
array($this, 'render_settings_page')
);
}
public function render_admin_page() {
include WP_UBA_PLUGIN_DIR . 'admin/views/dashboard.php';
}
public function render_settings_page() {
include WP_UBA_PLUGIN_DIR . 'admin/views/settings.php';
}
public function handle_tracking_event() {
// 验证nonce
if (!wp_verify_nonce($_POST['nonce'], 'wp_uba_tracking_nonce')) {
wp_die('安全验证失败');
}
// 处理跟踪数据
$data = array(
'user_id' => intval($_POST['user_id']),
'session_id' => sanitize_text_field($_POST['session_id']),
'event_type' => sanitize_text_field($_POST['event_type']),
'event_value' => sanitize_textarea_field($_POST['event_value']),
'page_url' => esc_url_raw($_POST['page_url']),
'element_info' => sanitize_textarea_field($_POST['element_info']),
'viewport_width' => intval($_POST['viewport_width']),
'viewport_height' => intval($_POST['viewport_height']),
'scroll_depth' => intval($_POST['scroll_depth']),
'time_on_page' => intval($_POST['time_on_page'])
);
// 保存到数据库
global $wpdb;
$table_name = $wpdb->prefix . 'uba_user_events';
$wpdb->insert($table_name, $data);
wp_die('success');
}
}
// 初始化插件
WP_User_Behavior_Analytics::get_instance();
?>第二步：创建数据库操作类
<?php
// 文件路径: includes/class-wp-uba-database.php
class WP_UBA_Database {
public static function init() {
// 初始化数据库操作
}
/**
* 获取用户事件数据
*
* @param array $args 查询参数
* @return array 事件数据
*/
public static function get_user_events($args = array()) {
global $wpdb;
$defaults = array(
'limit' => 100,
'offset' => 0,
'event_type' => '',
'user_id' => '',
'start_date' => '',
'end_date' => ''
);
$args = wp_parse_args($args, $defaults);
$table_name = $wpdb->prefix . 'uba_user_events';
$where = array('1=1');
$prepare_values = array();
if (!empty($args['event_type'])) {
$where[] = 'event_type = %s';
$prepare_values[] = $args['event_type'];
}
if (!empty($args['user_id'])) {
$where[] = 'user_id = %d';
$prepare_values[] = $args['user_id'];
}
if (!empty($args['start_date'])) {
$where[] = 'created_at >= %s';
$prepare_values[] = $args['start_date'];
}
if (!empty($args['end_date'])) {
$where[] = 'created_at <= %s';
$prepare_values[] = $args['end_date'];
}
$where_clause = implode(' AND ', $where);
$query = "SELECT * FROM $table_name WHERE $where_clause
ORDER BY created_at DESC
LIMIT %d OFFSET %d";
$prepare_values[] = $args['limit'];
$prepare_values[] = $args['offset'];
if (!empty($prepare_values)) {
$query = $wpdb->prepare($query, $prepare_values);
}
return $wpdb->get_results($query);
}
/**
* 获取热门点击元素
*
* @param string $period 时间周期 (today, week, month)
* @return array 热门点击数据
*/
public static function get_top_clicks($period = 'week') {
global $wpdb;
$table_name = $wpdb->prefix . 'uba_user_events';
// 根据时间周期设置日期范围
$date_condition = '';
switch ($period) {
case 'today':
$date_condition = "DATE(created_at) = CURDATE()";
break;
case 'week':
$date_condition = "created_at >= DATE_SUB(NOW(), INTERVAL 7 DAY)";
break;
case 'month':
$date_condition = "created_at >= DATE_SUB(NOW(), INTERVAL 30 DAY)";
break;
default:
$date_condition = "1=1";
}
$query = $wpdb->prepare(
"SELECT element_info, COUNT(*) as click_count,
page_url, COUNT(DISTINCT session_id) as unique_users
FROM $table_name
WHERE event_type = 'click' AND $date_condition
GROUP BY element_info, page_url
ORDER BY click_count DESC
LIMIT 10"
);
return $wpdb->get_results($query);
}
/**
* 获取滚动深度分析
*/
public static function get_scroll_depth_stats() {
global $wpdb;
$table_name = $wpdb->prefix . 'uba_user_events';
$query = "SELECT
AVG(scroll_depth) as avg_scroll_depth,
MAX(scroll_depth) as max_scroll_depth,
COUNT(CASE WHEN scroll_depth >= 75 THEN 1 END) * 100.0 / COUNT(*) as percent_75,
COUNT(CASE WHEN scroll_depth >= 90 THEN 1 END) * 100.0 / COUNT(*) as percent_90
FROM $table_name
WHERE event_type = 'page_exit' AND scroll_depth > 0";
return $wpdb->get_row($query);
}
}
?>第三步：创建前端跟踪脚本
// 文件路径: assets/js/tracker.js
(function($) {
'use strict';
// 用户行为跟踪器类
var UserBehaviorTracker = {
// 初始化配置
config: {
sessionId: '',
userId: 0,
pageStartTime: null,
maxScrollDepth: 0,
trackingEnabled: true
},
// 初始化跟踪器
init: function() {
if (!this.config.trackingEnabled) {
return;
}
// 设置页面开始时间
this.config.pageStartTime = new Date();
// 绑定事件监听器
this.bindEvents();
// 发送页面浏览事件
this.trackPageView();
// 设置页面卸载时的处理
this.setupPageUnload();
},
// 绑定事件监听器
bindEvents: function() {
var self = this;
// 跟踪点击事件
$(document).on('click', function(e) {
self.trackClick(e);
});
// 跟踪滚动事件（使用节流函数优化性能）
$(window).on('scroll', this.throttle(function() {
self.trackScroll();
}, 500));
// 跟踪表单交互
$(document).on('change', 'input, select, textarea', function(e) {
self.trackFormInteraction(e);
});
},
// 跟踪页面浏览
trackPageView: function() {
this.sendEvent('page_view', {
page_title: document.title,
referrer: document.referrer || 'direct'
});
},
// 跟踪点击事件
trackClick: function(event) {
var $target = $(event.target);
var elementInfo = this.getElementInfo($target);
// 忽略某些元素
if (this.shouldIgnoreElement($target)) {
return;
}
this.sendEvent('click', {
element: elementInfo,
text: $target.text().substring(0, 100) // 限制文本长度
});
},
// 跟踪滚动深度
trackScroll: function() {
var scrollTop = $(window).scrollTop();
var windowHeight = $(window).height();
var documentHeight = $(document).height();
// 计算滚动百分比
var scrollDepth = Math.round((scrollTop + windowHeight) / documentHeight * 100);
// 只记录最大滚动深度
if (scrollDepth > this.config.maxScrollDepth) {
this.config.maxScrollDepth = scrollDepth;
}
},
// 跟踪表单交互
trackFormInteraction: function(event) {
var $target = $(event.target);
var elementInfo = this.getElementInfo($target);
this.sendEvent('form_interaction', {
element: elementInfo,
value: $target.val().substring(0, 200),
field_type: $target.prop('tagName').toLowerCase()
});
},
// 获取元素信息
getElementInfo: function($element) {
var info = {
tag: $element.prop('tagName').toLowerCase(),
id: $element.attr('id') || '',
class: $element.attr('class') || '',
name: $element.attr('name') || ''
};
// 构建可读的选择器
var selector = info.tag;
if (info.id) {
selector += '#' + info.id;
} else if (info.class) {
var classes = info.class.split(' ')[0];
if (classes) {
selector += '.' + classes;
}
}
return selector;
},
// 检查是否应该忽略元素
shouldIgnoreElement: function($element) {
// 忽略特定类型的元素
var ignoreTags = ['html', 'body', 'script', 'style'];
var tagName = $element.prop('tagName').toLowerCase();
if (ignoreTags.indexOf(tagName) !== -1) {
return true;
}
// 忽略特定类名的元素
var ignoreClasses = ['uba-ignore', 'no-track'];
var elementClasses = $element.attr('class') || '';
for (var i = 0; i < ignoreClasses.length; i++) {
if (elementClasses.indexOf(ignoreClasses[i]) !== -1) {
return true;
}
}
return false;
},
// 发送事件到服务器
sendEvent: function(eventType, eventData) {
var self = this;
// 计算页面停留时间
var timeOnPage = 0;
if (this.config.pageStartTime) {
timeOnPage = Math.round((new Date() - this.config.pageStartTime) / 1000);
}
// 准备发送的数据
var data = {
action: 'wp_uba_track_event',
nonce: wpUba.nonce,
user_id: wpUba.user_id,
session_id: wpUba.session_id,event_type: eventType,
event_value: JSON.stringify(eventData),
page_url: window.location.href,
element_info: eventData.element || '',
viewport_width: window.innerWidth,
viewport_height: window.innerHeight,
scroll_depth: this.config.maxScrollDepth,
time_on_page: timeOnPage
};
// 使用navigator.sendBeacon如果可用（用于页面卸载时发送）
if (navigator.sendBeacon && eventType === 'page_exit') {
var formData = new FormData();
for (var key in data) {
formData.append(key, data[key]);
}
navigator.sendBeacon(wpUba.ajax_url, formData);
} else {
// 正常AJAX请求
$.post(wpUba.ajax_url, data, function(response) {
console.log('Event tracked:', eventType);
}).fail(function(xhr, status, error) {
console.error('Tracking error:', error);
});
}
},
// 设置页面卸载处理
setupPageUnload: function() {
var self = this;
// 页面可见性变化处理
document.addEventListener('visibilitychange', function() {
if (document.visibilityState === 'hidden') {
self.trackPageExit();
}
});
// 页面卸载前发送数据
window.addEventListener('beforeunload', function() {
self.trackPageExit();
});
},
// 跟踪页面退出
trackPageExit: function() {
if (!this.pageExitTracked) {
this.sendEvent('page_exit', {
exit_time: new Date().toISOString(),
scroll_depth: this.config.maxScrollDepth
});
this.pageExitTracked = true;
}
},
// 节流函数，优化性能
throttle: function(func, wait) {
var timeout = null;
return function() {
var context = this, args = arguments;
if (!timeout) {
timeout = setTimeout(function() {
func.apply(context, args);
timeout = null;
}, wait);
}
};
}
};
// 当DOM加载完成后初始化跟踪器
$(document).ready(function() {
// 检查是否启用跟踪
if (wpUba.settings.track_clicks || wpUba.settings.track_scroll || wpUba.settings.track_time) {
UserBehaviorTracker.config.sessionId = wpUba.sessionId;
UserBehaviorTracker.config.userId = wpUba.userId;
UserBehaviorTracker.init();
}
});
})(jQuery);
## 第四步：创建数据分析仪表板
<?php
// 文件路径: admin/views/dashboard.php
// 检查用户权限
if (!current_user_can('manage_options')) {
wp_die('您没有权限访问此页面');}
// 获取分析数据
$top_clicks = WP_UBA_Database::get_top_clicks('week');
$scroll_stats = WP_UBA_Database::get_scroll_depth_stats();
$recent_events = WP_UBA_Database::get_user_events(array('limit' => 20));
// 计算基本统计
global $wpdb;
$table_name = $wpdb->prefix . 'uba_user_events';
$total_events = $wpdb->get_var("SELECT COUNT(*) FROM $table_name");
$unique_users = $wpdb->get_var("SELECT COUNT(DISTINCT session_id) FROM $table_name");
$avg_time_on_page = $wpdb->get_var("SELECT AVG(time_on_page) FROM $table_name WHERE time_on_page > 0");
?>
<div class="wrap">
<h1>用户行为分析仪表板</h1>
<div class="uba-dashboard">
<!-- 概览卡片 -->
<div class="uba-overview-cards">
<div class="uba-card">
<h3>总事件数</h3>
<p class="uba-stat"><?php echo number_format($total_events); ?></p>
</div>
<div class="uba-card">
<h3>独立用户</h3>
<p class="uba-stat"><?php echo number_format($unique_users); ?></p>
</div>
<div class="uba-card">
<h3>平均页面停留时间</h3>
<p class="uba-stat"><?php echo round($avg_time_on_page); ?>秒</p>
</div>
<div class="uba-card">
<h3>平均滚动深度</h3>
<p class="uba-stat"><?php echo round($scroll_stats->avg_scroll_depth); ?>%</p>
</div>
</div>
<!-- 热门点击区域 -->
<div class="uba-section">
<h2>本周热门点击</h2>
<table class="wp-list-table widefat fixed striped">
<thead>
<tr>
<th>元素</th>
<th>点击次数</th>
<th>独立用户</th>
<th>页面URL</th>
</tr>
</thead>
<tbody>
<?php if (empty($top_clicks)): ?>
<tr>
<td colspan="4">暂无数据</td>
</tr>
<?php else: ?>
<?php foreach ($top_clicks as $click): ?>
<tr>
<td><?php echo esc_html($click->element_info); ?></td>
<td><?php echo esc_html($click->click_count); ?></td>
<td><?php echo esc_html($click->unique_users); ?></td>
<td>
<a href="<?php echo esc_url($click->page_url); ?>" target="_blank">
<?php echo esc_html(substr($click->page_url, 0, 50) . '...'); ?>
</a>
</td>
</tr>
<?php endforeach; ?>
<?php endif; ?>
</tbody>
</table>
</div>
<!-- 滚动深度分析 -->
<div class="uba-section">
<h2>滚动深度分析</h2>
<div class="uba-stats-grid">
<div class="uba-stat-item">
<h4>平均滚动深度</h4>
<div class="uba-progress-bar">
<div class="uba-progress-fill" style="width: <?php echo esc_attr($scroll_stats->avg_scroll_depth); ?>%"></div>
</div>
<span><?php echo round($scroll_stats->avg_scroll_depth); ?>%</span>
</div>
<div class="uba-stat-item">
<h4>滚动到75%的用户</h4>
<div class="uba-progress-bar">
<div class="uba-progress-fill" style="width: <?php echo esc_attr($scroll_stats->percent_75); ?>%"></div>
</div>
<span><?php echo round($scroll_stats->percent_75, 1); ?>%</span>
</div>
<div class="uba-stat-item">
<h4>滚动到90%的用户</h4>
<div class="uba-progress-bar">
<div class="uba-progress-fill" style="width: <?php echo esc_attr($scroll_stats->percent_90); ?>%"></div>
</div>
<span><?php echo round($scroll_stats->percent_90, 1); ?>%</span>
</div>
</div>
</div>
<!-- 最近事件 -->
<div class="uba-section">
<h2>最近用户事件</h2>
<table class="wp-list-table widefat fixed striped">
<thead>
<tr>
<th>时间</th>
<th>事件类型</th>
<th>用户/会话</th>
<th>页面</th>
<th>详细信息</th>
</tr>
</thead>
<tbody>
<?php if (empty($recent_events)): ?>
<tr>
<td colspan="5">暂无数据</td>
</tr>
<?php else: ?>
<?php foreach ($recent_events as $event): ?>
<tr>
<td><?php echo date('Y-m-d H:i:s', strtotime($event->created_at)); ?></td>
<td>
<span class="uba-event-type uba-event-<?php echo esc_attr($event->event_type); ?>">
<?php echo esc_html($event->event_type); ?>
</span>
</td>
<td>
<?php if ($event->user_id): ?>
用户 #<?php echo esc_html($event->user_id); ?>
<?php else: ?>
访客
<?php endif; ?>
</td>
<td>
<a href="<?php echo esc_url($event->page_url); ?>" target="_blank">
<?php echo esc_html(parse_url($event->page_url, PHP_URL_PATH) ?: $event->page_url); ?>
</a>
</td>
<td>
<?php
$event_value = json_decode($event->event_value, true);
if ($event_value) {
echo esc_html(substr(print_r($event_value, true), 0, 100) . '...');
} else {
echo esc_html(substr($event->event_value, 0, 100) . '...');
}
?>
</td>
</tr>
<?php endforeach; ?>
<?php endif; ?>
</tbody>
</table>
</div>
</div></div>
<style>
.uba-dashboard {
margin-top: 20px;}
.uba-overview-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 20px;
margin-bottom: 30px;}
.uba-card {
background: #fff;
border: 1px solid #ccd0d4;
border-radius: 4px;
padding: 20px;
text-align: center;
box-shadow: 0 1px 3px rgba(0,0,0,0.1);}
.uba-card h3 {
margin-top: 0;
color: #666;
font-size: 14px;
text-transform: uppercase;}
.uba-stat {
font-size: 32px;
font-weight: bold;
color: #2271b1;
margin: 10px 0 0;}
.uba-section {
background: #fff;
border: 1px solid #ccd0d4;
border-radius: 4px;
padding: 20px;
margin-bottom: 20px;}
.uba-section h2 {
margin-top: 0;
border-bottom: 1px solid #eee;
padding-bottom: 10px;}
.uba-stats-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 20px;}
.uba-stat-item {
padding: 15px;
background: #f8f9fa;
border-radius: 4px;}
.uba-stat-item h4 {
margin-top: 0;
margin-bottom: 10px;
color: #555;}
.uba-progress-bar {
height: 20px;
background: #e0e0e0;
border-radius: 10px;
overflow: hidden;
margin-bottom: 5px;}
.uba-progress-fill {
height: 100%;
background: linear-gradient(90deg, #2271b1, #00a0d2);
transition: width 0.3s ease;}
.uba-event-type {
display: inline-block;
padding: 2px 8px;
border-radius: 3px;
font-size: 12px;
font-weight: bold;}
.uba-event-click {
background: #00a0d2;
color: white;}
.uba-event-page_view {
background: #46b450;
color: white;}
.uba-event-page_exit {
background: #dc3232;
color: white;}
.uba-event-form_interaction {
background: #f56e28;
color: white;}
</style>
## 第五步：创建设置页面
<?php
// 文件路径: admin/views/settings.php
// 检查用户权限
if (!current_user_can('manage_options')) {
wp_die('您没有权限访问此页面');}
// 处理表单提交
if (isset($_POST['submit'])) {
// 验证nonce
if (!wp_verify_nonce($_POST['wp_uba_settings_nonce'], 'wp_uba_save_settings')) {
wp_die('安全验证失败');
}
// 准备设置数据
$settings = array(
'track_clicks' => isset($_POST['track_clicks']) ? true : false,
'track_scroll' => isset($_POST['track_scroll']) ? true : false,
'track_time' => isset($_POST['track_time']) ? true : false,
'exclude_admin' => isset($_POST['exclude_admin']) ? true : false,
'data_retention_days' => intval($_POST['data_retention_days']),
'anonymize_ip' => isset($_POST['anonymize_ip']) ? true : false,
'ignore_selectors' => sanitize_textarea_field($_POST['ignore_selectors'])
);
// 保存设置
update_option('wp_uba_settings', $settings);
echo '<div class="notice notice-success"><p>设置已保存！</p></div>';}
// 获取当前设置
$settings = get_option('wp_uba_settings', array());
?>
<div class="wrap">
<h1>用户行为分析工具设置</h1>
<form method="post" action="">
<?php wp_nonce_field('wp_uba_save_settings', 'wp_uba_settings_nonce'); ?>
<table class="form-table">
<tr>
<th scope="row">跟踪选项</th>
<td>
<fieldset>
<legend class="screen-reader-text">跟踪选项</legend>
<label>
<input type="checkbox" name="track_clicks" value="1"
<?php checked($settings['track_clicks'], true); ?>>
跟踪点击事件
</label>
<br>
<label>
<input type="checkbox" name="track_scroll" value="1"
<?php checked($settings['track_scroll'], true); ?>>
跟踪滚动深度
</label>
<br>
<label>
<input type="checkbox" name="track_time" value="1"
<?php checked($settings['track_time'], true); ?>>
跟踪页面停留时间
</label>
</fieldset>
</td>
</tr>
<tr>
<th scope="row">隐私设置</th>
<td>
<fieldset>
<legend class="screen-reader-text">隐私设置</legend>
<label>
<input type="checkbox" name="exclude_admin" value="1"
<?php checked($settings['exclude_admin'], true); ?>>
排除管理员用户
</label>
<p class="description">启用后，管理员用户在网站上的行为不会被跟踪</p>
<br>
<label>
<input type="checkbox" name="anonymize_ip" value="1"
<?php checked($settings['anonymize_ip'], true); ?>>
匿名化IP地址
</label>
<p class="description">启用后，IP地址将被哈希处理以保护用户隐私</p>
</fieldset>
</td>
</tr>
<tr>
<th scope="row">数据保留期限</th>
<td>
<input type="number" name="data_retention_days"
value="<?php echo esc_attr($settings['data_retention_days']); ?>"
min="1" max="365" class="small-text">
天
<p class="description">设置用户行为数据的保留天数，超过此天数的数据将被自动清理</p>
</td>
</tr>
<tr>
<th scope="row">忽略的元素选择器</th>
<td>
<textarea name="ignore_selectors" rows="5" cols="50" class="large-text code"><?php
echo esc_textarea($settings['ignore_selectors'] ?? '');
?></textarea>
<p class="description">
每行一个CSS选择器，匹配的元素将不会被跟踪。<br>
例如：<code>.menu-item</code>, <code>#sidebar</code>, <code>button.submit</code>
</p>
</td>
</tr>
<tr>
<th scope="row">数据管理</th>
<td>
<p>
<a href="<?php echo admin_url('admin.php?page=wp-user-behavior-analytics&action=export'); ?>"
class="button">
导出数据 (CSV)
</a>
<button type="button" id="uba-clear-data" class="button button-secondary">
清除所有数据
</button>
</p>
<p class="description">
注意：清除数据操作不可逆，请谨慎操作！
</p>
</td>
</tr>
</table>
<p class="submit">
<input type="submit" name="submit" id="submit" class="button button-primary" value="保存更改">
</p>
</form></div>
<script>
jQuery(document).ready(function($) {
// 清除数据确认
$('#uba-clear-data').on('click', function(e) {
e.preventDefault();
if (confirm('确定要清除所有用户行为数据吗？此操作不可恢复！')) {
$.post(ajaxurl, {
action: 'wp_uba_clear_data',
nonce: '<?php echo wp_create_nonce("wp_uba_clear_data"); ?>'
}, function(response) {
if (response.success) {
alert('数据已清除！');
