背景
由于wordpress主题的多样性,所以部分主题上没有直接添加友情链接的地方,wordpress上虽然有插件但是因为我的博客机器性能一般,插件安装过多加载就会变慢很多,就想到了利用wordpress小工具来解决这个问题。
实施步骤
1:准备
打开后台——外观——自定义——小工具——自定义HTML
2:添加HTML代码
<ul style="padding: 12px 13px 10px 0px;" class="wailian">
<li><a href="http://2life.top" target="_blank">2life爱生活</a></li>
<li><a href="http://www.google.com" target="_blank">谷歌</a></li>
</ul>
现在就已经可以了,但是为了让链接更加美观所以我们可以尝试添加一下css
3:添加额外的css美化
在自定义页面直接点击——额外css复制粘贴下面的代码就行了
/******* 友情链接 css 控制 ******/
.wailian li{ float:left}
.wailian li a {
background: #FAFAFA;
border: 1px solid #e9e9e9;
display: block;
text-align: center;
margin-left: 15px;
margin-bottom: 5px;
padding: 0 4px;
border-radius: 2px;
width:120px;
color: #5e5e5e;
line-height: 30px;
white-space:nowrap;
overflow:hidden;
}
.wailian li a:hover {
color: #fff;
background: #428BCA;
}
具体效果可以参照本站友链