文章点赞(顶一个)功能的实现,三步走:
步骤一
在functions.php内自定义点赞功能,代码如下:
//点赞功能
add_action('wp_ajax_nopriv_inlo_like', 'inlo_like');
add_action('wp_ajax_inlo_like', 'inlo_like');
function inlo_like(){
global $wpdb,$post;
$id = $_POST["um_id"];
$action = $_POST["um_action"];
if ( $action == 'ding'){
$inlo_raters = get_post_meta($id,'inlo_ding',true);
$expire = time() + 99999999;
$domain = ($_SERVER['HTTP_HOST'] != 'localhost') ? $_SERVER['HTTP_HOST'] : false; // make cookies work with localhost
setcookie('inlo_ding_'.$id,$id,$expire,'/',$domain,false);
if (!$inlo_raters || !is_numeric($inlo_raters)) {
update_post_meta($id, 'inlo_ding', 1);
}
else {
update_post_meta($id, 'inlo_ding', ($inlo_raters + 1));
}
echo get_post_meta($id,'inlo_ding',true);
}
die;
}
步骤二
html代码,将下面的div添加到需要点赞的位置:
<span class="zan"><a href="javascript:;" data-action="ding" data-id="<?php the_ID(); ?>" id="Addlike" class="action<?php if(isset($_COOKIE['inlo_ding_'.$post->ID])) echo ' actived';?> <?php $category = get_the_category(); echo $category[0]->category_nicename;?>"><i class="fa fa-thumbs-o-up"></i><span class="count"><?php if( get_post_meta($post->ID,'inlo_ding',true) ){ echo get_post_meta($post->ID,'inlo_ding',true); } else {echo '0';}?></span></a></span>
步骤三
点赞数值增加以及点赞后的提示,用js实现:
//点赞功能
$(document).on("click", "#Addlike", function() {
if ($(this).hasClass("actived")) {
return alert("您已经赞过啦!");
} else {
$(this).addClass("actived");
var z = $(this).data("id"), y = $(this).data("action"), x = $(this).children(".count");
var w = {
action: "inlo_like",
um_id: z,
um_action: y
};
$.post("/wp-admin/admin-ajax.php", w, function(A) {
$(x).html(A);
});
$.tipsBox({
obj: $(this),
str: "+1",
callback: function() {}
});
return false;
}
});
最后是css,看着办吧,以上。
本站文章除注明转载/出处外,均为本站原创或翻译。若要转载但请务必注明出处,尊重他人劳动成果。
转载请注明出处链接 : https://www.inlojv.com/4320.html
