網生@誌 | zEUS.’Blog

Not Only Wordpress Template, But Also My Life…
首页 » Wordpress研究 » 简单定制 Wordpress 友情链接页面

简单定制 Wordpress 友情链接页面

字体大小:T | T
wordpress-research category

wordpress曾经我很傻很天真的做了一个“友情链接”的页面,每次和朋友交换友链除了在 WP 后台的链接页面添加外,还要手动编辑“友情链接”页面里的链接… 非常繁琐… 不过当我知道了 WP 有一个控制 Blogroll 的 wp_list_bookmarks 函数后,发现原来一切都是那么简单… 好了,废话少说,来看怎么制作这个页面。

先在 WP 后台 链接分类 标签下设置好你所需的分类:

wordpress
记住每个分类对应的 ID 号。
再回到管理链接的页面下,给友情链接添加描述并将其放到相应的分类下:
wordpress

友情链接编辑完成后,就开始建立一个“页面模板”。打开所使用的主题包中的 page.php 文件,在文件最前面加上下面的“声明代码”:

<?php
/*
Template Name: Links Page Template PAGE
*/

?>

再找到如下代码:

<div class="entry">
    
<?php the_content(); ?>
</div><!--/entry -->

修改中间的 the_content() 函数:

<div class="entry">
        
<?php wp_list_bookmarks('categorize=1&category=XX,YY,ZZ&category_orderby=id&before=<li>&after=</li>&show_images=0&show_description=1&orderby=name&title_before=<h3>&title_after=</h3>'); ?>
</div><!--/entry -->

将上面的 XX YY ZZ 修改成第一步中记下的 Blogroll 分类的 ID 号,ID 号之间用半角的 “,” 分开。
看过《wp_list_bookmarks 函数详解 》的朋友估计看得懂上面的这个 () 函数:

  1. categorize=1 — 显示所有 Blogroll 的分类;
  2. category=XX,YY,ZZ — 指定显示 ID 为 XX YY ZZ 的 Blogroll 分类,如果您的 Blogroll 没有一个总的大分类话,这个参数可以去掉,因为上一个参数已经指定了显示所有分类;
  3. category_orderby=id — 分类按照 ID 号进行排列,假如 XX>ZZ>YY 那么最终显示的顺序就是:XX 分类下的链接、ZZ 分类下的链接、YY 分类下的链接;
  4. before 和 after — 每个连接前后都用 li 标签套起来;
  5. show_images=0 — 不显示链接的图片;
  6. show_description=1 — 显示连接的描述;
  7. orderby=name — Blogroll 的链接根据其名称排序;
  8. title_before 和 title_after — 分类标题前后用 h3 标签套起来(主要是为了加入 h3 的样式)。

接下来只需要将这个文件另存为一个 php 文件就行了,比如:link_temp.php ,将其上传到到主题文件夹的目录下。

最后撰写一个新页面,并在右侧的页面模块选择刚刚上传的 “Links Page Template PAGE
wordpress
写上标题 “友情链接” 和缩略名 “links” ,保存… 转到前台查看这个页面,是不是效果已经出来了呢?
以后凡是在 WP 后台链接里添加完链接之后,这个页面也会自动更新。无需再进行其它操作了。

上述是建立友情链接页面最基础的方法,也许会因为样式的原因不是特别美观,那么就需要您自己给这个页面写上相应的样式。
以我现在使用的 Ipple Ultra 为例,点击 这里 下载我已经预写好的 link_temp.php 文件,修改其中对应的 Blogroll 分类的 ID 号之后上传到主题文件中,最后把下面这段 CSS 代码直接添加到 style.css 文件的末尾即可:

.link-entry {
    
float:left;
    
margin:0px auto 10px;
    
padding-bottom:5px;
    
width:609px;
    
list-style:none;
}
.link-entry ul li{
    
background:transparent url(images/rnd-li.gif) no-repeat scroll left 2px;
    
padding:1px 16px;
    
list-style:none;
}

最终效果,可以直接参考我的 友情链接 页面 :smile:

  • 原文链接:
  • 转载原创文章请注明:

本文评论 46 comments

  1. 沫沫沫 说:

    现在wp2.9.2,不显示分类的ID,应该怎么办呢?

  2. 大敏 说:

    博主的版权声明,和评论框都很好看!是否可以教下>?

  3. 淡如菊 说:

    谢谢,刚开博客,学习一下

  4. gypsy 说:

    我是从百度过来的,你的主题很不错我很喜欢。

  5. wakaka 说:

    呵呵 感觉有点麻烦。。。。有没有类似的插件呢。。。。

  6. Rui 说:

    现在不用这么麻烦了吧^^

  7. 诗意 说:

    尊敬的楼主,部分图片无法显示了。呵呵

  8. 白菜 说:

    高人,我用的你的主题。为什么 不行呢? 我是按着你的教程一步一步来的呀。。。。教 教菜鸟吧。。 :cry:

  9. mr wu 说:

    能不能把链接输出成百万格子的样式呢。只显示图片。好像pjblog有那么个插件。不知道wp能不能实现

Leave a comment