WordPress 用户中心订阅栏目功能的实现——Ajax 免插件方式

网易新闻客户端的启发

作为一个资深的小本本，我相信使用网易新闻客户端看新闻的朋友都会对网易新闻的新闻栏目订阅功能比较熟悉。因此，我觉得通过WordPress实现一个新闻资讯类网站，非常适合采用类似的订阅功能，以方便快捷地订阅自己感兴趣的新闻栏目。

实现订阅功能的相关代码介绍

如果你的网站上的栏目非常多，那么提供一个订阅功能，让用户只订阅自己感兴趣的栏目是非常有必要的。我曾经帮一个客户做WordPress新闻资讯主题的时候实现过这样的功能，抽空整理了一下其中的关键代码，在这里分享给大家。

后台关键代码

/*订阅功能*/
add_action('wp_ajax_skill_exchange','ajax_skill_exchange');
add_action('wp_ajax_nopriv_skill_exchange','ajax_skill_exchange');
function ajax_skill_exchange(){

    $fid=$_POST['fid'];//为ajax提交获取参数

    //获取当前用户id
    $current_user=wp_get_current_user();
    $uid=$current_user->ID;

    //获取当前用户订阅的栏目数组（下称订阅数组）
    $fids=get_user_meta($uid,'fids',true);

    if(count($fids)==0){//如果订阅数组长度为0，说明该用户没有订阅任何栏目。
        $fids=array($fid);
        $msg=array(
            'msg'=>"订阅成功",
            'text'=>"取消订阅"
        );
    }else{//如果不为0，说明用户已经订阅了一些栏目
        if(!in_array($fid,$fids)){//如果当前分类不在订阅数组，添加当前分类到订阅数组，订阅成功。
            array_push($fids,$fid);
            $msg=array(
                'msg'=>"订阅成功",
                'text'=>"取消订阅"
            );
        }else{//如果当前分类在订阅数组中，说明已经订阅过了，从订阅数组中移除此分类id，取消订阅成功
            foreach($fids as $k=>$v){
                if($v==$fid){
                    unset($fids[$k]);
                }
            }
            $msg=array(
                'msg'=>"取消订阅成功",
                'text'=>"订阅栏目"
            );
        }
    }

    //排除空数组
    $following_ids=array_filter($following_ids,function($value){return $value!=='';});
    //最后，更新用户订阅，返回信息。
    update_user_meta($uid,'fids',$fids);
    wp_send_json_success($msg);
}

前台关键代码

前端直接把栏目ID写到HTML里面，方便获取。并根据用户订阅状态，判断按钮上面的文字是订阅还是取消订阅。

<?php$fids=(array)get_user_meta($uid,'fids',true);?>
<?phpforeach($wp_queryas$q){?>
<aclass="exchange"href=""data-id="<?phpecho$q->ID?>"title=""><?phpecho(!in_array($q->ID,$fids))?"订阅":"取消订阅";?></a>
<?php}?>

前端通过Ajax提交需要订阅的栏目ID到后端。

jQuery(document).ready(function($){
    /*订阅和取消订阅*/
    $('.exchange').click(function(){
        event.preventDefault();
        $.ajax({
        method:'POST',
            url:ajax_object.ajaxurl,
            dataType:"json",
            data:{
                action:'skill_exchange',
                fid:$(this).data("id")
            },
            success:function(data){
                if(data.success===true){
                    alert(data.data.msg);
                }
                window.location.reload()
            }}
        );
    });
});

除了订阅栏目，以上代码稍作修改，我们还可以订阅（关注）用户，只需要把上面的分类ID修改为用户ID就可以了。

扫码添加UTHEME微信为好友

· 分享WordPress相关技术文章，主题上新与优惠动态早知道。
· 微信端最大WordPress社群，限时免费入群。