要实现文章点赞功能,并避免同一内容多次点赞的情况,我们可以使用WordPress的post_meta来存储点赞数,并使用Cookie来追踪已点赞的内容。
以下是实现这个功能的步骤:
第一步:添加点赞按钮和处理逻辑
在你的文章模板文件(例如single.php)中,找到你想要放置点赞按钮的位置。
使用以下代码添加点赞按钮:
<button class="like-button" data-post-id="<?php the_ID(); ?>">点赞</button>
在主题的functions.php文件中添加以下代码来处理点赞请求:
function handle_like_request() {
if (isset($_POST['post_id'])) {
$post_id = intval($_POST['post_id']);
$liked_posts = isset($_COOKIE['liked_posts']) ? unserialize($_COOKIE['liked_posts']) : array();
if (!in_array($post_id, $liked_posts)) {
// 点赞数加1
$likes = get_post_meta($post_id, 'like', true);
$likes = $likes ? $likes + 1 : 1;
update_post_meta($post_id, 'like', $likes);
// 将已点赞的文章ID添加到Cookie中
$liked_posts[] = $post_id;
setcookie('liked_posts', serialize($liked_posts), time()+3600, '/');
echo $likes; // 返回点赞数
} else {
echo 'already_liked'; // 如果已经点赞过,则返回标识符
}
}
wp_die();
}
add_action('wp_ajax_handle_like_request', 'handle_like_request');
add_action('wp_ajax_nopriv_handle_like_request', 'handle_like_request');
第二步:创建JavaScript代码
在主题的JavaScript文件中,添加以下代码来处理点赞按钮的点击事件:
jQuery(document).ready(function($) {
$('.like-button').on('click', function() {
var post_id = $(this).data('post-id');
var button = $(this);
$.ajax({
url: '<?php echo admin_url('admin-ajax.php'); ?>',
type: 'POST',
data: {
action: 'handle_like_request',
post_id: post_id
},
success: function(response) {
if (response === 'already_liked') {
alert('你已经点过赞了!');
} else {
button.text('已赞');
alert('点赞成功!总点赞数:' + response);
}
}
});
});
});
以上代码将处理点赞按钮的点击事件,并通过AJAX请求将点赞数据传递到服务器进行处理。
现在,当用户点击点赞按钮时,点赞数将增加,并且在同一篇文章上多次点击点赞按钮将被阻止。