emlog有个碎语的功能,大概跟微博类似吧,可以杂七杂八地讲一些话。在微博还没有现在那么火的时候,微博的程序也不是很多,所以自己还动手写了一个,现在依然在用着。随着WordPress功能的增强,就有网友通过主题的形式实现了微博的功能。随着微博和轻博客越来越火,WordPress也与时俱进,在3.1版本中坚强而又勇敢地引入了文章形式的功能。
目前支持九种文章格式,来自官方的介绍是这个样子:
日志(aside) - 典型样式就是没有标题。类似于 Facebook 或人人网中更新的一条日志。
相册(gallery) - 图像陈列厅。文章中通常会有“gallery”代码和相应的图像附件。
链接(link) - 链接到其它网站的链接。主题可能会使用文章中的第一个 <a href=""> 标签作为文章的外部链接。有可能有的文章至包含一个 URL,那么这个 URL 将会被使用;同时,文章标题(post_title)将会是附加到它的锚的名称。
图像(image) - 单张图像。文章中的首个 <img /> 标记将会被认为是该图片。另外,如果文章只包含一个 URL 链接,则被认为是该图片的 URL 地址,而文章标题(post_title)将会作为图片的标题属性。
引语(quote) - 引用他人的一段话。通常使用 blockquote 来包裹引用内容。或者,可能直接将引语写入文章,并将其出处写在标题栏。
状态(status) - 简短更新,通常最多 140 个字符。类似于微博 Twitter 状态消息。
视频(video) - 单一视频。文章中第一个 <video /> 或 object 或 embed 将被作为视频处理。或者,文章可以仅包含视频的 URL,甚至一些主题和插件可以支持自动嵌入您的文章附件中的视频。
音频(audio) - 一个音频文件。可以用于播客(podcasting)等。
聊天(chat) - 聊天记录
所以本文要介绍的就是通过使用文章形式的功能,来实现类似于碎语或者微博的功能,当然,使用本文的方法,不用文章形式也可以直接实现的。先看效果:碎语
步骤如下:
1、添加主题支持
在你主题的functions.php中添加如下代码,来告诉WordPress使用何种文章形式,根据需要自己取舍。
1 | add_theme_support( 'post-formats', array( 'aside', 'image', 'link', 'quote', 'status','video')); //增加文章形式 |
那么在后台添加文章的时候,就会出现文章形式的选项了,根据需要选择即可,默认的就是标准类型的。
2、增加一个分类
添加一个文章分类,所有的类似文章都放入这个分类,便于管理。小站添加的分类名是“碎语”,别名是“t”。
那么在添加碎语文章的时候,跟添加普通文章是一样的。只是注意选择一下合适的文章形式,文章分类选择“碎语”。当然文章的内容就相对灵活了,可以是几句话、一个链接、一张图片、一段引用的话语等,当然大部分情况下你可能是没有填写文章标题的,这才能体现碎语/微博的精髓嘛。
3、建立碎语/微博的展示页面
这个展示页面,跟微博的形式类似,可以显示文章内容、发布时间、评论情况等等。对于WordPress来说,使用分类页面来展示是比较合适的了。
(1)将主题的archive.php文件,复制一份,命名为:category-t.php。当然要跟普通的分类页面有所不同了,小站的效果如下:
显示内容:
显示评论:
(2)添加功能代码
使用的主要部分功能代码如下,当然如果需要更像的话,你还可以将评论框放到页面中来,这里不做演示。
category-t.php显示页面,将下面内容替换相应的代码:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <div class="mircoblog" id="post-<?php the_ID();?>"> <div class="top"> < ?php get_post_format_content(); ?> </div> <div class="bottom"> <div class="left"> <span>< ?php the_time(__('G:i','inove')); ?> at < ?php the_time(__('F jS, Y','inove')) ;?></span> <span><a class="title" href="<?php the_permalink() ?>" rel="bookmark"> < ?php _e('Read more...','inove');?></a></span> </div> <div class="right"> <span class="comments">< ?php comments_popup_link(__('Leave a comment','inove'),__('Leave a comment','inove'),__('Leave a comment','inove'),'',__('Comments off','inove'));?></span> < ?php $comments_number=get_comments_number(); if($comments_number>0) {?> <span><a class="icon" onclick="$('#commentslist-<?php the_ID();?>').slideToggle(); return false;" href="javascript:void(0)">< ?php _e('Go to comments','inove');?></a>(< ?php echo $comments_number;?>)</span> < ?php }?> </div> <div class="clear"></div> </div> <ol id="commentslist-<?php the_ID();?>" class="hide commentslist"> < ?php get_custom_comment(10); ?> </ol> </div> |
上面使用了两个函数,PHP代码如下:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | /** * * 获取不同文章形式的内容 */ function get_post_format_content() { $content = get_the_content(); if ( has_post_format( 'aside' )||has_post_format( 'status' )||has_post_format( 'video' )||has_post_format( 'image' )) { echo $content; } elseif ( has_post_format( 'link' )) { $title=get_the_title($post->ID); $linktoend = stristr($content, "http" ); $afterlink = stristr($linktoend, ">"); if ( ! strlen( $afterlink ) == 0 ){ $linkurl = substr($linktoend, 0, -(strlen($afterlink) + 1)); }else{ $linkurl = $linktoend; }; if( $linkurl == '' ){ $linkurl = get_permalink(); } echo "<a href=\"".$linkurl."\">".$title."</a>"; } elseif ( has_post_format( 'quote' )) { echo '<blockquote>'.$content.'</blockquote>'; } else { echo $content; } } //在WordPress每篇文章显示指定数量的评论内容 function get_custom_comment($num=5) { $get_comments_num=$num; //获取最大评论数 $loosky_comments = get_comments('status=approve&type=comment&number='.$get_comments_num.'&post_id='.get_the_ID()); if ( !empty($loosky_comments) ) { $loosky_output=''; foreach ($loosky_comments as $loosky_comment) { $loosky_avatar=get_avatar($loosky_comment->comment_author_email,20); $loosky_output .= '<li>'.$loosky_avatar .'<strong>'.$loosky_comment->comment_author.'</strong> '.$loosky_comment->comment_date .'<p>'.convert_smilies(strip_tags($loosky_comment->comment_content)).'</p></li>'; } echo '<ul>'.$loosky_output.'</ul>'; } } |
PHP代码的写法,有几篇文章仅供大家参考:
- WordPress 文章形式小议:http://immmmm.com/wordpress-post-formats.html
- WordPress 文章形式之: 链接:http://immmmm.com/wordpress-post-format-link.html
- 媒体链接自动嵌入播放器:http://immmmm.com/auto-media-player-urls.html
- WordPress每篇文章显示指定数量的评论者头像及评论内容:http://zww.me/archives/25502
CSS代码如下:
1 2 3 4 5 6 7 8 9 10 | .mircoblog{border:1px solid #DFDFDF;-moz-border-radius:5px 5px 5px 5px;-webkit-border-radius:5px 5px 5px 5px;list-style-type:none;padding:.5em;margin-bottom:.5em;color:#666;} .mircoblog .top{margin-bottom:.5em;font-size:14px;} .mircoblog .bottom{color:#1E5494;} .mircoblog span {padding-right:10px;} .mircoblog span .comments{ float:right} .hidden,.hide { display: none;} .commentslist ul,.commentslist ul li p{margin:3px;padding:0;} .commentslist ul li{list-style:none;line-height:18px;margin-right:5px;} .commentslist ul li img.avatar{width:20px;height:20px;margin:2px;padding:0;border:1px solid #ddd;} .commentslist ul li img.avatar:hover{border-color:#999;} |
到此为止,基本实现碎语的功能了。
(3)内容页面优化
普通的内容页面显示的东西可能比较多,侧边栏、相关文章等,如果碎语/微博页面也使用同样的形式,那么内容可能就被淹没了。所以碎语/微博应使用不同的内容页,更加简洁为好。一个演示:https://loosky.net/?p=2056
优化的步骤如下:
将本来的single.php复制两份,分别命名为:single-s.php(显示标准日志内容)和single-t.php(显示碎语/微博内容)。
将single.php的内容修改为:
1 2 3 4 5 | if ( in_category( 't' ) ) { //如果是碎语/微博分类 get_template_part( 'single', 't' ); } else { get_template_part( 'single', 's' ); } |
再对single-t.php的内容进行相应的精简即可。
4、进行全站优化
(1)首页显示页面
参照category-t.php,可以对index.php(home.php)中的内容进行部分修改,添加不同文章形式的显示CSS,即可达到效果。
可以参考:http://immmmm.com/,http://icold.me/
(2)不在首页显示文章形式的内容
个人觉得碎语这些东西,如果掺杂在首页中进行显示,对于paled这个主题来说,不是很合适,所以需要去掉“碎语”分类在首页中的显示。提供index.php中的代码仅供大家参考:
1 2 | $paged = (get_query_var('paged')) ? (int)get_query_var('paged') : 1; query_posts('cat=-378&paged=' . $paged); //不显示图片类 |
cat=-378,表示不显示分类id为378的分类,反之则为显示。
(3)优化其他方面的显示
碎语/微博类的内容,可能大都没有标题,获取的文章名仅是文章的ID号。在侧边栏等地方,如果显示最新文章,会出现一大堆没有标题的链接或者仅是数字ID的链接,体验不好。
WordPress文章查询常用的调用方式有四种,可参考:https://loosky.net/?p=1578。所以我的解决方案有两种:
(一)使用get_posts函数的时候,可以通过category参数,将相应的分类不予显示。
如:调用最新更新的文章代码如下:
$posts = get_posts("numberposts={$limit}&post_type='post'&orderby=post_date&category=-378"); |
使用query_posts函数的时候,可以通过cat参数对相应的分类不予显示,可参照上面的例子。
使用WP_Query函数的时候,则有cat、category_name、category__and、category__in、category__not_in等参数可供调用,参见官方文档。
(二)通过get_results方法,使用SQL语句直接调用相关内容的,有一种比较简单的方法,即没有标题的文章不予显示即可。
解决方法:
在SQL语句中加上:
AND post_title <> '' |
OK,工程到此结束。
转载请注明:自由的风 » 通过WordPress文章形式实现碎语/微博的功能
好麻烦,与自己目前所用主题有点冲突…
呵呵,是有点麻烦。
555~没嘛没早点看到呢
现在也不迟嘛。
作者你好,请问下 不在首页显示和不在最新文章中显示 碎语 要在哪个文件里面修改啊, 看到了 麻烦你 回我下啊。折腾了一晚上了。
一般在index.php中,但不同的皮肤略有不同。
刚刚在主题下的index.php中找了,没有发现哪里能够修改, 我的主题是inove :http://www.neoease.com/inove/
希望有空的 时候 帮帮我看下。
一般来说,可以放在if (have_posts())之前。
当标题为空时,侧边栏文章标题显示为ID号时 ,AND post_title <> ”这个条件在哪里加(和你用的是同一个主题D8)
你可以看看是使用函数还是widget,在相应的函数里面去修订就好。
不错,我试试看