网站导航免费论文 原创论文 论文搜索 原创论文 网学软件 学术大家 资料中心 会员中心 问题解答 原创论文 大学论文导航 设计下载 最新论文 下载排行 原创论文 论文源代码
返回网学首页
网学联系
最新论文 推荐专题 热门论文 素材专题
当前位置: 网学 > 编程文档 > 网络知识 > 正文

简单两步创建个性的WordPress友情链接页面

来源:http://myeducs.cn 联系QQ:点击这里给我发消息 作者: 用户投稿 来源: 网络 发布时间: 14/07/04

本文主要为广大网友提供“简单两步创建个性的WordPress友情链接页面”,希望对需要简单两步创建个性的WordPress友情链接页面网友有所帮助,学习一下!

  如何建立一个个性化的 WordPress 的友情链接页面,效果可以见友情链接资源导航页面。要完成该个性化友链页面需要两步:1、新建页面用函数调用友链。2、给友链加 CSS 美化。下面是分解步骤:

一、新建页面用函数调用友链

  新建一个页面模板,打开所用主题的 page.php 文件,在文件最顶端加上以下声明代码:

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

  再找到如下代码:

<div />    <?php the_content(); ?>
</div><!–/entry –>

  修改为:

<div /><?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 –>

参数解释:

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

  修改好代码之后将该文件另存为一个 php 文件,比如:link_temp.php,将其上传到主题文件夹的目录下。最后新建一个页面,并在右侧的页面模块中选择刚刚新建的“Links Page Template PAGE”。

二、给友链加 CSS 美化

  在 style.css 中加入以下CSS,当然也可以根据个人喜好自己DIY。

/*———————Links Page———————–*/
#mainlink {
clear: both;
margin: 0 40px;
width: 900px; /* Prevents IE6 miscalculation */
background: #fff;
}
.linkpage ul {
padding: 5px 6px;
list-style-type: none;
overflow:auto
}
* html .linkpage ul{ height:1%;}
.linkpage ul li {
color: #333;
margin-bottom: 5px;
font-size: 12px;
}
.linkpage ul li ul li {
float: left;
width: 141px;
text-align: center;
margin: 3px 3px;
line-height: 180%;
background-color: #FFFFFF;
border: 1px solid #dadada;
}
.linkpage ul li ul li a {
color: gray;
display: block;
}
.linkpage ul li ul li a:hover {
background-color: gray;
color: #FFFFFF;
font-weight:bold;
}
.linkpost {
display:inline;
float:left;
margin:0 20px;
padding:0 5px;
width:920px;
}
#linkcontent {
margin-top:8px;
width:970px;
float:left;
}

  写了一大堆,看似复杂,实则简单,因为我已经给出了需要的代码,剩下的事情只需要复制粘贴即可,赶快试试吧。

WordPress v3.5.2 简体中文版下载

界面预览

  • 软件语言:简体中文
  • 运行环境:PHP/Mysql
  • 软件授权:免费版
  • 更新时间:2013-7-24 16:05:30
  • 相关链接:Home Page

WordPress v3.9 英文版下载

界面预览

  • 软件语言:英文
  • 运行环境:PHP/MySQL
  • 软件授权:开源软件
  • 更新时间:2014-4-17 9:56:31
  • 相关链接:Home Page

本文转自:http://www.kekaku.com/wordpress/741

网学推荐

免费论文

原创论文

设为首页 | 加入收藏 | 论文首页 | 论文专题 | 设计下载 | 网学软件 | 论文模板 | 论文资源 | 程序设计 | 关于网学 | 站内搜索 | 网学留言 | 友情链接 | 资料中心
版权所有 QQ:3710167 邮箱:3710167@qq.com 网学网 [Myeducs.cn] 您电脑的分辨率是 像素
Copyright 2008-2015 myeducs.Cn www.myeducs.Cn All Rights Reserved 湘ICP备09003080号