当前位置:首页 > WordPress代码·功能电脑·技巧 > 正文

为你的友情链接添加一个ico图标 ico图标接口+WordPress内设链接引用+引用链接简单设置代码

20141221171726

 

 

以前一直在使用别人的 ico接口可是最近却坏了,想了想自己动手丰衣足食 那么自己弄个ico获取的php不就好了!

然后这个功能就于2014-12-21 正式诞生!ico获取已有再也不用依赖于别人了!

这个ico的接口放在了本站,速度可能有一点慢,改天会把他设置一下在七牛缓存图标让速度更快一点!

获取ico图标的接口 http://ihuan.me/ico/?url=ihuan.me   可以将ihuan.me 替换为你想要的域名 不加http 即可获取图标

当然加了也是无所谓的啦 一样可以获取到

当然有些人的ico设置的超大,甚至到了500x500的超大尺寸 一般16x16 在显示栏刚刚好

所以可以在插入图片是设置一下高度

<img src=”http://ihuan.me/ico/?url=指定的域名即可” width=”16″ height=”16″ />

你可以将http://ihuan.me/ico/?url=ihuan.me 接口加入到图片描述中!

或者你可以将你在链接中设置的可显示 链接引用
引用代码 加入到页面中即可

<div class="Flinks">
<ul><?php wp_list_bookmarks('orderby=id&category_orderby=id'); ?></ul>
</div>
如果你在css中还加入了我们的css 则可以将链接想图片中那样显示排列
 css代码
 /*友链css代码*/
 .Flinks ul ul, .linkstandard ul{line-height:24px;margin-left:10px;}
 .linkstandard ul li{list-style-type:none;}
 .Flinks ul li{list-style-type:circle;}
 .Flinks ul li h2, .linkstandard h2{clear:both;color:#f00;;font-weight:bold}
 .Flinks ul ul li{float:left;height:28px;overflow:hidden;text-align:center;}
 .Flinks ul ul li a{font-weight:normal;color:#222;background:#FAFAFA;text-decoration:none;padding:0px;float:left;width:140px;height:22px;text-indent:-16px;border:1px
 #ddd solid;-moz-box-shadow:0px 1px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow:0px 1px 1px rgba(0, 0, 0, 0.1); box-shadow:0px 1px 1px rgba(0, 0, 0, 0.1);border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-khtml-border-radius:5px;overflow:hidden;}
 .Flinks ul ul li a:hover{font-weight:normal;color:#67A611;border:1px solid #999;background:transparent;-webkit-box-shadow:0px 1px 1px rgba(0, 0, 0, 0.1); box-shadow:0px 1px 1px rgba(0, 0, 0, 0.1);border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-khtml-border-radius:5px;-webkit-animation:'ggShow' 1s alternate infinite;}

如果你是使用的这个 那么在最后再加上个ico图标就更完美了!
还制作了个专门的 js 所以只要复制进去 你连图标描述都不用设置即可显示出来

js代码

<script type="text/javascript">
jQuery(document).ready(function($){
$(".Flinks ul ul li a").each(function(e){
$(this).prepend("<img src=http://ihuan.me/ico/?url="+this.href.replace(/^(http:\/\/[^\/]+).*$/, '$1').replace( 'http://', '' )+" style=padding-left:10px;padding-top:3px;float:left;height:16px;width:16px;></img>");
});
});
</script>

以上东东全部加入到 你的页面中去! 复制时注意,有可能由于代码特殊性 你复制过去的代码可能被转化 复制时注意下

标签:
上一篇: 下一篇:

18 条评论

评论加载中...
  1. 实用的技术

    2015年8月26日 13:06 评论
  2. 比较流逼

    2015年1月30日 19:11 评论
  3. 5楼
    来自天朝的朋友 未知浏览器 Unknow Os
    梦想网络  

    wp_list_bookmarks函数确实很实用。

    2015年1月9日 16:44 评论
  4. 4楼
    来自天朝的朋友 未知浏览器 Unknow Os
    苏黎  

    这个不错哦

    2014年12月30日 17:09 评论
  5. 地板
    来自天朝的朋友 未知浏览器 Unknow Os
    松果  

    不得行耶!有的ico加载不了

    2014年12月28日 21:08 评论
  6. 板凳
    来自天朝的朋友 未知浏览器 Unknow Os
    qkwu  

    这个也不错

    2014年12月23日 13:05 评论
  7. 沙发
    来自天朝的朋友 未知浏览器 Unknow Os
    十束先生  

    请问下博主QQ多少我有几个问题想请教。

    2014年12月22日 20:49 评论

发表评论

不理你。不要啊!吃饭。吃惊。吃西瓜。飞吻!恭喜!Hi纠结!膜拜!OK抛媚眼。泡泡糖。抛钱。忍!生闷气!调皮。偷看。委屈。献花。疑问?抓狂!

小提示:Ctrl+Enter快速提交助您一臂之力~
加载中……