昨天换了个主题,发现尽然没有友情链接页面,内页也没有,于是就折腾了下
具体实现的步骤和方法如下:
1.复制一份你主题的 page.php,改名为 page-links.php(或者你自己起).在最上面添加代码:
<?php /* Template Name: page-links */ ?>
2.在 page-links.php 找到文章内容输出函数 类似< ?php the_content(); ?>
在其下面加入下面的代码,可以参考下结尾的函数说明:
<div id="linkcontent"> <div class="linkpage" > <ul> <?php wp_list_bookmarks('categorize=1&category_orderby=id&before=<li>&after=</li>&show_images=0&show_description=0&orderby=date&title_before=<h3>&title_after=</h3>'); ?> </ul> </div> </div>]
3.找到头部输出函数get_header();在下面添加显示效果代码:
<script type="text/javascript"> jQuery(document).ready(function($){ $("#linkcontent .linkpage a").each(function(e){ $(this).prepend("<img src=http://www.google.com.hk/s2/favicons?domain="+this.href.replace(/^(http:\/\/[^\/]+).*$/, '$1').replace( 'http://', '' )+" style=border:0;float:left;padding-left:10px;padding-top:3px;>"); }); }); </script>
4.最后是添加样式,可以给linkpage自定义下样式,比如:
#linkcontent .linkpage h3{background:url(images/linkline.png) no-repeat scroll 0 10px transparent;height:40px;color:#5e6069;text-align:center;font-size:14px;font-weight:400;margin-left:5px} #linkcontent .linkpage ul{list-style-type:none;overflow:auto;margin-top:20px;margin-bottom:30px} #linkcontent .linkpage ul li ul li{float:left;height:30px;line-height:23px;list-style-type:none;text-align:center;margin:9px} #linkcontent .linkpage ul li ul li a{color:#3AA2B4;display:block;text-decoration:none;float:left;height:22px;overflow:hidden;width:110px;border:1px solid #FFF;background:#F9F9F9;-moz-box-shadow:0 0 3px #AAA;-webkit-box-shadow:0 0 3px #AAA;box-shadow:0 0 3px #AAA;border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px}
5.新建页面,选择page-links模版.完.
附录:友情链接函数wp_list_bookmarks()的一些参考:
categorize=1 — 是否显示分类友情链接(书签)标题,0是不显示,1是显示.
category_orderby=id — 分类按照 ID 号进行排列;
show_images=0 — 不显示链接的图片;
show_description=1 — 显示连接的描述;
orderby=name — Blogroll 的链接根据其名称排序;
title_before 和 title_after — 分类标题前后用 h3 标签套起来.
最新评论