大家在网络上浏览一些网站的内容时，在内容的结尾，都会有一个获赞的按键，如果感觉文章非常非常好，就可以点击这一“获赞”按键，给之一篇文章进行获赞一下。在wordpress网站的模版主题开发设计中，大家能不能也为大家wordpress网站的内容加上这一“获赞”功能呢？答案是毫无疑问的。那么wordpress网站的文章怎么添加点赞功能呢？看我是怎样完成的吧。

第一步：在wordpress模板的头部文件header.php中引入jquery。

为了在点击“点赞”按钮时，能够向后台传递数据，我们这里要用到jquery的AJAX处理函数，所以，我们要先在wordpress模板的头部文件中引入这个jquery文件，我这里是jquery1.7.2版本，其它版本也可以。代码如下：

<script src="<?php bloginfo("template_url"); ?>/js/jquery-1.7.2.min.js"></script>

第二步：在wordpress文章内容下方添加“点赞”按钮。代码如下：

<div class="item single_praise">

点赞：

<span class="dashicons-before dashicons-heart"></span>

<span class="praise_num">

<?php

$praise_num = get_post_meta($post->ID,'post_praise')[0]; //获取点赞数

echo $praise_num ? $praise_num : 0;

?>

</span>

</div>

第三步：添加点击“点赞”的事件处理代码。

我们要给这个“点赞”按钮添加一个事件，只要一点击这个“点赞”按钮，就弹出相应的事件处理，把当前文章的ID号通过AJAX传递到single_praise.php文件中。代码如下：

<script type="text/javascript">

$(function(){

var pid = <?php echo $post->ID; ?>; //文章ID

var user = '<?php echo wp_get_current_user()->user_login; ?>'; //当前登录的用户名

$(".single_praise").click(function(){

$.ajax({

type:'post',

url:'<?php bloginfo("template_url"); ?>/include/single_praise.php',

data:{ pid:pid,user:user },

success:function(e){ console.log(e)

var num = e ? e : 0;

$(".praise_num").html(num); //把点赞重新写入

}

})

})

})

</script>

第四步：向wordpress数据库中的对应文章添加“点赞”数据。

在wordpress模板目录下的include目录的下面，创建一个single_praise.php文件，用来接收AJAX传递过来的数据，然后，向wordpress数据库里添加或修改数据（文章的点赞数据）。代码如下：

<?php

define('BASE_PATH',str_replace( '\' , '/' , realpath(dirname(__FILE__).'/../../../../')));//获取根目录

require(BASE_PATH.'/wp-load.php' );

$postid = esc_sql($_POST['pid']);

$user = esc_sql($_POST['user']);

$u_ip = $_SERVER["REMOTE_ADDR"];

if($postid==0 ){ //如果文章ID=0

exit("非法操作");

}

//向数据库中添加点赞数据

$praise_num = get_post_meta($postid,'post_praise')[0];

$user_views = !empty($praise_num) ? $praise_num : 0;

update_post_meta($postid,'post_praise',$user_views+1);

print_r($praise_num); exit;

通过上面的五步，我们就给wordpress网站的文章添加了点赞功能，我们每点击一次，就会给文章的点赞数据+1。这样，我们就基本上完成了操作。但是，有一个美中不足的地方，同一个用户，如果连续点击这个“点赞”按钮，就会不停地增加点赞数，这样不太友好。

2020-8-4 更新：

为一实现同一个用户在24小时之内，只能对同一篇文章点赞一次，我们需要借用JS的cookie插件。这个插件可以把用户点赞的信息记录在浏览器的cookie里，如果用户在24小时内再次点击点赞，就会弹出提示“你已经点赞过”，并且不再向wordpress数据库添加数据。

把第三步代码改成如下代码：

<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/jquery.cookie.js"></script>

<script type="text/javascript">

$(function(){

var pid = <?php echo $post->ID; ?>; //文章ID

var user = '<?php echo wp_get_current_user()->user_login; ?>'; //当前登录的用户名

var u_ip = '<?php echo $_SERVER["REMOTE_ADDR"]; ?>'; //当前客户端的IP地址

var cookie_val = user+'_'+pid+'_'+u_ip; //cookie名： 用户名+文章ID+客户端IP 【组成独一无二的名】

$(".single_praise").click(function(){

if($.cookie(cookie_val)){ //如果 COOKIE 存在，就提示 已点赞过

alert("你已点赞过了。"); return;

}

$.ajax({

type:'post',

url:'<?php bloginfo("template_url"); ?>/include/single_praise.php',

data:{ pid:pid,user:user },

success:function(e){ //console.log(e)

var num = e ? e : 0;

$(".praise_num").html(num); //把点赞重新写入

$.cookie(cookie_val, cookie_val, { expires: 1 }); //设置COOKIE有效期 1 天

}

})

})

})

</script>

添加好代码后，我们再重复点击点赞按钮时，就只会记录一次点赞的记录。

上面就是wordpress添加点赞的介绍，若有疑问可以找小编进一步探讨交流~