- 加入我的QQ群
- 关注我的百家号
扫描下面的二维码,“关注”我的百家号。
上一章我们为wordpress主题的用户中心author.php添加了静态代码布局,实现了前台页面的布局展现效果。现在,我们就要为它们调用后台数据:调用当前页面的作者信息、关注和粉丝、以及文章总浏览量等,修改a标签的链接,让它指向对应的页面。
第一步:为用户添加几个自定义字段:
从上一章我们实现的前台页面效果中我们可以看到,有以下几个字段:积分、关注、粉丝、文章总浏览量、个人网站地址、加入时间(注册时间)、最近登录时间。我们先为用户添加以上几个字段,以供后期之用。在wordpress主题的functions.php添加如下代码:
//自定义用户个人资料信息
add_filter( 'user_contactmethods', 'wpdaxue_add_contact_fields' );
function wpdaxue_add_contact_fields( $contactmethods ) {
$contactmethods['user_site'] = '人个网站';
$contactmethods['user_fanc'] = '粉丝'; //粉丝,记下关注者的ID
$contactmethods['user_follow'] = '关注别人'; //关注别人,记下被关注者的ID
$contactmethods['user_jifen'] = '积分';
$contactmethods['user_views'] = '总浏览量';
return $contactmethods;
}
第二步:修改上图第1部分代码:
因为是作者用户中心页面,所以我们要调用当前作者的头像和用户名。并且,如查当前登录用户与作者是同一人时,就显示“写博客”和“帐号设置”按钮,否则,就显示“关注”按钮。
修改后的代码如下:
<ul class="author_set"><li class="title"><a href="<?php echo get_bloginfo('url'); ?>/?author=<?php echo $uid; ?>"><?php echo get_avatar( $uid ); //获取作者头像 ?><span><?php echo get_user_meta($uid,'nickname')[0]; //用户呢称作为博客名 ?></span></a></li><li class="write"><?phpif($current_user->ID==$uid){ //如果作者 与 当前登录用户是同一人,echo '<a href="'.get_bloginfo("url").'/?author='.$uid.'&act=author_write">写博客</a>';echo '<a href="'.get_bloginfo("url").'/?author='.$uid.'&act=user_edit">帐号设置</a>';}else{//如果已关注作者,就显示“已关注”,如果没有关注作者,就显示“关注”$user_follow = get_user_meta($current_user->ID,'user_follow');$arr = explode(',',$user_follow[0]);if(!in_array($uid,$arr)){echo '<a href="javascript:;" id="'.$uid.'" class="guan_zu guan_zu_'.$uid.'">关注</a>';}else{echo '<a href="javascript:;" id="'.$uid.'" class="quxiao quxiao_'.$uid.'">已关注</a>';}}?></li></ul>
第三步:修改上图第2部分:
我们要调用后台的积分数据、关注数据、粉丝数据,以及发表了多少篇文章。代码如下:
<ul class="author_fanc"><li class="jifen_list"><a href="<?php echo get_bloginfo("url"); ?>/author_jifen"><span><?php//注册积分echo get_jefen($uid) ;?></span><span>积分</span></a></li><li id="<?php echo $uid; ?>" class="guanzu_list"><a href="<?php echo get_bloginfo("url"); ?>/?author=<?php echo $uid;?>&act=guanzu"><span><?php echo get_guanzu($uid); ?></span><span>关注</span></a></li><li id="<?php echo $uid; ?>" class="fanc_list"><a href="<?php echo get_bloginfo("url"); ?>/?author=<?php echo $uid;?>&act=fanc"><span><?php echo get_fanc($uid); ?></span><span>粉丝</span></a></li><li class="wenzang_list"><a href="<?php echo get_bloginfo("url"); ?>/?author=<?php echo $uid;?>&act=list"><span><?php echo get_the_author_posts(); //作者文章总数 ?></span><span>文章</span></a></li></ul>
上面调用积分、关注、粉丝时用到了自定义函数,所以我们要在functions.php中添加这几个函数:
//获取作者关注 的数
function get_guanzu($uid){
$author_follow = get_user_meta($uid,'user_follow'); //关注
if(empty($author_follow)){
$num1 = 0;
}else{
if($author_follow[0]==''){
$num1 = 0;
}else{
$follows = explode(",",$author_follow[0]);
$num1 = !empty($follows) ? count($follows) : 0;
}
}
return $num1;
}//获取作者粉丝数
function get_fanc($uid){
$author_follow = get_user_meta($uid,'user_fanc'); //关注
if(empty($author_follow)){
$num1 = 0;
}else{
if($author_follow[0]==''){
$num1 = 0;
}else{
$follows = explode(",",$author_follow[0]);
$num1 = !empty($follows) ? count($follows) : 0;
}
}
return $num1;
}//获取作者积分
function get_jefen($uid){
$user_jifen = get_user_meta($uid,'user_jifen');
if(empty($user_jifen)){
$num = 0;
}else{
$num = ($user_jifen[0]=='') ? 0 : $user_jifen[0];
}
return $num;
}
第四步:修改上图第3部分:
因为要调用文章总浏览量,所以我们先在wordpress主题的functions.php文件中添加获取总浏览量的函数:
//获取作者文章总浏览量
function get_post_views($uid){
$user_views = get_user_meta($uid,'user_views');
if(empty($user_views)){
$num = 0;
}else{
$num = ($user_views[0]=='') ? 0 : $user_views[0];
}
return $num;
}
因为要获取用户最后登录时间,所以,我们要为用户添加最后登录时间字段,同样,在functions.php文件中添加如下:
//在用户登录时,创建一个新字段存储用户登录时间
function insert_last_login( $login ) {
global $user_id;
date_default_timezone_set(PRC);// 纠正8小时时差
$user = get_userdatabylogin( $login );
update_user_meta( $user->ID, 'last_login', date('Y-m-d H:i:s') );
}
add_action( 'wp_login', 'insert_last_login' );
再来修改上图第3部分的代码,如下:
第五步:修改上图第4部分:
第4部分是网站最新文章,代码如下:
<!-- 最新文章 --><div class="new_post"><?phpecho '<h2>最新文章</h2>';query_posts('posts_per_page=10&orderby=new&ignore_sticky_posts=1');while(have_posts()):the_post();echo '<li><a href="'.get_permalink().'" title="'.$post->post_title.'">'.$post->post_title.'</a></li>';endwhile;wp_reset_query();?></div>
第六步:修改上图第5部分:
上图第5部分,也就是author.php用户中心的右侧主体。默认情况下显示的是用户发表的文章列表,修改后的代码如下:
<!-- 当前用户发表的文章列表 --><div class="post_list"><?phpif(have_posts()): while(have_posts()):the_post();echo '<div class="post">';echo '<h2><a class="title" href="'.get_permalink().'">'.$post->post_title.'</a></h2>';echo '<div class="intro">'.mb_substr(strip_tags($post->post_content),0,150).'......</div>';echo '<div class="info">';echo '<span class="tags">'; the_tags('标签:', ', ', ''); echo '</span>';echo '</div>';echo '<div class="info">';echo '<span class="tags">'; the_category(); echo '</span>';echo '<span class="eye">'; post_views(' ', ''); echo '</span>';echo '<span class="pinglun">'.$post->comment_count.'</span>';//当前登录用户是作者本人时,打开编辑if($current_user->ID==$curauth->ID){echo '<a href="'.get_bloginfo("url").'/?author='.$current_user->ID.'&act=author_edit&pid='.$post->ID.'">编辑</a>';}echo '</div>';echo '</div>';endwhile;else:echo '<div class="post">目前还没有发表文章。</div>';endif;wp_reset_query();?></div>
通过上面的几步骤,我们对wordpress主题用户中心主页面author.php进行了改造:修改a标签链接到对应的页面、调用后台数据展现作者的积分、关注数、粉丝数、发表的文章数、总浏览量以及用户发表的文章列表和网站的最新文章。嗯,今天就写到这里。谢谢参阅。
你好,关于第五部分中的第14行:
echo ”; post_views(‘ ‘, ”); echo ”;
当开发者没有安装WP-PostViews 插件时,会报错。
很有用,刚好在学angular,谢谢!
很有用,正在学习angular,谢谢!