詳解WordPress中添加友情鏈接的方法

友情鏈接對於一個每個獨立博客來說可以說是必須的，有不少人選擇在側邊欄加入友情鏈接欄目，但建立一個獨立的友情鏈接頁面也是一個不錯的選擇。用插件可以輕松做到這一點，但喜歡原生的我，能自己動手解決，還是自己動手解決好。折騰了一下，方法就出來了。

普通方法
建立一個友情鏈接頁面的步驟也是比較簡單的，先建立一個新的頁面模板，用友鏈函數調用友鏈，再加上css美化，事情就完成了。

下面說說具體的步驟

1.建立一個新的模板頁面
 復制主題中的page.php文件，重命名為links.php。
在頁面的頂部加入如下代碼

<?php
/*
Template Name: Links
*/
?>

再把類似下面的一段代碼

<div class="post-content"><?php the_content(); ?></div>

替換為

復制代碼 代碼如下:
<div class="lists"><p class="tips">站點隨機排序</p><?php wp_list_bookmarks('orderby=rand&show_images=1'); ?></div>

替換後把links.php放在主題文件夾根目錄，然後新建一個頁面，在頁面模板中選擇剛建立的“Links”，保存。
解釋一下上面的代碼
my_list_bookmarks是WordPress調用友鏈的函數，orderby是友鏈的排序方式，這裡我寫的是rand，也就是隨機show_images是控制是否顯示友鏈的圖片，布爾型變量，1代表顯示變量，0代表不顯示，其他可選參數如下：
categorize
布爾型，用於設置連接是否按照各自的分類顯示category
字符串型，後面就直接 “=鏈接分類ID號”，那麼就顯示這個分類下的鏈接。如果沒有指定的話就顯示所有的鏈接。
category_name
字符串型，如果後面 “=某個鏈接分類的名稱” 那麼就會在該鏈接分類前顯示分類的名稱，如果這裡留空的話則會顯示所有鏈接分類的分類名稱(即默認的形式)。
category_before
字符串型，位於鏈接分類之前的文字或代碼。
category_after
字符串型，位於鏈接分類之後的文字或代碼。
class
字符串型，每一個鏈接的分類都會有一個 “class” 屬性（從上面的代碼就能看出），默認是：linkcat
category_orderby
字符串型，鏈接分類的排序方式，按照名詞或者ID。
‘name' (默認)
‘id'
category_order
字符串型，鏈接分類的升降序排列方式：
ASC (默認)
DESC
title_li
字符串型，鏈接標題的頭文字或代碼，默認是：Bookmarks，並且它控制連接是否按照列表的方式排列。
title_before 和 title_after
顧名思義，它們就是連接標題頭前後的文字或代碼，默認是 h2 標簽
show_private
布爾型，是否顯示私有鏈接。
include
字符串型，輸出指定 ID 的 Blogroll 的分類鏈接，各個 ID 之間用半角的 “,” 分開。默認顯示所有的 Blogroll 分類。
exclude
字符串型，將指定 ID 的 Blogroll 分類鏈接從整個鏈接列表中排除，各個 ID 之間用半角的 “,” 分開。默認是什麼都不排除。
orderby
字符串型，Blogroll 的排列方式（默認是根據名稱排序，除非將這個值留空），即根據我們在 WP 後台鏈接設置界面下的那些參數來進行排序：
（1）'id'
（2）‘url'
（3）‘name'
（4）‘target'
（5）‘description'
（6）‘owner'
（7）‘rating'
（8）‘updated'
（9）‘rel' – 按設定的關系排列
（10）‘notes'
（11）‘rss'
（12）‘length' – 連接名稱的長度設定
（13）‘rand' – 隨機排列顯示
order
字符串型，設置升降序的排列方式
ASC (默認)
DESC
limit
整型，設置輸出鏈接條數的最大值。默認值是”-1″，輸出全部。
between
字符串型，每個連接、圖片和描述之間的文字或代碼，默認是 “n” 換行。
show_description
布爾型，是否允許顯示每個鏈接的描述。
show_rating
布爾型，是否允許顯示鏈接的等級。
show_updated
布爾型，是否允許顯示最近更新後的時間戳。
hide_invisible
布爾型，是否顯示所有的鏈接，甚至是被管理員設為不可見的鏈接，默認允許顯示。

2.添加css美化，以下是個人的css，供大家參考

.lists {padding: 5px; margin: 25px auto auto 0;}
.linkcat {font-size: 12px; font-weight: bolder; padding: 5px; margin-bottom: 15px; list-style: none; clear:both}
.lists li h2 {font-size:14px; margin-bottom: 15px; color: #99CC33; }
.listcat ul {margin-left: 20px;}
.linkcat ul li {float: left; margin-bottom: 20px; margin-left: 20px; padding: 4px 0 4px 6px; width: 150px; border: 1px solid #d9d9d9;}
.linkcat ul li a {color: #a4a4a4; text-decoration: none;}
.linkcat ul li a img {margin-right: 3px;}
.linkcat ul li a:visited {color: #a4a4a4;}
.tips {font-size: 14px; margin-bottom: 18px; margin-left: 5px;}

使用jQuery
具體實現步驟分兩步：
1.加載jQuery庫，可以直接調用google jQuery庫

復制代碼 代碼如下:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

$(".linkpage a").each(function(e){
$(this).prepend("<img src=http://www.google.com/s2/favicons?domain="+this.href.replace(/^(http:\/\/[^\/]+).*$/, '$1').replace( 'http://', '' )+">");
});