给友链添加ICO图标

今天看到有童鞋在弄友链页面,看来友链内页也开始渐渐显示出它的重要性了。

碎碎念建立友链页面有很多个理由,首先,首页空间有限,是无法完全显示你的全部友链的,这就需要寻求一个比较大的容器来盛放这些链接,另外,建立一个专门用于展示你的网络邻居的页面,也是非常友好的一个表现,所以,基于这两点,果断建立了友链页面。

@浅城 之前建立过一个很不错的独立友链页面,可惜后来因为某些原因就丢失了,可惜啦~~(可以参考@氪星人的导航页面)

下面简单说下在内页添加从谷歌读取友链的ico图标:

用script实现,直接添加在友链调用代码之前就可以。

jQuery(document).ready(function($){
$(".lomolink a").each(function(e){
$(this).prepend("<img src=http://www.google.com/s2/favicons?domain="+this.href.replace(/^(http:\/\/[^\/]+).*$/, '$1').replace( 'http://', '' )+" style=float:left;padding:5px;width:16px;>");
});
});

注意对照你的友链结构和本站友链页面结构。
更换第3行 .lomolink a为你的友链链接的属性名称(class 或 id)。ico默认宽度为16px,请自行修改第4行的style=样式。

2013.11.25更新:

由于以上代码调取的是google读取的网站ICO,在国内打开偶尔会出现抽风,大家都不喜欢抽抽,好吧,下面就折腾了DNSPOD调取的ico,专门用于国内高速提取:

jQuery(document).ready(function($){
$(".lomolink a").each(function(e){
$(this).prepend("<img src=https://statics.dnspod.cn/proxy_favicon/_/favicon?domain="+this.href.replace(/^(http:\/\/[^\/]+).*$/, '$1').replace( 'http://', '' )+" style=float:left;padding:5px;width:16px;>");
});
});

特别感谢GSKY浅城提出通过DNSPOD调取ico的建议~!

NOOLDEY

本文作者:NOOLDEY

做一个诗情画意的码农,皮皮猪,我们走!

原文链接: http://zhuweisheng.com.cn/wordpress/addico/

本站文章如无特殊声明均为原创,创作不易,转载请注明来源,谢谢!