DDR爱好者之家

详解WordPress中添加友情链接的方法
站长资源 2024/11/27 佚名
2 1538
DDR爱好者之家 Design By 杰米

友情链接对于一个每个独立博客来说可以说是必须的，有不少人选择在侧边栏加入友情链接栏目，但建立一个独立的友情链接页面也是一个不错的选择。用插件可以轻松做到这一点，但喜欢原生的我，能自己动手解决，还是自己动手解决好。折腾了一下，方法就出来了。

普通方法
建立一个友情链接页面的步骤也是比较简单的，先建立一个新的页面模板，用友链函数调用友链，再加上css美化，事情就完成了。

下面说说具体的步骤

1.建立一个新的模板页面
 复制主题中的page.php文件，重命名为links.php。
在页面的顶部加入如下代码

<"htmlcode">



<div class="post-content"><"codetitle">复制代码 代码如下:

<div class="lists"><p class="tips">站点随机排序</p><"htmlcode">



.lists {padding: 5px; margin: 25px auto auto 0;}
.linkcat {font-size: 12px; font-weight: bolder; padding: 5px; margin-bottom: 15px; list-style: none; clear:both}
.lists li h2 {font-size:14px; margin-bottom: 15px; color: #99CC33; }
.listcat ul {margin-left: 20px;}
.linkcat ul li {float: left; margin-bottom: 20px; margin-left: 20px; padding: 4px 0 4px 6px; width: 150px; border: 1px solid #d9d9d9;}
.linkcat ul li a {color: #a4a4a4; text-decoration: none;}
.linkcat ul li a img {margin-right: 3px;}
.linkcat ul li a:visited {color: #a4a4a4;}
.tips {font-size: 14px; margin-bottom: 18px; margin-left: 5px;}






使用jQuery

具体实现步骤分两步：

1.加载jQuery库，可以直接调用google jQuery库




复制代码 代码如下:


<script type="text/javascript" src="/UploadFiles/2021-04-02/jquery.min.js">


2.加载jQuery功能代码，注意jQuery闭合






$(".linkpage a").each(function(e){
$(this).prepend("<img src=http://www.google.com/s2/favicons"+this.href.replace(/^(http:\/\/[^\/]+).*$/, '$1').replace( 'http://', '' )+">");
});





这段jQuery的意思是遍历所有class为linkpage下所有的a标签，然后对该a标签添加img，其中是“.linkpage”需根据自己的模板更改。
DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
ddrfans.com DDR爱好者之家
8,675无损音乐
1,324高清电影
213破解软件
70,141收录资讯

更新日志

友情链接

杰晶网络 DDR爱好者之家 南强小屋 黑松山资源网 白云城资源网
DDR爱好者之家 Design By 杰米