当前时间:Tuesday 2018年10月16日 欢迎访问 夜阑小雨 我的学习碎片档案,这里记录了我的学习内容和工作中经验,希望给您带去帮助。

当前位置: 首页 >> Web前端 >> 正文

如何让WordPress实现文章的自动截断

我们知道,如果用<?php the_excerpt(); ?>可以实现文章的摘要输出,但它不会按一定的字数输出,即我们所说的自动截断。很多人都想实现这个效果,无奈教程很少。比如我,在用WordPress初期,也想尝试这种效果,当然,没成功,因为对WP并不熟悉,再之是不懂得CSS

今天,让我们来说说如何让WP实现文章的自动截断输出吧。不懂PHP/JS,所以,无法从这两个方面实现,但有两种比较简单的,即利用插件和CSS。而我们介绍的也是这两种方法。

  • 利用插件自动截断 Advanced Excerpt

    这个插件需要你调用<?php the_excerpt(); ?>,然后在后台做相应的设置,详情如下图。我在sofish v1.0这个主题用的就是这个插件。

    advanced excerpt

    WP Limit Posts Automatically

    同样是一个非常强大的插件,功能比上一个插件还多,支持按单词(英文,如sofish只认为是一个单词)输入、按字数(中文用户或许应该选择这个,方便控制)、只输出第一段,更详细的设置作者哪里有图示,这里就不贴图了。

    Limit-Post

    这个插件使用应该是比较简单吧。不过,只是用 < ? the_content_limit(1000, “Read more…);?>来调用,当然,”1000″是你所要显示的数字。简单,或许是不错的选择。

  • CSS实现文章自动截断输出

    这个方法第一次是从5key那里得来的。这个方法在Firefox下是不会显示省略号的。具体的方式是:

    div.test{
    width:200px; // 宽度一般会继承上级容器
    height:100px; // 注意设置你的高度
    border:1px solid red;
    border-top:4px solid red;
    padding:10px;
    overflow:hidden; // firefox下隐藏超出部分
    text-overflow:ellipsis; // 显示省略号,FF下只显示截断
    white-space:nowrap; // 强制不换行
    }

我想,如果你不懂怎么用CSS的话,用插件是非常方便的事。如果你懂的CSS的话,用插件也是非常好的选择。我们通常都只是单纯都希望截断,然后忘记了表现形式。最好的方法是将两者结合。比如用这个来控制每篇文章都在同样大小的区域内显示。这对于想做一个CMS型的主题,也是非常棒的方法。

作者:夜阑小雨
原文链接:如何让WordPress实现文章的自动截断
夜阑小雨版权所有,转载本网站文章时请保留此信息。

收藏和分享: 转贴到开心网 转贴到校内网 分享到 Twitter Delicious 分享到 Google Reader 分享到 百度收藏 分享到 QQ收藏

所在分类:Web前端

评论信息

0 条评论 发表评论

发布评论

您必须登录才能发表评论。

网站客户端下载