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=”……前面添加：

&nbsp&nbsp&nbsp<i class="fa fa-link"></i>&nbsp&nbsp

前面的图标可以自定义，图标网址：http://www.fontawesome.com.cn/faicons/

图标的调用代码：

<i class="fa fa-home" aria-hidden="true"></i>

大家可以修改这个fa fa-home，横杠后面的home来改变自己调用的图标。