最新消息:VPS服务器又从fzhost.net换回Linode了,主题仍用朋友推荐的大前端D8

【已解决】给wordpress中的Retina主题添加文章已阅读次数

WordPress crifan 902浏览 0评论

【已解决】给wordpress中的Retina主题添加文章已阅读次数

【背景】
正在用wordpress中的Retina主题,觉得还不错。
只可惜其不支持文章已阅读次数,所以,很是悲剧。
想要添加对应的文章已阅读次数。最好也同时带有对应的图标显示。

【解决过程】
1.晚上找了一堆,找到一个插件:WP-PostViews
然后去设置->PostView中去设置,在“Views Template”中,设置为尽量和Retina主题匹配的格式:
<span class="views-link"><a href="%POST_URL%" title="%POST_TITLE%">%2$s</a>已有%VIEW_COUNT%人围观</span>
然后在对应的文件post.php中添加对应的函数:

/** Post Views */
function retina_post_views() {
    $output = the_views() ;
 return $output;
}

但是显示出来的效果却不是我想要的,一个是文字内容显示的位置不是在作者之后,而是在最左边的日期的前面显示,还有链接地址失效,没有获得并显示真正帖子的链接地址,而是显示的\%POST_URL\%,
显然对应的PostView脚本中,没有很好的处理对应的变量内容。

2.后来又去世了试了其他种搭配,也还是不行。
比如,“Views Template”中设置为:已有%VIEW_COUNT%人围观,
在post.php中添加对应的函数:

/** Post Views */
function retina_post_views() {
    $viewStr = the_views();
    $output = sprintf( '<span class="views-link"><a href="%1$s">%2$s</a></span>', get_permalink(), $viewStr) ;
 return $output;
}

同时,也要把对应的函数,添加到对应的位置:
在content-single.php中添加对应的函数retina_post_views(),即,将:

echo retina_post_date() . retina_post_author() . retina_post_comments() . retina_post_edit_link();

改为:

echo retina_post_date() . retina_post_author() . retina_post_views() . retina_post_comments() . retina_post_edit_link();

显示内容始终不对,始终只在最左边显示,而不是在期望的作者,评论前面,显示出已有多少人围观。

3.后来才想起来,对于想要让此多少人围观,像一个帖子的作者,评论等内容一样,不仅显示出文字,同时显示出图片和链接,
那对于图片和链接和文字显示位置等信息,属于网页内容的格式化部分,属于css文件所控制的,所以,就又去网页源码中找到了评论内容对应的comments-link,然后在对应的css文件:style.css中,
然后搜到comments-link,紧贴其上,添加对应的内容:

.views-link {
 margin: 0 10px 0 0;
 padding: 0 0 0 16px;
 background: url(images/default/icons/view.png) no-repeat 0px 2px;
}

然后又去images\default\icons中,自己随便以bullet-blue.png为原型,画了个view.png图片。
以使得上述的images/default/icons/view.png的确存在且到时候能显示。
这样,在网页源码中所添加的<span class="views-link">部分的内容,才能得到此处css的格式化,才能在指定位置显示出文字和对应图片。
否则,php函数中直接echo打印出来,就只能显示在一行的最开始了,就出现刚开始所遇到的那个显示问题了。

4.但是,上述内容弄好后,结果还是不行。显示出来的文字,还只是显示在一行的最开始。而那个图片,却的确显示在了作者之后,评论之前的,我所想要的位置。

5.后来就又去折腾,到插件的源码中找相关函数具体是如何实现的。
去wp-content\plugins\wp-postviews\wp-postviews.php中,找了the_views()函数本身的实现,看到其是直接调用函数
$post_views = intval(post_custom('views'));
而获得一个帖子的阅读次数的,所以把这行代码直接拿过来试试看是否可以用:
/** Post Views */
function retina_post_views() {
    $viewCount = intval(post_custom('views'));
    $viewStr = sprintf( '已有%1$s人围观', $viewCount);
    $output = sprintf( '<span class="views-link"><a href="%1$s">%2$s</a></span>', get_permalink(), $viewStr) ;
 return $output;
}
结果发现,是可以用的。
是可以实现,不仅显示出对应的图片,也可以显示出文字和链接的。
而后,也去大概看了下the_views()中的post_custom('views')是如何产生的,发现是add_views_fields中,调用add_post_meta去添加'views'域的,后期每次访问一个帖子,就调用increment_views增加访问次数。
对应的,当在插件配置中选择删除此插件,其会调用对应的delete_views_fields删除对应之前添加的'view'域。

6.后来发现,上述内容只能在单独显示一个帖子的时候才显示阅读次数,而自己想要实现,在进入主页,显示很多帖子的时候,也同时显示文章的已阅读次数,所有就又去折腾,
找到了对应的文件,content.php,在其中也添加对应的那一行代码,将:
echo retina_post_date() . retina_post_author() . retina_post_comments() . retina_post_edit_link();
变为:
echo retina_post_date() . retina_post_author() . retina_post_views() . retina_post_comments() . retina_post_edit_link();
然后也就可以显示已有多少人围观了。

【提示】
此处没有太多考虑其他关于访问权限的事情,比如是非注册用户,注册用户等是否可以看到已阅读次数,
对应的设置,是在插件中设置的。

【实现给wordpress中的Retina主题添加已阅读次数】
下面是总结出来的详细步骤:
(1)将
wp-content/themes/retina/content.php,
wp-content/themes/retina/content-single.php,
wp-content/themes/retina/content-page.php
中的:

    echo retina_post_date() . retina_post_author() . retina_post_comments() . retina_post_edit_link();

改为:

    echo retina_post_date() . retina_post_author() . retina_post_views() . retina_post_comments() . retina_post_edit_link();

(2)在wp-content/themes/retina/lib/structure/post.php中,retina_post_category和retina_post_comments之间,添加对应函数:

/** Post Views */
function retina_post_views() {
    $viewCount = intval(post_custom('views'));
    $viewStr = sprintf( '已有%1$s人围观', $viewCount);
    $output = sprintf( '<span class="views-link"><a href="%1$s">%2$s</a></span>', get_permalink(), $viewStr) ;
    return $output;
}

(3)在wp-content/themes/retina/style.css的.entry-author和.comments-link 之间,添加:

.views-link {
 margin: 0 10px 0 0;
 padding: 0 0 0 16px;
 background: url(images/default/icons/view.png) no-repeat 0px 2px;
}

(4)上传view.png到wp-content/themes/retina/images/default/icons中。
此处附上view.png图片(右键点击另存为即可):

(5)安装WP-PostViews插件,然后进入设置->PostViews中,设置Count Views From为Everyone。

至此,全部搞定。再去访问任意一个页面,刷新一次,就会显示对应的页面浏览次数了。

转载请注明:在路上 » 【已解决】给wordpress中的Retina主题添加文章已阅读次数

发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

网友最新评论 (3)

  1. 求教不知在默认主题Twenty Ten中的何处添加浏览次数的代码?
    astray6年前 (2012-10-25)回复
    • 暂时没研究。等有空研究了之后,才能给你解释。 或者你先说说,到目前为止,你所知道的知识,然后我尽量根据你的情况,看看能否给你提供点思路上的指导,然后你自己折腾折腾,应该也就可以搞定了。
      crifan6年前 (2012-10-25)回复
60 queries in 0.229 seconds, using 12.11MB memory