首页截断+缩略图的解决办法

秋子淡无痕

实现的效果是（我想很多人也是想实现这样的效果）:
1.首页每篇文章可设定字数，整齐的截断
2.首页每篇文章显示一张图片，而文章页不显示该图片

为此有如下几个方案（只想看结果的就可以忽略这部分了^_^）:
1.纯用more标签
也就是我以前的做法，这种最简单，但是很难保证首页每篇文章的字数完全一样。而且内容页中也会出现首页的图片。
2.使用mb_strimwidth()函数
这个函数的作用是将一段文字截取一定的物理长度显示，且它最大的优点是会根据”宽度”来截取文字，全角字符宽度为2，半角字符为1，只要我们将截断的宽度设置为偶数，那最后截断输出的内容一定不会有乱码。有些所谓自动截断的插件也是这个原理。
但是，有个问题就是如果截断的位置正好是html标签，那么就会出现问题，比如侧边拦掉到下面去。所以侧边拦的问题有时并不是因为css，而是因为这个。

综上，解决方法是：mb_strimwidth()函数+自定义域
首先，写文章的时候，插入自定义域如下
名称：imgs（自己起的），值：首页显示的图片地址
然后在主题的index.php中放置图片的地方写代码：

1. <?php if ( get_post_meta($post->ID, 'imgs', true) ) : ?>
   
2. <?php $image = get_post_meta($post->ID, 'imgs', true); ?>
   
3. <a href="<?php echo $image; ?>"><img src="<?php echo $image; ?>"  /></a>
   
4. <?php else: ?>
   
5. <img src="<?php bloginfo('template_directory'); ?>/imgs/title.jpg" />
   
6. <?php endif; ?>

复制代码

其中，title.jpg是放置在主题文件夹下的默认图片，如没有定义图片，就会显示这张。此外，为图片加链接是为了lightbox效果。
然后，把内容部分代码，也就是th_content()或者the_expert()换成如下：

1. <?php echo mb_strimwidth(strip_tags(apply_filters('the_content', $post->post_content)), 0, 140,"......"); ?>

复制代码

其中140是截断的字符数，strip_tags()是去掉html标签。我也想过用strip_tags()的同时排除img标签的做法，但如果内容中有图片，且刚好截断到该图片的时候同样会出现问题。
当然，为了美观，还要为图片定制样式，比如float和边框。

原文地址：http://pejag.cn/blog/limit-post-and-thumbnail.html