获取 Favicon 服务美化友情链接

发布于：电脑网络, 精品推荐, 转来载去 1,304 次践踏

之前写过一篇《个性化 WordPress 友情链接页面》，主要是用 CSS 美化了友情链接页面，如今在这个基础上，我又对友情链接页面进行了改进。效果可以见我的友情链接页面。你可以看到，在每个友情链接之前都有一个对应的 Favicon 小图标，很有个性吧。在公布这个效果的实现方法之前，先要感谢一下Bronco童鞋，是他给我留言建议我使用这个效果，并提供了方法。

基本的设计思想是：获得每个链接的地址，提取出域名部分，提交给 Google，Google 返回的就是一个16×16的 PNG 图片，对于没有被 Google 缓存 Favicon 的网站，会得到一个小地球的图标，就像这样Example

获取图标的网址为：http://www.google.com/s2/favicons?domain=example.com，将 example.com 换成需要的域名就OK啦~至于获取链接中的域名，可以用正则表达式来实现。

另外，大多数模板对于链接页面的实现都是通过调用WP的系统函数 wp_list_bookmarks 来完成的，而为了完成自动获取 Favicon 需要改动函数。为了保证将来升级 WordPress 本功能依然有效，故将 wp_list_bookmarks 以及相关的 _walk_bookmarks 复制到主题的 function.php 中，作为主题函数来使用。

以 WordPress 2.7.1 为基础进行修改，其他版本请参考修改。

1、打开 wp-include 目录下的 bookmark-template.php 文件，将其中的两个函数复制出来，放到一个新的文件中，原文件关闭，修改在新文件中进行。

2、编辑 _walk_bookmarks 函数，找到第103行，将如下的内容：

if ( $bookmark->link_image != null && $show_images ) {
    if ( strpos($bookmark->link_image, 'http') === 0 )
        $output .= "<img src="$bookmark->link_image" $alt $title />";
    else // If it's a relative path
        $output .= "<img src="" . get_option('siteurl') . "$bookmark->link_image" $alt $title />";

    if ( $show_name )
        $output .= " $name";
} else {
    $output .= $name;
}

替换为：

if ( $show_images ) {
    if ( $bookmark->link_image != null) {
        if ( strpos($bookmark->link_image, 'http') !== false )
            $output .= "<img src="$bookmark->link_image" $alt $title />";
        else // If it's a relative path
            $output .= "<img src="" . get_option('siteurl') . "$bookmark->link_image" $alt $title />";
    } else {//否则显示网站的Favicon
        if (preg_match('/^(https?://)?([^/]+)/i',$the_link,$URI)) {//提取域名
            $domains = $URI[2];
        }else{//域名提取失败，显示默认小地球
            $domains = "example.com";
        }
        $output .= "<img src="http://www.google.com/s2/favicons?domain=$domains" $alt $title />";
    }
}

替换完成后将 _walk_bookmarks 改名，例如 my_bookmarks

3、编辑 wp_list_bookmarks 函数，将其中所有的 "_walk_bookmarks" 替换为新函数 "my_bookmarks"。三次替换，分别在228行、239行和242行左右。

4、将 wp_list_bookmarks 改名，比如 my_list_bookmarks。

5、检查一下代码，确保替换无误并且没有误删任何字符后，将两个函数复制到主题目录下的 function.php 文件中，原来的注释可以删掉。Bronco童鞋还 Email 给我修改好的 function.php（点击下载 1.76K），我就借花献佛拿出来共享下，将 function.php 中的代码复制到主题下 function.php 中即可。这样，自动获取favicon的功能就完成了。

现在，可以通过<?php my_list_bookmarks(show_images=1) ?>来生成链接列表了。当然，也可以修改主题的友情链接页面模板文件，找到 wp_list_bookmarks(…)，替换为上述第二个函数，即 my_list_bookmarks。注意，需要在参数中增加一项"show_images=1"。以此模板创建一个页面，就可以看到效果。

最后，可能需要对 CSS 进行一下加工，以保证 img 能显示在对应位置上。

Bronco原创：http://heybronco.net/tech/wordpress/get-favicon-automatically/