这节我们接着上节,继续介绍如何定义index.php以及如何派生出其它文件,在index.php文件中,在body元素内,新建如下结构化标记元素,各元素都带有不同的id属性:
<div id=”page”>
<div id=”header”></div>
<div id=”content”></div>
<div id=”sidebar”></div>
<div id=”footer”></div>
</div>
这些不同的属性,分别代表着不同的区域,让人一看就知道是什么意思,下面我们重点探讨header,content,sidebar,footer部分的构建。
(一).构建header
<div id=”header”></div> 元素的两个标签之间输入下列代码:
<h1><a href=”<?php bloginfo(’url’); ?>” title=”<?php bloginfo(’name’); ?>”><?php bloginfo(’name’); ?></a></h1>
<p><?php bloginfo(’description’); ?></p>
这里用到了 WP 内置的 bloginfo 函数来生成内容,其中:
bloginfo(’url’)返回网站主页链接;
bloginfo(’name’)返回网站标题;
bloginfo(’description’)返回网站描述。
保存 index.php 文件,然后在浏览器中按 F5 刷新一下页面,看能看到什么?再通过“查看源文件”,核对一下由 WP 的 bloginfo() 函数生成的相关信息。
[...]
上一节,我们介绍了wordpress模板制作的基本模板文件和常用Php函数,这一节,我们将介绍如何去应用其中的模板文件和php函数。希望大家耐心点,继续跟进,相信你会有一份收获。
在一套wordpress模板中,最基本的两个文件是index.php和style.css。其中,前者定义结构和内容,后者定义样式。而事实 上,当我们打开某个模板的文件夹时,看到的并不止这两个,而是更多。这个我们在上一节中就给大家列出来了,这里不妨再列出来,温故而知新。
style.css : CSS(样式表)文件 index.php : 主页模板 archive.php : Archive/Category模板 404.php : Not Found 错误页模板 comments.php : 留言/回复模板 footer.php : Footer模板 header.php : Header模板 sidebar.php : 侧栏模板 page.php : 内容页(Page)模板 single.php : 内容页(Post)模板 searchform.php : 搜索表单模板 search.php : 搜索结果模板
除此之外,一套主题模板中还可以包含 author.php、home.php、date.php 以及 functions.php 等页面(其中部分页面稍后介绍)。
说明:为简明起见,本指南不涉及如何定义样式表(CSS)文件的内容。
别看上面列出那么多文件,但制作一套模板远没有想象得那么复杂。其实,你只需要制作一个index.php文件,就可以派生出其它文件来,那么为什 么其它文件可以从index.php文件派生出来呢?因为从wordpress应用模板的机制来说,这些模板文件是存在优先级差别的,也可以认为是重要性 不同,它们的优先级顺序是:
index.php -> single.php -> page.php [...]
我们带大家学习wordpress已经有一段时间了,相信大家对它的使用方法已经有所了解了,但若让大家自己设计一款模板出来,还是不知道如何去做 吗?我们将在这里带大家一起学习wordpress模板制作,在这节中,我们介绍 wordpress模板基本资料,希望对朋友们有所助益。
WordPress基本模板文件
一套完整的WordPress模板应至少具有如下文件:
style.css : CSS(样式表)文件 index.php : 主页模板 archive.php : Archive/Category模板 404.php : Not Found 错误页模板 comments.php : 留言/回复模板 footer.php : Footer模板 header.php : Header模板 sidebar.php : 侧栏模板 page.php : 内容页(Page)模板 single.php : 内容页(Post)模板 searchform.php : 搜索表单模板 search.php : 搜索结果模板
当然,具体到特定的某款模板,可能不止这些文件,但一般而言,这些文件是每套模板所必备的。
基本条件判断Tag is_home() : 是否为主页 is_single() : 是否为内容页(Post) is_page() : 是否为内容页(Page) is_category() [...]
4.2 后台管理页面
贫僧先来介绍一下今天的主角——WordPress Theme Toolkit 和 Unnamed 0.4.1:Wordpress Theme Toolkit 是著名 WordPress 达人 Ozh 开发的专用于编写 WordPress 模板后台管理页面的工具(Ozh 开发了很多经典且实用的WordPress插件和工具,施主可以在这里找到更多好玩的东西)。尽管已经有很久没有更新,但经过测试,发布于九个月前的、将该工具性能压榨殆尽的 Unnamed 0.4 至今仍能非常稳定的工作在 WordPress 2.3-Alpha 平台下,足见 Theme Toolkit 的经典程度。
施主们先来看看 Unnamed 0.4 的后台管理页面截图。
对比 Unnamed 1.2 的后台管理页面, 施主们可以发现,这九个月来,Unnamed 虽然一直在进步,但其基本框架是在 0.4 时代就定型了的。从Unnamed 0.5 起,贫僧开始自己编写后台页面,代码最多时达到700余行,而 0.4 的后台管理页面只有区区200行代码,简练易读。贫僧认为,对于初学者,Theme Toolkit 提供的方便而强大的开发环境可以让施主事倍功半。
OK,现在我们来介绍 Theme Toolkit 的使用方法。
1. [...]
题外话:WordPress团队最近干了两件很2的事情,其一是将一个极不成熟的tag系统引入WordPress 2.2。仅从模板开发者的角度来说,该tag系统与UTW的兼容性较差,基本上支持了WordPress内生的tag就等于放弃对UTW的支持(屠杀 啊),而该tag系统不过是原分类系统的畸形衍生品,功能上实在不敢恭维。其二是他们又把tag给去掉了,说是要到2.3的时候再推出,这就是对UTW判 了死缓。对贫僧个人而言,这意味着刚刚加入对这个破玩艺支持的Unnamed 1.2作废了,搞得贫僧很没有兴致。这些行为实在是太2了,连Blogging Pro也说:
I would rather see the team take their time, delay a release until June with the tagging feature properly implemented and tested, rather than removing it due to potential issues.
OK,让我们进入正题。
四、杂项
4.1 Custom Image Header
Custom Image Header 是WordPress 2.1增加的一个新功能,支持该功能的主题允许用户自定义Header图片。所以今天贫僧来介绍如何让施主们的WordPress主题支持该牛逼闪闪的功能。本文中涉及的相关代码可以在Unnamed Special Edition 的functions.php中找到。
首先,各位施主请看如下几行代码,它们分别定义了header部分的字体颜色、默认背景图片以及图片尺寸:
define(‘HEADER_TEXTCOLOR’,'FFFFFF’);
[...]
3.2 Index.php
以WordPress默认模板的index.php为例。我们先来看看它的结构:首先,通过<?php get_header(); ?>获得头信息;然后是一个循环体(The Loop,不知这样叫对不对);最后通过<?php get_sidebar(); ?>和<?php get_footer(); ?>加载侧边栏和页脚。
熟悉The Loop的用法能够让你随心所欲的控制文章的输出,因此我们来着重了解一下The Loop:
WordPress使用一个循环体来控制正文内容的显示,文章将按循环体内代码所定义的格式输出到当前页面上。部分模板标签必须在循环体内使用,如每篇文章的标题(the_title()),时间(the_time())和分类(the_category()) 。
简单表示如下:
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
…找到相关内容则按格式输出正文…
<?php endwhile; else: ?>
…否则输出错误信息…
<?php endif; ?>
The Loop的用法非常灵活,比如你可以将其和分类标签结合起来以限定某个页面或某一部分只显示某个或几个分类的内容,这就是一个最简单的Asides。有兴 趣的自己不妨找找相关插件或模板来看看。我在这里仅举两个简单的例子。比如,如果你想要某一页面只显示分类x(x代表该分类的ID)的内容,你可以这样 写:
<?php if ( have_posts() ) : while ( have_posts() [...]
我决定静下心来,好好的写一些东西,最好能把我这一年多来设计WordPress主题的体验记录下来,和大家分享。
这会是几篇半教程性质的手记,估计内容会很杂,也很难写成体系,所以我打算写到哪算哪。有兴趣的随便看看吧,兴许能找到一两个有用的点子。
今天先扯开发WordPress主题可能用到的工具和资源,并简单介绍一下WordPress主题的结构……我废话又多了,开始吧。
一、开发工具及相关资源 本地WordPress架设:Xampp(WordPress官方也推荐了这一软件组合,方便实用)。 代码:Dreamweaver(我选择它仅仅是出于习惯,你完全可以选择一个更称手的)。 图像:Photoshop、Illustrator、Fireworks之类之类。 版本控制:Google Code,在教育网利用svn往google code上传东西实在是太慢了,不过还是推荐。 浏览器测试:Firefox(当然,少不了Web Developer Toolbar)、Internet Explorer 7、Mutiple IEs(包含可独立运行的IE3——IE6)、Opera、Swift(基于WebKit引擎的浏览器,用于Safari兼容性测试)。 相关站点: WordPress Codex WordPress Hooks WordPress Theme Viewer 二、WordPress主题结构——模板文件及其调用
传统的网页通常使用HTML来控制页面结构,并通过样式表(CSS)来控制页面的表现。WordPress也使用样式表来控制网页的表现,但其页面 内容则是由几个模板文件(Template Files)共同构建而成的。其中一些模板文件是全局性的,比如头信息和页脚模块,而有一些则只用于特殊场合。
这些模板文件通常由XHTML和简单的PHP代码构成,只要你有一些基本的网页知识,并且知道什么是“if…else…”,就不用太担心代码问题 ——当然,掌握一些基本的XHTML、CSS、PHP和Javascript知识,还是大有好处的。在文章中,我会尽量少涉及模板之外的代码,很多东西, 不是拿来谈论的,比如网页标准,我们遵循它,使用它,就可以了。
我们习惯性的将网页分解为 “头信息(Header)”、“内容(Content)”、“侧边栏(Sidebar)”、“页脚(Footer)”这几个主要部分,而这也是主要 WordPress模板文件划分的依据。通常一个普通的WordPress主题会包含一下几个模板文件:
样式表:style.css 头信息模块:header.php 内容模块:index.php、page.php、single.php、archive.php、search.php、404.php 侧边栏模块:sidebar.php 页脚模块:footer.php 评论模块:comments.php 搜索表单模块:searchform.php
其中,style.css用于定义主题的外观;头信息模块定义了网站的基本信息,比如标题、关键词等等;站点的主要内容使用index.php输 出,page.php用于输出分页内容,而single.php则被用于单篇汇整,404模块用于返回站点404错误信息;sidebar.php包含了 网站的一些次要内容,比如订阅、分类、链接等等;页脚信息通常会包含站点的版权等相关信息;而其他模块所含内容视情况而定,比如comments.php [...]
At least five new WordPress themes are introduced everyday on this free Net and that gives us a few good thousands of free
WordPress themes floating around the internet. Have you ever wondered which [...]
今天第一次安装试用了大名鼎鼎的wordpress博客系统,去wp中文网站的wp主题栏目寻找主题,用了几个小时的时间,却失望而会,幸而灵机一动通过,某wp使用者的模板找到的主题名字作为关键字在google找到了这么一个帖子,里面的17个主题都不错!
自5月开始接触WP,就一直很喜欢,随意更换主题以及丰富的主题资源也是一大因素。上次换了个深色系的主题,但一直以来,都想换一个带有web2.0风格的主题,因为Enjoyweb20 是关注国内外最新web2.0服务这样也就“表里如一”了。带有web2.0风格的Wordpress主题不知何缘故,并非主流,数量不多,经过很长时间的收集,我收藏了以下17款精美的主题,与大家分享,当然都是免费的呕!合适的时候,我会首当其冲用上这样的主题。
第1款:来自DezinerFolio 的dfmarine。提到web2.0,首先想到的是DezinerFolio ,它所制作的6款Wordpress主题也同样是精品之作!在此仅推荐其中的两个。这款dfmarine 采用简约风格,两栏设计,细微之处尽显DezinerFolio 的精湛!但不支持widget。
第2款:agregado。最近很热的一款WP主题,十分的web2.0,尤其是右上角动态下拉菜单十分惹眼!不过需要WordPress2.6+版本。
第3款:同样来自DezinerFolio :dfTheme 2.0,升级版本,采用三栏设计。一直以来我都比较喜欢三栏的主题,个人喜好!另外还有几款DezinerFolio 的主题也非常棒,比如华丽的dflover、清爽的sIMPRESS v2、黑白的dfTheme 2.0d 、最早的sIMPRESS。
记录一下吧.
ftp路径,博客根目录/wp-content/themes
最终打开themes文件夹,把下载的风格文件夹上传在里面(注意:大多风格压缩包解压之后都会出现文件夹嵌套的问题),就可以进入wp后台管理:外观/风格选择你刚刚上传的风格使用了.很简单的!
-
Calendar
May 2012 M T W T F S S « Feb 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 -
Meta

