在我们设计主题或是二次开发主题的时候，为了外观的美观，我们玩玩要考虑长标题对元素带来的影响，比如长标题能导致宽度或是高度溢出。特别是在当下流行的网格设计和瀑布流设计时。这时候我们就需要对标题进行修饰或是摘断。下面我们看看几种常见的摘断方法。
1、不用修改代码的hook方法。
本代码是通过hook自定义the_title() or get_the_title()，通过本代码你无需修改你主题各个调用文章标题的具体代码，您只需要把下面的代码放置在您的主题的funtions.php里面即可。
function ietheme_shorten_title( $title ) {
$newTitle = substr( $title, 0, 20 ); // Only take the first 20 characters
return $newTitle . " …"; // Append the elipsis to the text (...)
}
add_filter( 'the_title', 'ietheme_shorten_title', 10, 1 );2、直接修改标题调用，这里就是把下面的代码替换原来的获取标题代码。使用的是wordpress官方提供的函数，简单方便。
<?php
echo mb_strimwidth( get_the_title(), 0, 100, '...' );
?>3、css摘断，这是本方法最好的摘断方式，这样既不影响标题完整性，还一样的做到美观。重要的是完整的标题更有利于SEO
/*one line*/.card-title {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}/*two or n line*/.card-title {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;/*line number*/ -webkit-box-orient: vertical;
}综上，为了SEO，我们推荐第三种方法，它既有前面两种的效果，而不会强制摘断标题。具体可以看本站的首页网格元素和本文末尾的相关文章章节。
本文已在Ie主题由99839发布
文章来源：https://ietheme.com/excerpt-length-for-title.html
