YAOHAIXIAO.COM

HTML(5),CSS(3),JavaScript,DOM,Ajax,JSON,Front-end technologies & Yaohaixiao

热门标签:JavaScript Performance 前端开发 前端性能优化 原创

Rss

Home » WordPress » WordPress 非插件方式实现列表页显示摘要

WordPress 非插件方式实现列表页显示摘要

用过 WordPress 的朋友都知道,WordPress 自带的主题 Twenty Eleven 默认的首页显示的是全文,而并非我们常见的摘要。显示全文虽然让首页的内容很丰富,但是页面往往过于长了,用户浏览器起来不方便。今天我就结合我写 BlueNight 主题的经验,介绍一下如何实现首页显示制定字符数量的摘要。例如我的博客的样子:

怎么样?是不是比显示全文看上去要清爽一些,也跟方便读者浏览博客。本文我就拿 Twenty Eleven 主题为例子讲解如何修改显示摘要。在 Twenty Eleven 的 index.php 文件中我们可以找到如下代码:

<?php while ( have_posts() ) : the_post(); ?>
    <?php get_template_part( 'content', get_post_format() ); ?>
<?php endwhile; ?>

从这里我们可以看到 Twenty Eleven 是嵌套一个 content.php 的文件用于专门显示文章的内容。好了,那么我们打开 content.php 文件看看吧:

<?php if (is_search()): // Only display Excerpts for Search ?>
<div class="entry-summary">
    <?php the_excerpt(); ?>
</div>
<!-- .entry-summary -->
<?php else : ?>
<div class="entry-content">
    <?php the_content(__('Continue reading <span class="meta-nav">→</span>', 'twentyeleven')); ?>
    <?php wp_link_pages(array('before'=>'<div class="page-link"><span>'.__('Pages:', 'twentyeleven').'</span>', 'after'=>'</div>')); ?>
</div>
<!-- .entry-content -->
<?php endif; ?>

由这段代码我们可以清楚的看到,WordPress 默认的普通列表也是显示全文,只有在搜索页的结果才会显示摘要。

the_excerpt() 函数简介

那上文提到了在搜索列表也会显示摘要,那么我们是不是把其余的列表也的结果也使用 the_excerpt() 函数处理就搞定了?很抱歉,这样做往往还是显示全文。因为 The_excerpt() 主要是针对英文中处理的,默认是截取55个英文单词的,但是在中文中却是无法截取到55个汉字。原因是因为在 WordPressthe_excerpt() 函数中用到了

$text = implode(' ', $words);

PHP 中是用空格来截取字数的,而我们汉字就杯具了,因为我们汉字是相连的,没有空格来区分,所以在使用中文的时候,经常地我们使用 the_excerpt() 函数的时候,截取出来的结果是全文!

重写 excerpt_length()

上面介绍了,the_excerpt() 自带的截取的字符是截取英文单词的长度,而对于中文是不适用的。因此我们不能使用单词数的截取方法了,这时我们需要通过截取字符长度的方式来获得摘要的字数了。而这就需要通过修改 WordPressexcerpt_length() 方法了。看看我的主题是怎么处理的吧:

function my_excerpt_length($length) {
    return 170; 
}
add_filter('excerpt_length', 'my_excerpt_length');

通过 WordPress 提供的 add_filter() 函数来重写 excerpt_length() 方法,指定截取摘要的字符窜长度(例子中的为170个字符)。对了,实现摘要的操作就这么简单,你只需要在 function.php 文件中加上上面的这段代码,然后将 content.php 的代码调整成:

// 现在的处理是所有的列表页面都显示文章摘要了
<div class="entry-summary">
    <?php the_excerpt(); ?>
</div>

重写 excerpt_more()

完成了字符窜的截取,我们还需要处理的一个细节就是紧接在摘要后面的“阅读全文”的链接。WordPress 自带的当然是英文的说明,我们可以通过重写 excerpt_more() 函数来更精确的控制摘要的显示结果。

// 添加到 function.php 文件中就 OK 了
function new_excerpt_more($more) {
       global $post;
	return '... [阅读全文]';
}
add_filter('excerpt_more', 'new_excerpt_more');

excerpt_more() 和 excerpt_length() 这两个函数都是在执行 the_excerpt() 函数式自动会调用到的。所以我们就不用再做多余的操作了。只要花点时间看看 API,是完全没有必要用插件来实现摘要显示的。好了,到这里如何修改摘要显示就介绍完了,希望能够对大家有所帮助。

WordPress 相关 API

声明:本文采用BY-NC-SA协议进行授权。转载请注明转自:WordPress 非插件方式实现列表页显示摘要

« »

2 条评论

  • ”重写 excerpt_length()“是在哪个文件里啊

发表评论

电子邮件地址不会被公开。 必填项已用*标注

您可以使用这些HTML标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(Spamcheck Enabled)