友情链接怎么横向显示？WordPress首页底部横排友链CSS

原文链接：https://www.chenweiliang.com/cwl-2121.html

文章目录

• 1 添加友情链接代码
• 2 首页底部横排显示友情链接CSS

有个从事外贸网络营销的朋友，并希望将侧小工具栏的友情链接放在首页的底部。

通过这种方式，友情链接中的朋友也可以在手机上查看他们的连接。

陈沩亮在互联网上找到了一些方法，最终找到了完美的解决方案。

对于WordPress网站如何添加链接，你可以在后台搜索Link Manager插件安装测试。

这里我们将讨论如何链接移动到网站首页的底部，首先在主题目录中找到footer.php文件（外观 → 编辑 → footer.php）

注意事项：编辑主题文件之前，请务必做文件备份。

添加友情链接代码

在footer.php上面添加以下代码：

<!--links-bottom-index-->

<div class="span12 home-links">
<div class="widget-box">
<div class="widget-title"><span class="icon"><i class="fa fa-link fa-fw"></i></span><h3>友情链接</h3></div>
<div class="widget-content">
<ul>
<?php wp_list_bookmarks('orderby=id&categorize=0&category=66,192&title_li='); ?>
</ul>
<div class="clear"></div>
</div>
</div>
</div>

<!--end links-bottom-index-->

通常，添加后，它会如常显示，但如果需要调整样式，则需要编辑CSS文件。

首页底部横排显示友情链接CSS

外观>>编辑>> style.css进行css编辑，具体代码如下，

/*首页底部横排显示友情链接CSS*/
.widget-box position:relative;clear:both;margin-bottom:20px;border-top:1px solid #E1E1E1;border-right:1px solid #E1E1E1;border-left:1px solid #E1E1E1;background:none repeat scroll 0 0 #fff;
.widget-title height:40px;border-bottom:1px solid #E1E1E1;background:#F8F8F8;
.widget-content position:relative;z-index:1;padding:10px 15px;border-bottom:1px solid #E1E1E1;

进行上述更改后，代码通常会正常显示，链接管理器友情链接将水平显示。

欢迎转载《友情链接怎么横向显示？WordPress首页底部横排友链CSS》
陈沩亮版权所有，转载请注明出处链接：https://www.chenweiliang.com/cwl-2121.html


网站地址：https://www.chenweiliang.com/



欲学更多秘技，请关注微信公众号：cwlboke