wordpress主题模版制作教程
学习本教程，需要：
- 对PHP，WP，CSS，PS有一定的基础，懂得初步的应用。
- 你是一个想要表现自己的家伙，并且不想再使用别人制作的主题。
- 你要有耐心，细心，细心，耐心
WP 主题简介
在详细分解代码之前，我们还是要先了解一下WP主题的大致情况。一个 WP 的主题是由几个 templates 文件组成的，每一个主题必有的二个文件是：index.php 和 style.css，除此之外还有一些其它的文件（不是必须），它们和 index.php 文件间存在优先级关系，如果它们存在，WP 模板系统就会调用它们显示相应的页面，否则模板系统会调用 index.php 来显示。
它们有可能是以下文件：
- single.php – 单一日志文件，用于显示单一日志
- page.php — 页面模板文件，用于显示静态页面
- archive.php — 存档文件，用于显示存档页面
- category.php — 类别文件，用于显示类别页面
- search.php — 搜索文件，用于显示搜索结果
- 404.php — 错误文件，用于显示404页面
- comments.php — 评论文件，用于显示评论和评论框
index.php
首先制作index.php，我们知道在一个网页中，代码主要分为二部分，一个是页头信息，一个是页面内容。
<html>
<head>
………页头信息
</head>
<body>
………页面内容
</body>
</html>
每个主题的页头信息都是几乎一样，具体可以查看默认模板的 header.php 文件（为保证所有页面的页头信息的一致性，所有页头信息都放在 header.php 文件）。
接下来我们谈下一话题，关于母猪的产后护理……（我学的太杂了，都弄混了）
我们来谈一下body中的内容。它包含四个部分，每一部分都可以叫做一个集成模块，其实一个主题就是由不同的模块构成，模块又是由不同的模块构成。
- header WP 的顶部，显示博客的名字与描述，放置导航栏，搜索栏等等。
- content WP 的正文部分，显示贴子的内容，作者，时间，分类，评论，编辑等等。
- sidebar WP 的侧边栏部分。
- footer WP 的尾部，这部分只有很少的内容，通常是版权信息。
对于每一个集成模块中的内容，理论上是可以随意放置的，比如我们可以把header模块中的搜索栏放在sidebar模块中去。那如何区分这四个集成模块呢？看以下代码。
<div id=”header”>
这是我的博客名字
</div>
<div id=”content”>
这是我写的贴子
</div>
<div id=”sidebar”>
友情链接，搜索栏
</div>
<div id=”footer”>
版权所有：我是二道
</div>
通过div标签，我们可以把这些个模块分隔开来。
现在开始我们第一部分的代码块，不过在写代码之前我还得要啰嗦一句，这不是我说的，是我爱水煮鱼说的，写代码要有层次感，要记得使用缩进，缩进不是空格，不是用你键盘上最长的那个键，而是TAB这个键。
header
<div id=”header”>
<h1><a href=”<?php bloginfo(’url’);?>”><?php bloginfo(’name’);?></a></h1>
<?php bloginfo(’description’);?>
</div>
id是div的一个属性，为id赋于不同的值，这样就可以区分每一个div代码段。
bloginfo()是WP中定义好的函数，参数url代表网址，参数name代表网站的名字，参数description代表对网站的自我描述。
在上面的代码中，就是为网站的名字加上一个超链接,并且显示描述。
这一部份代码也是存放于header.php文件中，在index.php文件中只要用一行代码就可以调用到
<?php get_header(); ?>
这样的好处是，你只要修改一下header.php文件，所有调用这个文件的页面都会跟随改变，而不用一个一个地去修改了。
content
现在开始我们第二部分的代码块
<div id=”content”>
<?php if(have_posts()) : ?>
<?php while(have_posts()) : the_post(); ?>
<?php endwhile; ?>
<?php endif; ?>
</div>
这里调用if(have_potst())来检测是否有文章存在，如果有的话，就用while循环显示。the_post()就是调用文章的函数。
而每一篇文章又是有标题，有写作时间，有分属类别，有读者的评论，这些又全部需要用div标签来分隔开。
看下面的代码
<div id=”content”>
<?php if(have_posts()) : ?><!–开始检测–>
<?php while(have_posts()) : the_post(); ?><!–以下面的格式显示每篇文章–>
<div class=”post”>
<h2><a href=”<?php the_permalink();?>”><?php the_title();?></a></h2><!–文章的标题，含有链接地址–>
<div class=”entry”>
<?php the_content();?><!–文章的内容–>
<p class=”postmetadata”><!–文章后面跟随的内容–>
<?php _e(’Filed under:’);?>
<?php the_category(’,’);?><!–调用当前文章的分类–>
<?php _e(’by’);?><!–创建可以翻译的主题–>
<?php the_autnor(”);?><!–调用文章的作者–>
<br />
<?php comments_poopup_link(’No Comments»’,’1 Comments»’,’% Comment»’);?><!–调 用一个弹出的留言窗口，如果这个功能没有激活，则是显示留言列表–>
<?php edit_post_link(’Edit’,’|’,”);?><!–只有在登陆后才可见到，对文章进行编辑的链接–>
</p>
</div><!–文章内容彻底结束–>
</div><!–一篇文章终于结束–>
<?php endwhile; ?>
<?php endif; ?>
</div>
class
现在我们得要说说class了，它与id都是标签的属性，但是不同之处在于，
id的参数值是唯一的，它只能使用一次，而class的参数值是可以多次使用，
比如id=”header”只能用一次，因为我们只有一个地方可以出现博客的名字。
而class=”entry”会经常出现，那是因为我们的博客里不只是有一篇文章。
为什么我们要用到id与class，难道只用一个不行吗，反正功能都是相同的。
不要忘了我们前面说过的一个重要文件，style.css样式表文件。
我们为某一段代码添加了属性，如同起个名字而已，这样在样式表中我们就可以为这些名字来定制它们的样式了。
这样说你还不明白？那就打个最简单的比方吧，你可以有很多的兄弟，但是你们只能有一个爹，
你不能用你爹的名字叫你的兄弟，但是你爹可以用你兄弟的名字叫你。
样式表文件就和你奶奶一样，你爹再牛逼也得听你奶奶的话，叫他怎么样他就得要怎么样。
Not Found
前面的代码中有说到，如果检测到有文章的话，就用循环调出来，可是如果没有文章的话那要怎么样呢？
<?php else:?>
<div class=”post” id=”post-<?php the_ID(); ?>”>
<?php _e(’Not Found’);?>
</div>
把这一段代码加在<?php endwhile; ?>之后就可以了。
页面导航
当你的博客内容越来越多的时候，在WP的后台又设定了首页只显示10个文章，那么从第11个开始都无法在首页显示出来。
这样在博客的最后一篇文章下面就会出现下一页或是前一页的链接。如果你还不到10个文章，这个链接就不会出现。
把下面的代码加入到<?php else:?>前面
<div class=”navigation”>
<?php posts_nav_link(); ?>
</div>
分析一下posts_nav_link()，它可以有三个参数
posts_nav_link(’in between’,’before’,’after’)
第1个参数是显示在后一页和前一页链接的中间。第2个参数显示在后一页和前一页链接的前面。第3个参数显示在后一页和前一页链接的后面。
用什么来显示，你自己决定，常用的就是一些符号或是箭头而已嘛。
现在再看一下index.php文件中我们已经有了哪些个代码
<?php get_header(); ?>
<div id=”content”>
<?php if(have_posts()) : ?>
<?php while(have_posts()) : the_post(); ?>
<div class=”post”>
<h2><a href=”<?php the_permalink();?>”><?php the_title();?></a></h2>
<div class=”entry”>
<?php the_content();?>
<p class=”postmetadata”>
<?php _e(’Filed under:’);?>
<?php the_category(’,’);?>
<?php _e(’by’);?>
<?php the_autnor(”);?>
<br />
<?php comments_poopup_link(’No Comments»’,’1 Comments»’,’% Comment»’);?>
<?php edit_post_link(’Edit’,’|’,”);?>
</p>
</div>
</div>
<?php endwhile; ?>
<div class=”navigation”>
<?php posts_nav_link(); ?>
</div>
<?php else:?>
<div class=”post” id=”post-<?php the_ID(); ?>” >
<?php _e(’Not Found’);?>
</div>
<?php endif; ?>
</div>
**********************************************************
写教程不是一个简单的事，它不光让我心烦，还让我难以找到适当的词来表达，所以要体会一下当老师的难处。
*********************************************************
侧边栏
第三部分，关于侧边栏。侧边栏有一个特点，就是又臭又长，当然了这不是什么缠脚布。先不要乱扯。
因为地形有限，所以侧边栏里的内容，多以列表的形式排开。下面欢迎一对父子出场，他们的感情是相当的好，从来都是父子不分家，有父必有子，有子必有父，父中有子，子中有父。他们就是<UL>与<LI> !!!!!!!
<div class=”sidebar”><!–注意这里使用的不是id–>
<ul>
<li>
<h2><?php _e(’文章分类’); ?></h2>
</li>
</ul>
</div>
ul表示无序列表，li表示有序列表。
在侧边栏里，你要有几个不同的栏目，栏目的存在，就是为侧边栏进行了分类整理。
每一个栏目又要有不同的分类列表，继续为上面的代码添加内容。
<div class=”sidebar”>
<ul>
<li><h2><?php _e(’文章分类’); ?></h2>
<ul>
<?php wp_list_cats(’sort_column=name&optioncount=1&hierarchical=0′); ?>
</ul>
</li>
</ul>
</div>
wp_list_cats()函数为调用文章分类列表，它的参数也有三个。每个参数之间用&来分隔。
sort_column=name - 把分类按字符顺序排列
optioncount=1 - 显示在每个分类下面的文章数
hierarchial=0 - 不把子分类放到子列表条目中
********************************************************************************
静态页面
说到分类，特别说一下页面这个栏目。我们在WP后台撰写的时候，有二个选择，一个是撰写文章，一个是撰写页面。
对于文章，还可以选择保存在哪一个具体的分类下面。对于页面就没得选择，只收录于页面栏目之下。 再回到前台，
你可以看到每个文章分类都有显示文章的数目，而不显示标题。
在页面栏目里，只排列了每一个页面的标题，而不显示数目。
<?php wp_list_pages(’depth=3&title_li=”<h2>页面</h2>’); ?>
参数depht=3为可选参数，表示可以设定显示三级列表。
*******************************************************************************
注意一点，本教程的代码是制作模版的代码，在WP中使用一个主题也就是等于在套用一个模版。
在网站中查看源代码是看不到模版的代码的。
<li><h2><?php _e(’文章分类’); ?></h2>
<ul>
<?php wp_list_cats(’sort_column=name&optioncount=1&hierarchical=0′); ?>
</ul>
</li>
上面这一段模版代码，在网页中查看源代码，实际上显示的是这样的
<li><h2>文章存档</h2>
<ul>
<li><a href=”#” mce_href=”#”>与爱情有关的分类贴子</a></li>
<li><a href=”#” mce_href=”#”>与生活有关的分类贴子</a></li>
………………………………………………
</ul>
</li>
**********************************************************************************
增加一个存档栏目
<li><h2><?php _e(’文章存档’); ?></h2>
<ul>
<?php wp_get_archives(’type=monthly’); ?>
</ul>
</li>
wp_get_archives()函数是获取文章存档的方法，参数’type=monthly’定义为以每个月的时间来进行分类存档
********************************************************************************
增加一个友情链接栏目
<?php get_links_list(); ?>
不用担心没有实际内容，它会自动调用在WP后台中添加的友情链接。
********************************************************************************
增加一个搜索栏目
<li id=”search”>
<?php include(TEMPLATEPATH. ‘/searchform.php’); ?>
</li>
使用include()函数调用一个文件，参数TEMPLATEPATH为文件的目录文件夹，为了调用成功，你还需要有一个文件，
searchform.php——>代码请看这里。
*******************************************************************************
增加一个日历栏目
<li id=”calendar”>
<h2><?php _e(’日历’); ?></h2>
<?php get_calendar(); ?>
</li>
这里就不用多废话了。
********************************************************************************
增加一个管理栏目
<li>
<h2><?php _e(’管理’); ?></h2>
<ul>
<?php wp_register(); ?>
<li>
<?php wp_loginout(); ?>
</li>
<?php wp_meta(); ?>
</ul>
</li>
wp_loginout()来确定你是否登陆，如果登陆就显示登出链接，如果没有登陆，就显示登陆的链接。
wp_register()来确定你的身份，如果没有登陆，就显示注册的链接，如果有的话，就显示管理的链接。
而wp_meta()却是什么也没有做。也不用去理它，还没有人来说明它是起什么作用的。实际上它是 WordPress 的hook。
********************************************************************************
窗体化侧边栏
<?php /* Widgetized sidebar, if you have the plugin installed. */
if ( !function_exists(’dynamic_sidebar’) || !dynamic_sidebar() ) : ?>
在侧边栏开始的地方第一个<ul>的后面，加上以上代码。也要在侧边栏结束的地方</ul>前面加上一句
<?php endif; ?>
从WP2.0开始，已经在后台集成了一个侧边栏的插件－－Widgetized，它的功能就是可以很方便的在WP后台调整侧边栏中的内容，直接使用鼠标就可以移动每一个栏目的位置，而不需要去修改相应的代码。让每一个栏目都以窗体化存在。
function_exists(’dynamic_sidebar’) || !dynamic_sidebar()这两个参数来自于一个新的文件－－functions.php,
我们需要创建这个文件才可以完成侧边栏的窗体化－－－－>>代码在这里
*******************************************************************************
通过观察不同的WP主题，会发现在侧边栏中的内容远不止以上所列举的，
要在学习中举一反三，才会制作出更加出众的主题。
*******************************************************************************
至此，侧边栏中的内容结束，我们也可以把第三部分的代码另存为一个新的文件－－sidebar.php,
在index.php中填加一句代码就可以使用侧边栏
<?php get_sidebar(); ?>
顺便再增加一行代码
<?php get_footer();?>
这是调用尾部文件footer.php的代码。我想你应该知道如何处理一个简单的PHP文件了，要么你就再重头学一次本教程。
*****************************************************************************
再一次查看一下index.php有了哪些代码
<?php get_header(); ?>
<div id=”content”>
<?php if(have_posts()) : ?>
<?php while(have_posts()) : the_post(); ?>
<div class=”post”>
<h2><a href=”<?php the_permalink();?>”><?php the_title();?></a></h2>
<div class=”entry”>
<?php the_content();?>
<p class=”postmetadata”>
<?php _e(’Filed under:’);?>
<?php the_category(’,’);?>
<?php _e(’by’);?>
<?php the_autnor(”);?>
<br />
<?php comments_poopup_link(’No Comments»’,’1 Comments»’,’% Comment»’);?>
<?php edit_post_link(’Edit’,’|’,”);?>
</p>
</div>
</div>
<?php endwhile; ?>
<div class=”navigation”>
<?php posts_nav_link(); ?>
</div>
<?php else:?>
<div class=”post” id=”post-<?php the_ID(); ?>” >
<?php _e(’Not Found’);?>
</div>
<?php endif; ?>
</div>
<?php get_sidebar(); ?>
<?php get_footer();?>
index.php文件的代码已经全在这里了，但是只有第二部分内容需要详细的代码，而其它的部分我们都可以调用外部文件，
至此一个WP的主题构造已经搭建好，再一次提醒各位，检查代码，确认书写正确。只有不厌其烦地写代码才会对代码有更深刻的印像。
***********************************************************************************
下面开始创建其它文件
*******************************************
将index.php的全部代码另存为archive.php，并且把the_content 改成 the_excerpt，
创建存档文件，它会显示在分类栏目下的每篇文章的摘要。
*******************************************
如何创建category.php????
方法同上面一样，就连代码也一样，中是改个名而已，哈哈哈。
*******************************************
将archive.php另存为search.php,创建搜索文件，这样就可以在搜索中得到每篇文章的摘要。
*******************************************
将index.php的全部代码另存为page.php，创建页面文件
在 <?php the_content(); ?> 下面输入以下代码：
<?php link_pages(’<p><strong>Pages:</strong> ‘, ‘</p>’, ‘number’); ?>
说明：如果一个页面，篇幅超长的话，我们可以把它截断分成几页来显示，
<?php edit_post_link(’Edit’, ‘<p>’, ‘</p>’); ?>
说明：显示一个可以编辑的链接
删除掉<p class=”postmetadata”>至</p>这一块的代码
删除掉<div class=”navigation”>
<?php posts_nav_link(); ?>
</div>
说明：对于页面，它没有属于哪个分类，我们也不希望被某人评论，当然它也不能显示与另一个页面间的连接，所在要去掉一部分代码。
******************************************
将index.php的全部代码另存为single.php，创建单篇文章文件，点击文章的标题，可以查看全文内容。
在 <?php the_content() ?> 下输入：
<?php link_pages(’<p><strong>Pages:</strong> ‘, ‘</p>’, ‘number’); ?>
这段代码和上一例相同，都是可以用来截断文章。
删除<br />
<?php comments_poopup_link(’No Comments»’,’1 Comments»’,’% Comment»’);?>
把<?php posts_nav_link(); ?>：
替换成<?php previous_post_link(’« %link’) ?> <?php next_post_link(’ %link »’) ?>
说明：在单篇文章的下面显示的应是上一篇与下一篇的链接，而不是上一页与下一页的链接。
***************************************
如何处理留言评论？
想一想，每一个留言评论都是对于一个文章而产生的，所以只要在单篇文章页面里添加一个调用评论的函数就可以
在 single.php 文件中，<div class=”entry”>代码块结束的</div>下面，输入以下代码：
<div class=”comments-template”>
<?php comments_template(); ?>
</div>
comments_template()这个函数是用来从 comments.php 文件调用评论模板。
所以我们还要创建一个comments.php文件。
*****************************************
模版的代码已经写完，接下来要做的就是如何美化模版。
到目前为止还没有提到过一张图片的名字，所以我要你开始构思你的模版，
用PS做出相应位置的图片，然后在style.css文件中去美化它们吧。
经过前面的PHP文件制作，我们的主题上已经有了许多的零部件了，但是还没有达到完美的程度，它们就如同一堆乱七八糟的杂物，所以我们还要制作一个样式表文件 ：style.css，为它们安排好自已的位置。
避免误人子弟，我特意找出我的CSS书，重新温习一遍。发现还是2001年买回来的呢。可是这几年都把它雪藏了，唉！！！
先写一下版权信息
/*
Theme Name: 这里是模版的名字
Theme URI: 这里是模版的网址
Version: 1.0 这里是模版的版号
Author: 这里是作者的名字
Author URI: 这里是作者的网站
*/
现在越来越重视劳动者的权益，所以不得不在文件中声明一下这是哪个人的作品。
其实，只要通过研究别人的作品，至少可以省下一半的力气。
如何来设计一个样式表的思路才是最重要的。
首先要有一个全局观，要学会计算尺寸。你应该清楚，在你的主题模版中，从这里到那里，是属于什么哪一部分的，是要放什么内容进去的。然后你就为这一部分设置它的属性：class与id，当然了，我这里指的是在前面的PHP文件中，为每一个html标签设置的属性。然后我们才可以在样式表文件中具体的来定义这些属性的参数。有一点要注意，上级标签使用了class属性后，它的下级标签中不可再出现id属性。简单一点的说，id可以包含class与id，class不可以包含id.所以说要有一个好的全局观，在为标签的属性命名时才不会出错。
标签的样式定义有着继承性，下级标签会继承上级标签所定义的样式，但是标签也遵循最近原则，例如：
body{color:#000000;}
p{color:#FFFFFF;}
第一行是定义前景色是黑色，标签p的内容也将因继承性而接受是黑色的前景色，但是标签P又定义前景色是白色，这时标签P的内容将遵循最近原则，改变成白色。
在样式表中，一个点代表class，一个#代表id 。
对于有着相同样式的标签，我们可以把它们集合起来简写，用逗号把每个标签分隔开。
例如：P，h1，h2，div，td{font-size:20px;}
还有一种写代码的情况是这样的：
div ul li p{font-size:20px}
每个标签用空格隔开，代表着上下级的关系。这表示一个具体的标签的样式，它是div标签下面的ul标签下面的li标签下面的p标签的内部字体大小，这样的一个定义不会涉及到其它位置的标签。
两个特殊的标签是UL与LI，它们可以互相嵌套，如果定义UL，只会对下一级的UL起作用。而对下一级的LI无效。