当前位置:
首页 > 网站建设 > 主题开发 > WordPress免插件Ajax点赞

WordPress免插件Ajax点赞

               

有些个人博客为了增加访客互动,不免要接触到点赞这个功能,那么本篇就来记录一下WordPress如何免插件进行Ajax点赞

老套路,functions.php加入:

/*
WordPress免插件Ajax点赞
http://www.wpxzt.com
*/
add_action('wp_ajax_nopriv_specs_zan', 'specs_zan');   
add_action('wp_ajax_specs_zan', 'specs_zan');   
function specs_zan(){   
    global $wpdb,$post;   
    $id = $_POST["um_id"];   
    $action = $_POST["um_action"];   
    if ( $action == 'ding'){   
        $specs_raters = get_post_meta($id,'specs_zan',true);   
        $expire = time() + 99999999;   
        $domain = ($_SERVER['HTTP_HOST'] != 'localhost') ? $_SERVER['HTTP_HOST'] : false;
        setcookie('specs_zan_'.$id,$id,$expire,'/',$domain,false);   
        if (!$specs_raters || !is_numeric($specs_raters)) {   
            update_post_meta($id, 'specs_zan', 1);   
        }    
        else {   
            update_post_meta($id, 'specs_zan', ($specs_raters + 1));   
        }   
        echo get_post_meta($id,'specs_zan',true);   
    }    
    die;   
}  

然后引用js代码,放到你的js文件中:

$.fn.postLike = function() {
    if ($(this).hasClass('done')) {
        alert('您已赞过本博客');
        return false;
    } else {
        $(this).addClass('done');
        var id = $(this).data("id"),
            action = $(this).data('action'),
            rateHolder = $(this).children('.count');
        var ajax_data = {
            action: "specs_zan",
            um_id: id,
            um_action: action
        };
        $.post("/wp-admin/admin-ajax.php", ajax_data, function(data) {
            $(rateHolder).html(data);
        });
        return false;
    }
};
$(document).on("click", ".specsZan", function() {
    $(this).postLike();
});

然后把代码放在想要显示的地方:

<div class="post-like">
    <a href="javascript:;" data-action="ding" data-id="<?php the_ID(); ?>" class="specsZan <?php if(isset($_COOKIE['specs_zan_'.$post->ID])) echo 'done';?>">喜欢 <span class="count"><?php if( get_post_meta($post->ID,'specs_zan',true) ){
        echo get_post_meta($post->ID,'specs_zan',true);
    } else {
        echo '0';
        }?></span>
    </a>
</div>

至于Css样式,自己设计去吧。

WordPress免插件Ajax点赞:等您坐沙发呢!

发表评论

表情
还能输入210个字