^ 回到顶部
  • 人生没有定律,每个人都有自己的节奏
  • 本站wordpress建站教程均通过实践后发布,希望对你有帮助,如果有代码出错,请联系站长解决
  • 希望你的坚持,都是因为热爱,而不是因为不甘心
  • 8年wordpress建站经验,5星服务品质
  • 那些不愿意让你吃亏的人,才是真正值得你深交的人,也是值得你付出时间的人
  • 腾讯云3年2核2G新品轻量限时特惠只需408元

修复xiu主题首页cms布局错位

陌小雨自用 xiu 主题首页的 cms 布局是自适应的,不过存在一个问题,如下图:

修复xiu主题首页cms布局错位

2 核 2G 限时特惠 396 元/3 年    宝塔建站 10850 大礼包

即当上一个文章标题太长时,cms 布局会出现错位,今天陌小雨就分享陌小雨是如何修复该 BUG 的,解决思路就是截取文章标题,从 wordpress 大学找到相关教程,功能代码:

 //标题截断
    function cut_str($src_str,$cut_length){$return_str='';$i=0;$n=0;$str_length=strlen($src_str);
    		while (($n<$cut_length) && ($i<=$str_length))
    		{$tmp_str=substr($src_str,$i,1);$ascnum=ord($tmp_str);
    		if ($ascnum>=224){$return_str=$return_str.substr($src_str,$i,3); $i=$i+3; $n=$n+2;}
            elseif ($ascnum>=192){$return_str=$return_str.substr($src_str,$i,2);$i=$i+2;$n=$n+2;}
            elseif ($ascnum>=65 && $ascnum<=90){$return_str=$return_str.substr($src_str,$i,1);$i=$i+1;$n=$n+2;}
            else {$return_str=$return_str.substr($src_str,$i,1);$i=$i+1;$n=$n+1;}
        }
        if ($i<$str_length){$return_str = $return_str . '...';}
        if (get_post_status() == 'private'){ $return_str = $return_str . '(private)';}
        return $return_str;}

在需要输出标题的地方用下面函数调用即可:

<?php echo cut_str($post->post_title,40); ?>

根据你的主题修改截取字数,陌小雨用的是 40。请按需修改。

很惭愧的说,最开始我怎么试怎么试,首页都被我刷新了无数次,都不行,后来才发现原来是我调用位置放错了,放在了title=""这个里面,⊙﹏⊙b 汗

2016 年 4 月 20 日更新:

还有另外两种办法,一是只需要用 css 就可以实现:

.post-title{ 
width:250px; /* 限制宽度(可选) */ 
white-space:nowrap; /* 禁止自动换行 */ 
overflow:hidden; /* 隐藏溢出的内容 */ 
text-overflow:ellipsis; /* 溢出文本使用...代替 */ 
}

其中 post-title 为你的 id 或 class 标题容器

另外一个就是用 WordPress 自带的函数

function customTitle($limit) {
    $title = get_the_title($post->ID);
    if(strlen($title) > $limit) {
        $title = substr($title, 0, $limit) . '...';
    }
 
    echo $title;
}

在需要输出标题的地方用下面函数调用即可:

<?php customTitle(30); ?>

以上 3 种办法可以根据你的代码结构来选取,有的用 css 方便点,有的感觉用函数方便点。

赠人玫瑰,手有余香。