WordPress友情鏈接帶對方網站的 favicon.ico 圖標

編輯：狂族晨曦來源：建站分享，WordPress技巧日期：2015-09-09 閱讀： 3,843 次搶個沙發百度已收錄

最后更新時間：2015-10-10

友情鏈接的重要性，不用我再累述。在建設網站的過程中，我們不斷的與外界交流，進而不斷的增加友鏈。如果你夠耿直，那就會遇到這種情況——首頁的友鏈位置不夠了！這樣我們就需要增加一個單獨的頁面，來容納更多的友鏈。

而在優化的過程中，我們發現，別人很多的網站友鏈頁，都有給別人設置他們的網站圖標，我們要怎么更快、更方便的實現呢？

我們只要實現，自動調用http://友鏈/favicon.ico就可以實現了。也就是說，只要友鏈網站在網站根目錄放置了favicon.ico文件，就可以自動調用了。

下面就來教大家方法了，效果如下：

友鏈情況

方法步驟

1. 上傳一個 16×16 大小的圖片作為木有 favicon.ico 的網站默認 ico，把圖片上傳到所用主題的 images 目錄下，這里示例中默認 ico 圖片是 links_default.gif

2. 復制一份你主題的 page.php，改名為 page-links.php

3. 在 page-links.php 找到文章內容輸出函數 <?php the_content(); ?>，在其下面加入下面的代碼，注意看代碼注釋：

<div class="page-links">
    <h3>頁內鏈接</h3>
    <ul>
        <?php
        $default_ico = get_template_directory_uri().'/images/links_default.gif'; //默認 ico 圖片位置
        $bookmarks = get_bookmarks('title_li=&orderby=rand'); //全部鏈接隨機輸出
        //如果你要輸出某個鏈接分類的鏈接，更改一下get_bookmarks參數即可
        //如要輸出鏈接分類ID為5的鏈接 title_li=&categorize=0&category=5&orderby=rand
        if ( !empty($bookmarks) ) {
            foreach ($bookmarks as $bookmark) {
            echo '<li><img src="', $bookmark->link_url , '/favicon.ico" onerror="javascript:this.src=\'' , $default_ico , '\'" /><a href="' , $bookmark->link_url , '" title="' , $bookmark->link_description , '" target="_blank" >' , $bookmark->link_name , '</a></li>';
            }
        }
        ?>
    </ul>
</div>

4. 為了好看點，你可以給 page-links 這個class定義一下樣式，下面的樣式可以參考一下：

.page-links{overflow:hidden;margin:0 0 24px;padding:0;}
.page-links h3{border-bottom:1px solid #bfbebe;text-align:center;margin:0;}
.page-links ul{margin:0;padding:5px 0 0 0;}
.page-links ul li{float:left;width:150px;line-height:16px;height:16px;margin:5px 5px 0;padding:0;list-style-type:none;}
.page-links ul li:hover{background:#f2f2f2;}
.page-links ul li img{width:16px;height:16px;margin:0 5px -2px 0;padding:0;border:none;}

5. 建立一個頁面，別名（slug）為 links 即可。

快去試試效果吧！若有疑問，歡迎提出！