wordpress主题模版制作教程(一)
本教程学习于我爱水煮鱼的翻译文章,经过整理而成。经作者同意,发表在我的网站上,供热爱制作WP模版的朋友们参考。
学习本教程,需要:
- 对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文件,所有调用这个文件的页面都会跟随改变,而不用一个一个地去修改了。




[...] erdaoo 学习本站的 WP Theme 教程之后的学习笔记整理,经本站整理,erdaoo 本人同意之后在本站发表,以便给更多学习 WP Theme [...]