江阴论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
积分等级发帖收益的说明江阴论坛帮助汇总江阴论坛管理规则(必看)江阴论坛版主招聘中江阴论坛已运行
查看: 1436|回复: 0

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

[复制链接]
发表于 2009-5-22 09:50:53 | 显示全部楼层 |阅读模式
实现的效果是(我想很多人也是想实现这样的效果):
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
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|江阴人家

GMT+8, 2019-11-15 20:33 , Processed in 0.015979 second(s), 15 queries .

Powered by Discuz! X3.4 Licensed

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表