显示评论者、友情链接 favicon 的新方法

Wizard显示评论者 Gravatar 头像、网站 favicon 是老肥博客一贯的做法,得到过不少朋友的称赞。favicon 的显示调用是我 自己摸索 的,实际运用起来问题比较多,比如:没有 favicon, favicon.ico 不在根目录,尺寸太大,或者评论者留下的是 www.awflasher.com/blog 这样的带有小尾巴的地址,都会导致显示错误。

前两天 Shawn 提示我 Google 有一个隐藏的 favicon 缓存服务可以完美解决这个问题,果然非常棒,现在分享给大家。这个缓存调用的地址是:

https://www.google.com/s2/favicons?domain=fis.io

简单吧?这个查询得到的是一个 png 图像,如果没有对应的 favicon, 则缺省是一个地球图标。WordPress 插件 Favicon Images for Comments 是最简单的用法,不过样式反正要自己改,喜欢动手的朋友、非 WordPress 的朋友请看下面的教程。

这个查询要求不能带有 http, 而域名后面无论跟什么都无所谓。所以首先要把评论者网址前的 http 过滤掉,例如 中文 WordPress 工具箱,在显示最新评论的循环语句 foreach ($comments as $comment) 下面添加一个 $domain 定义:

$domain = preg_replace('/^http:///', '', $comment->comment_author_url);

得到的 $domain 就没有前面的 http 了。然后把它用到输出去:

$output .= $before . '<img src="https://www.google.com/s2/favicons?domain=' . $domain . '" class="favicon" /><a href="' . $permalink . '" title="' . $comment_excerpt . '">' . $comment_author . '</a> ' . $comment_excerpt . $after;

这是我的例子,提供一个参考。我发现这样写还是很难看懂……呵呵,就当个参考吧。我把我的侧栏最新评论、本周嘉宾、友情链接都改成了这个显示方式,欢迎参观 😀

最后,希望有博客的朋友都检查一下自己的根目录下是否有 favicon.ico 这个文件,yo2 用户好像也可以通过一个专用插件来上传它。这样您的博客可以在这里得到丰富的展示,happy blogging!

据博友 冰古 的测试,Google 的 favicon 缓存服务并不是直接获取根目录下的 favicon.ico, 而是需要 html header 里面含有:

<link rel=”shortcut icon” type=”image/x-icon” href=”/favicon.ico” />

如果图标不对,一定要检查一下这里。谢谢冰古!

最新评论

  • fisio 可不,Google Reader 都去世十年了… Google Reader 的分享和效率
  • 轻重 天哪!今天整理Evernote,发现这条2010年的剪藏笔记,点击连接,原网站还在!12年了,中文互联网早已面目全非! Google Reader 的分享和效率
  • 小波 重新改博客,看看以前的wp小伙伴的博客,发现绝大部分都关了,没想到你的还在,只是停在11年了 我为什么爱 Twitter
  • 心灵博客 当年有这个效果已经很不错哦 diy 山寨投影家庭影院
  • fisio 可不咋地!您也是老司机了 我为什么爱 Twitter

发表您的评论

评论将回复给

😀🙂😯😁🙁😄😆😝😜👍🌈💖🎂

目前有 75 条评论

    1. 这个还好,一般来说,google.com 能保证访问,图标也都统一过格式了

      比以前我直接读取对方 ico 文件的做法其实好很多,直接读取如果遇到文件不存在,有时候会卡很久……

    1. 大哥,你自己的域名都写错了……嗯

      我说呢,我点了一下还以为你当机了呢,哈哈,帮你改了一下

    1. 在右侧栏显示评论者 favicon… 以前的显示方式是直接读取对方的 /favicon.ico, 现在是用 Google 的缓存

    1. 我用这个几天了,还是发现了些问题,缓存有时候会错乱,显示成别人的 favicon… 不知道是不是我一人的问题

      1. 貌似我找到原因了,因为我的页面中没有添加这个标签,看了几个“地球”的,都是没有加上的,而不是“地球”的就都有这个标签。

        添加上了,等待谷歌的更新。

        1. header 里面的这句对吧?

          <link rel=”shortcut icon” type=”image/x-icon” href=”/favicon.ico” />

          呵呵,我测试了几个朋友的博客,的确如此,Google并不是找根目录下的 favicon.ico, 而是找这句定义。呵呵,谢谢提醒 😀




还有 1 条 pingbacks 从其它网站引用了本文