「自学哈网」wordpress主题修改 网站相关推荐改为两列显示
也想出现在这里?
联系我们吧
一、修改main.css文件:
1、在main文件中搜索“.relates ul”然后添加“overflow: hidden;”修改完的代码如下:
.relates ul{ list-style: disc; margin-left: 18px; color: #bbb; margin-bottom: 30px; overflow: hidden; }
2、在main文件底部添加:
/*相关文章推荐使用双栏(修改版)*/ .relates ul li { width: 50%; float: left; word-break: break-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .relates ul {margin-bottom: 18px;} /*此处大家自行调整一下,我设置的相关文章数是8,这里设置的18px刚好合适*/ .title {clear: left;}
二、修改mo_posts_related.php添加美观图标:
1、在文件中搜索“<a href=”‘.get_permalink().’”>’.get_the_title().get_the_subtitle().\'</a>”注意,这个代码有两处,分别在30行左右和40行左右。
2、两处均在”<a href=”……前面添加:
   <i class=\"fa fa-link\"></i>  
前面的图标可以自定义,图标网址:http://www.fontawesome.com.cn/faicons/
图标的调用代码:
<i class=\"fa fa-home\" aria-hidden=\"true\"></i>
大家可以修改这个fa fa-home,横杠后面的home来改变自己调用的图标。
本站声明:
本站所有资源来源于网络,分享目的仅供大家学习和交流!如若本站内容侵犯了原著者的合法权益,可联系邮箱976157886@qq.com进行删除。
自学哈专注于免费提供最新的分享知识、网络教程、网络技术的资源分享平台,好资源不私藏,大家一起分享!
自学哈网 » 「自学哈网」wordpress主题修改 网站相关推荐改为两列显示
本站所有资源来源于网络,分享目的仅供大家学习和交流!如若本站内容侵犯了原著者的合法权益,可联系邮箱976157886@qq.com进行删除。
自学哈专注于免费提供最新的分享知识、网络教程、网络技术的资源分享平台,好资源不私藏,大家一起分享!
自学哈网 » 「自学哈网」wordpress主题修改 网站相关推荐改为两列显示
也想出现在这里?
联系我们吧