自定义WordPress博客友情链接横向排列

Zblog友情链接 zblog全站友情链接

友情链接作为博客的一项重要内容，一直备受各位博主的关注，对SEO爱好者来说尤其突出。在这个“内容为王，外链为皇”的时代，友情链接非常好的获取外链的有效形式。各方面的好处，把友情链接推向一个必须仰视的高度。但有时这种作用却被放大了，夸张了。

不得言是个俗人。俗人自然有俗人的思想，常为形式所趋。我近期的100余篇的博文中，其中友情链接的相关博文就占了不少比例。如果想了解，可以参考下面内容：

1. 站长你注意了吗？当友情链接遭遇Disallow
2. 交换友情链接，在不得言博客留下脚印
3. 友情链接函数wp_list_bookmarks()全析
4. 让您的WordPress友情链接个性化[首页、内页、全站]
5. WordPress应用：WordPress友情链接高级进阶
6. 深入探讨：友情链接给你带来多少反向链接？
7. 关注Zblog友情链接，给Zblog增全站友情链接

如何让你的友情链接横向排列？

既然想实现横向排列方式，放在博客的底部是最好的选择。从加载顺序的问题上，让博客的内容先被加载，然后是友情链接；从结构布局上，中上部显示博客内容，友情链接放在最次要的底部。这到是一种不错的优化小技巧。——在网络日益速度的今天，难免存在网速慢的朋友，这时就显示出其卓越的功能了。

这里我将使用WordPress 3.0.1的默认主题twentyten作为案例进行介绍。

1. 使用FTP软件，二进制传送方式，备份并下载twentyten主题的footer.php、style.css文件
2. 用Editplus、Dreamweaver或其他编辑工具，在footer.php的第24行加入如下内容，用于放置友情链接。

   <div id="blog-roll">
   <?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('west_sidebar') ) :
   	wp_list_bookmarks('category_before=&category_after=&categorize=1');
   endif; ?>
   </div><!-- #blog-roll -->
   

3. 用Editplus、Dreamweaver或其他编辑工具，在style.css底部加入如下CSS代码，定义blog-roll样式。

   #blog-roll {
   	width: 908px;
   	padding:15px;
   	background:#f6f6f6;
   	border:1px solid #cccccc;
   	margin:0 auto;
   }
   #blog-roll  h2 {
   	width:100px;
   	line-height:30px;
   	font-size:16px;
   }
   #blog-roll  ul {
   	float:left;
   	margin:0px;
   }
   #blog-roll  li {
   	list-style:none;
   	width:128px;
   	margin:0px 10px 10px 10px;
   	background:#f3f3f3;
   	float:left;
   }