主题文件构成|WordPress主题制作全过程
从零开始制作WordPress主题其实不难，只要你从现在开始认真阅读这个教程，一步一步认真学习，你就会成为一个WordPress主题制作高手。至少你会修改现有主题。
网络上已经有很多关于制作WordPress主题的教程，并且WordPress官方网站上也有指导文章。但是当你不懂这方面的术语的话，这些教程可能不一定会帮助你，甚至还会误导你，所以这个教程会真正从零开始教你如何创建WordPress主题。
WordPress本地运行环境（或者在线网站空间），并且已安装好WordPress，作为测试博客
至少配备三种浏览器，MicrosoftInterExplorer、MozillaFirefox、GoogleChrome，版本暂时不限，用于测试网页是否显示正常
一个文本编辑器用于编写代码，Dreamweaver、UltraEdit、NotePad++、Vim等，不推荐使用记事本阅读说明
懂一点点的HTML、CSS
自己动手编写过代码自己会设计网页界面，想了解怎么制作WordPress主题不打算动手编写代码，不想照着本教程一步一步地操作，只是想看看没有任何网页设计知识没用过WordPress非常熟悉WordPress主题制作过程不喜欢我在此罗嗦了解WordPress主题制作的过程知道如何去修改一个WordPress主题，扩展主题的功能WordPress本地运行环境（或者在线网站空间），并且已安装好WordPress，作为测试博客至少配备三种浏览器，MicrosoftInterExplorer、MozillaFirefox、GoogleChrome，版本暂时不限，用于测试网页是否显示正常一个文本编辑器用于编写代码，Dreamweaver、UltraEdit、NotePad++、Vim等，不推荐使用记事本步骤
主题文件构成
主题文件构成
在开始制作WordPress主题之前，首先得了解WordPress主题到底由哪些文件构成，你得清楚WordPress 程序是怎样与主题文件连接的。以下是WordPress默认主题default文件夹下的所有模板文件：看了上图，可能你还摸不着头脑，到底这些文件是干什么的。WordPress的主题是用PHP编写的，而不是纯HTML+CSS，所以模板文件的后缀名是.php，如果你想精通WordPress的主题制作，完美控制你的博客，最好要熟悉PHP编程。要是不会PHP 编程怎么办就做不了WordPress主题了吗那也不是，至少看完本系列教程，你也能够掌握基本的WordPress主题制作方法。下面是WordPress主题文件层次结构，它会告诉你：当WordPress显示特定的页面类型时，会使用哪个模板文件呢只有了解了以下主题层次结构，你才能知道你的WordPress主题到底需要写哪些文件。
怎么看下面的文件层次结构
以主页为例，下面有2个文件home.php和index.php，WordPress程序会从你的主题文件夹中依
主页:
1.home.php
2.index.php
文章页：
1.single-{post_type}.php–如果文章类型是videos（即视频），WordPress就会去查找single-videos.php（WordPress3.0及以上版本支持）
2.single.php
3.index.php
页面:
1.自定义模板–在WordPress后台创建页面的地方，右侧边栏可以选择页面的自定义模板
2.page-{slug}.php–如果页面的缩略名是news，WordPress将会查找page-news.php（WordPress2.9及以上版本支持）
3.page-{id}.php–如果页面ID是6，WordPress将会查找page-6.php
4.page.php
5.index.php
分类：
1.category-{slug}.php–如果分类的缩略名为news，WordPress将会查找
category-news.php(WordPress2.9及以上版本支持)
2.category-{id}.php-如果分类ID为6，WordPress 将会查找category-6.php
3.category.php
4.archive.php
5.index.php
标签
1.tag-{slug}.php–如果标签缩略名为sometag，WordPress将会查找tag-sometag.php
2.tag-{id}.php–如果标签ID为6，WordPress将会查找tag-6.php（WordPress2.9及以上版本支持）
3.tag.php
4.archive.php
5.index.php
作者：
1.author-{nicename}.php–如果作者的昵称为rami，WordPress将会查找author-rami.php （WordPress3.0及以上版本支持）
2.author-{id}.php–如果作者ID为6，WordPress 将会查找author-6.php（WordPress
3.0及以上版本支持）
3.author.php
4.archive.php
5.index.php
日期页面：
1.date.php
2.archive.php
3.index.php
搜索结果
1.search.php
2.index.php
(未找到)页面
1.404.php
2.index.php
附件页面
1.MIME_type.php–可以是任何MIME类型(image.php,video.php,audio.php,application.php或
者其他).
2.attachment.php
3.single.php
4.index.php
HTML静态模板制作
制作WordPress需要了解PHP，但是不管怎样，你的博客页面都是一张网页，网页之所以能够在浏览器中显示出来，是因为最终传送给浏览器的是HTML、CSS和JS等终端代码，最终由这些代码控制浏览器的显示结果。制作WordPress主题也不例外，它们都是网页，网页最基本的是HTML。要想制作WordPress主题，首先得设计主题界面，含蓄、简约、厚重、奔放……，风格完全随你，接着再将你的设计理念转化为.html，并能在浏览器中正常显示出来。
本系列教程不会教你如何去设计博客的界面，也不会教你HTML和CSS基础知识，而是假定你已经有HTML和CSS 基础了，如果你不会HTML，也不会CSS，后面的东西恐怕对你来说就像天书了。
本系列教程将使用由tutsplus无偿提供的html模板Aurelius为例，来讲解WordPress主题的制作过程，其他模板的制作也类似。下面提供该HTML模板文件下载，我们将以此来练习如何将HTML静态页面与PHP代码结合，制作WordPress主题。下载后，里面的html文件都是可以直接双击打开的。
可能这个模板并不适合每个人的口味，但这个用于我们的主题制作练习已经足够了。另外你可能会诧异，怎么是英文版的放心，到了后面你就会知道，是否英文版都没多大关系。下面说说下载到的这些文件的用途：
首页：index.html
存档页：archive.html
页面：page.html
文章页：single.html
联系页：contact.html
无边栏页：full_width.html
/images/
样式表：style.css
缩略图：screenshot.png
大多数博客所能看到的页面类型也基本就这些。你可能已经注意到，不管你用哪个WordPress主题，不同的文章页面除了标题和内容不同以外，其他东西基本都是一样，这就是所谓的模板。
小试牛刀
一个WordPress主题至少包含以下两个文件：
style.css
index.php
好，现在就开始我们的WordPress主题制作。在你的WordPress目录wp-content\themes\下新建一个文件夹，命名为Aurelius，将WordPress主题制作全过程（三）：HTML静态模板制作下载到的style.css和index.html放到该目录下，再将index.html重命名为index.php，这样wp-content\themes\Aurelius目录下就有下面两个文件：
登陆你的WordPress博客管理后台–外观，里面是不是多了一个主题”Aurelius”呢
启用该主题，打开你的博客主页，OH，页面一片混乱怎么搞的先继续看下文。你可能会很好奇，这个主题的名
称可不以改成我要的名字呢、主题作者能不能改成我的名字呢、为什么主题没有小预览，下面就教你怎样更改这些”主题信息”。用文本编辑器打开Aurelius目录下的style.css，你可以按照下面的说明尝试在style.css文件最前面添加以下信息，再到WordPress管理后台”外观”栏目下，刷新一下看看有什么变化：
将WordPress主题制作全过程（三）：HTML静态模板制作下载到的screenshot.png放到Aurelius目录下，再到WordPress管理后台”外观”栏目下，看看有什么变化，是不是多了个预览图呢主题制作完毕后，你可以给你的主题界面截个图，命名为screenshot.png，大小300*225，放置到主题目录下作为主题缩略图
/*
ThemeName:这里填主题名称
ThemeURI:这里填主题介绍的网址，没有就填你的博
客网址吧
Description:这里填主题的简短介绍
Version:版本号
Author:作者名
AuthorURI:作者的网址
Tags:标签，多个用半角逗号隔开
*/
制作header.php
你可以尝试用文本编辑器打开从WordPress主题制作全过程（三）：HTML静态模板制作下载到的.html文件，不知道你有没有发现他们头部的代码都非常的相似呢其实我们可以提取这部分相似的代码，放到一个单独的文件header.php中，各个页面想用这部分代码的时候再用php
的include包含进去，省的每个页面里面都要写这部分代码，更改起来也可以达到一改全改的目的。
再次提醒：如果你不打算动手编写代码，这个系列教程就别看了，对你无益！
接着我们上次创建的主题目录wp-content\themes\Aurelius，在该目录下新建一个php 文件header.php，我们提取出index.php中的头部代码复制粘贴到header.php中，下面是的代码就是目前header.php中的所有代码了(当然不同主题的头部代码都是不一样，在你实际的项目中可以自定决定)：
<!DOCTYPEhtmlPUBLIC
“-//W3C//DTDXHTML1.0Transitional//EN”“w3/TR/xhtml1/DTD/xhtml1-transitional.dtd”
<htmlxmlns=”w3/1999/xhtml”
<headprofile=”/xfn/11″
<metahttp-equiv=”Content-Type”content=”text/html;charset=utf-8″/
<titleAurelius|Blog</title
<!–Stylesheets–
<linkrel=”stylesheet”href=”./style.css”type=”text/css”media=”screen”/
</head
<body
<divid=”wrapper”class=”container_12clearfix”
<!–TextLogo–
<h1id=”logo”class=”grid_4″Aurelius</h1
<!–NavigationMenu–
<ulid=”navigation”class=”grid_8″
<li<ahref=”contact.html”<spanclass=”meta”Getintouch</span<br/
ContactUs</a</li
<li<ahref=”blog.html”class=”current”<spanclass=”meta”Latestnews</span<br/
Blog</a</li
<li<ahref=”index.html”<spanclass=”meta”Homepage</span<br/
Home</a</li
</ul
<divclass=”hrgrid_12clearfix” </div
<!–CaptionLine–
<h2class=”grid_12captionclearfix”Our<spanblog</span,keepingyouup-to-dateonou rlatestnews.</h2
<divclass=”hrgrid_12clearfix” </div
再用文本编辑器打开index.php、archive.php、contact.php、full_width.php、page.php和single.php，删掉以上类似代码，改成：
<phpget_header();
好，现在打开你的测试博客主页，看看我们制作的主题是否还可以正常，答案是可以的,跟原来几乎没什么两样，但还是一片混乱。get_header()就相当于将header.php中的代码拷贝到当前的php文件。接下来，我们将仔细探讨header.php中的动态内容。header.php将会被所有的模板页面（主页、分类页、页面、标签页等）所包含，所以header.php中代码应该是动态，适合不同页面的，所以这里面需要用到PHP代码，而不是单纯的HTML。
下面让我们一起来修改header.php1、更改<title
我们都知道不同页面的title都是不一样，而且title 的设置还会直接影响到SEO的效果，所以这里应该谨慎设置。下面提供一种SEO优化的title写法，将<titleAurelius|Blog</title改成：
以上添加的php代码运用了条件判断，针对不同的页
面采用不同title，这里解释一下这几个条件标签。
<title<phpif(is_home()){
bloginfo(‘name’);echo”–“;bloginfo(‘description’);
}elseif(is_category()){
single_cat_title();echo”–“;bloginfo(‘name’);
}elseif(is_single()||is_page()){
single_post_title();
}elseif(is_search()){
echo“搜索结果”;echo”–“;bloginfo(‘name’);
}elseif(is_404()){
echo‘页面未找到!’;