WP Theme 教程 #5：主循环
June 5th, 2007 at 10:25pm 雪山飞猪 浏览: 6,268
调用你博客日志的主循环（The Loop）是 WordPress 中最重要的 PHP 代码集。这也是关于创建 WordPress 主题系列教程的第五篇。在继续学习之前，我们先复习下到目前为止学到了什么？
到目前为止，你已经学到：:
现在让我们开始第五篇：
现在已经打开了 Xampp，“tutorial”主题文件夹，浏览器中打开 http://localhost/wordpress 以及在文本编辑器中打开 index.php 文件。
下面应该是在你这时候 index.php 文件中的内容：
记住，为了学习这些代码，请手工输入所有的东西，而不是拷贝和粘贴。
第1步
在 header DIV 标签下添加一个 DIV 标签，并给它的 ID 赋值为“container”，如下：
<div id=”container”>
</div>
这个 DIV 标签是用来干什么的呢？它是用于把你的内容和它下面的所有东东都区分开，比如 sidebar 和 footer 这些东东。
第2步
在 Container 的 DIV 标签中添加如下代码：试着完全手工输入这些代码，如果遇到错误，重新再输入一遍。
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
<?php endwhile; ?>
<?php endif; ?>
手工输入代码可以让你更容易知道每个代码集是干什么的。你刚才输入的是 WordPress 中的主循环（The Loop）。在我解释这些代码作用之前，你的 index.php 应该是这样了：
注意我缩进了 Container DIV 中的每一行。这是为了更好的组织代码。仅仅输入代码是不够的，我们需要组织它们。对于缩进，使用 tab 健而不是空格键。
刚才发生了什么？
- if(have_posts()) - 检查你的博客是否有日志。
- while(have_posts()) - 如果你有，当你有日志的时候，执行 the_post() 这个函数。
- the_post() - 调用具体日志来显示。
- endwhile; - 遵照规则 #1，这里用于关闭 while()
- endif; - 关闭 if()
- 注释：并不是所有的代码都需要两部分，为了打开和关闭自己。有些能够自我关闭，这就解释了 have_posts() 和 the_post(); 这两个函数。因为 the_post(); 在 if() 和 while() 的外面，它需要分号去结束或者关闭自己。
第3步
在前面的课程中，你学习了使用 bloginfo(’name’) 去调用你的博客的标题。现在你将学习在主循环（The Loop）中如何调用日志标题。
在 the_post(); ?> 的后面和 <?php endwhile; ?> 的前面输入 <?php the_title(); ?>
保存 index.php 文件，刷新你的浏览器，你应该看到在你博客描述的下方出现 Hello World ，默认情况下，你的博客只有一篇日志。而我的测试的博客有多篇日志，所以我有多个日志标题。而且因为我所用的日志标题是一样的，并我没有进行组织整理他们，所以它们看起来像很长的一行 Hello World.
第4步
把日志标题转变成日志标题链接。还记得你怎样吧你博客的标题转变成一个链接呢？是在<?php the_title(); ?> 两边增加 <a href=”#”> 和 </a>。
保存并刷新你的浏览器。现在你的标题变成了链接了，但是它们并没有指向哪里。为了使得每个标题都能指向正确的日志，你需要把 # 替换为 the_permalink()。
<a href=”<?php the_permalink(); ?>“><?php the_title(); ?></a>
the_permalink() 是用来调用每篇日志地址的 PHP 函数。保存并刷新你的浏览器。如果你只有一个 Hello World 标题，把鼠标移到链接上面，观察你的浏览器底部的状态栏，他不再是 http://localhost/wordpress/#。
如果你有不止一个的标题链接，你将看到每个链接会链到不同的日志或者网页。但是我们的日志标题依然在同一行上面。为了分开它们，在你的链接代码两边添加 <h2> 和 </h2> 标签。
<h2><a href=”<?php the_permalink(); ?>”><?php the_title(); ?></a></h2>
记住 H1 用作你的博客的标题，那是你网页的标题。H2 被用作子标题。现在你的日志标题链接是子标题了，每一个都是一行。保存 index.php 文件并刷新你的浏览器，观察更改的结果。
这一篇到此为止。你的 index.php 文件现在应该是：:
注释：如果你还没有创建一些测试的日志来测试你的主题，那么请到管理界面，点击 Write 按钮，并确认你是在 Write Post 页面下，写一篇日志并重复几次。你可以像我一样给它们唯一的标题 Hello World。
请查看教程目录：WordPress 主题教程系列
翻译自：WP Theme Lesson #5: The Loop
创建 WordPress 主题系列教程均为本站翻译，如要转载，请注明：转载自我爱水煮鱼和本文地址。
作者：雪山飞猪
原文链接：WP Theme 教程 #5：主循环
我爱水煮鱼版权所有，转载时必须以链接形式注明作者和原始出处及本声明。
1. 雪山飞猪 | June 5th, 2007 at 11:53 pm
I don't know what is your meaning, the post is translated by myself. Why you think I copied it from you?
[回复该留言]
2. 雪山飞猪 | June 5th, 2007 at 11:56 pm
And I don't think I need to copy it from you! Please take care your words!!
[回复该留言]
3. 紫天 | June 6th, 2007 at 2:01 am
没来得岌细看。刚外出回来有点困，先转了一下:-)
大概看了下留言...英文的还真不好理解。难道Leon就是你说那个认为你抄他的人？
用翻译引擎说的一段E文，看到偶自己都汗死，中国英语...哈哈
Do HI , Leon , the technology document asking your translation please mind dodging to watch the once , linking address occasionally? Excuse me ,you whether or not Chinese? I think of ought to yes. I work out Chinese you are not bad watch know or not? Hope that you can use Chinese MSG|WTG next time, English watches such that I am very tired oh.
[回复该留言]
4. Remex | June 6th, 2007 at 8:05 am
不知道具体什么情况，不过既然是中国人和中国人说话难道必须要用英文吗？如果不是特殊情况，有人这么和我说话我肯定直接不理睬的。
这篇原文本来也不难，我对比了下，也找不出抄袭的迹象，不过这种已经有人翻译了的文章如果是我搜索到了的话一般都略过了，一个是避免重复劳动，二个就是避免出现这种问题。水煮鱼们翻译的文章都非常实用，希望以后继续加油，毕竟没有翻译的好文章太多太多了。
[回复该留言]
5. yogoslavia | June 6th, 2007 at 1:49 pm
不喜,莱昂,技术文件要求你的翻译,请记逃废观看一次, 连接地址偶然? 对不起,你是否中国人? 我想应该不错. 我的工作中出你是不是坏手表知道与否? 希望你们可以用中文味精|风力发电机组下一次英语手表等,我感到很疲倦啊.
lol
[回复该留言]
6. 雪山飞猪 | June 6th, 2007 at 4:19 pm
第7位和第9位，你们俩再说什么，哈哈！
这件事情就到此为止了，我也不想多说了。也希望大家能够尊重版权，也尊重翻译者的工作，不管翻译的是好还是坏。毕竟是辛苦的差事！
另外本翻译，可以任意转载，但是希望转载的时候在页头能够留下源地址。
[回复该留言]
7. 紫天 | June 6th, 2007 at 7:13 pm
你看这个就知道偶说什么了
http://www.huavi.cn/bolg/?p=216
简直恶搞～～^_^
[回复该留言]
8. 雪山飞猪 | June 10th, 2007 at 4:36 am
Leon，你的留言已经删除！
[回复该留言]
9. keke | June 14th, 2007 at 10:16 pm
支持！
[回复该留言]
10. ideaonly | July 1st, 2007 at 1:28 am
请教水煮鱼大哥；
我照着你的教程，认真的边学边做，但是到了你的“第3步（你写的是”第2步“），你的是把标题全部调用出来，而我的只调用了最新的一个文章标题（我添加了3篇相同标题的文章。）。
我也反复检查了我的代码：
">
">
和你的也相同，
为什么我的只显示一个最新的文章标题？
期待你的回复，谢谢
[回复该留言]
11. 雪山飞猪 | July 1st, 2007 at 9:47 am
你是不是在 Options ==》 Reading 下，设置为只显示一篇文章
[回复该留言]
12. ideaonly | July 1st, 2007 at 7:26 pm
谢谢！现在可以了。你的教程很适合我这样的初学者。学起来一点压力都没有，循序渐进。真的很好。
[回复该留言]
13. glen | August 28th, 2007 at 4:16 pm
操作到第2步第一张图片的时候，主页就打不开了。显示提示第8行有错误，第8行是，怎么可能有错误呢？
[回复该留言]
14. howkey | November 6th, 2007 at 11:35 am
太有用了，我得好好学习了
[回复该留言]
15. 黑色饼干 | December 7th, 2007 at 1:57 pm
呵呵，好东西真不少，学习完这个教程我也想做一个主题，继续阅读去了...
[回复该留言]
16. 颦儿 | March 13th, 2008 at 12:42 pm
哦，现在才渐渐明白，原来是教我们做主题啊？嘻，我要求低，会改主题就成了
[回复该留言]
17. ts | May 15th, 2008 at 12:37 am
输入
之后并没有显示出日志，请问怎么回事？
[回复该留言]
18. ts | May 15th, 2008 at 12:38 am
输入 主循环（The Loop） 之后首页还是看不到日志。。。。。请问怎么回事啊
[回复该留言]