名站导航为爱好WordPress网站的朋友们提供,WordPress教程,WordPress安装教程等WordPress教程相关的教程。
调用博客日志的主循环（The Loop）是 WordPress网站程序 中最重要的 PhP 具体相关代码集，几乎所有的页面都会用到它。这也是从零开始创建 WordPress网站程序 主题系列教程的第五篇。
在开始继续学习之前，我们先复习下到目前为止学到了什么？
到目前为止，我们已经学到：:
现在让我们开始第五篇：主循环（The Loop）
打开 Xampp，“tutorial”主题网站文件夹，浏览器，并且在浏览器中转到 http://localhost/wordpress网站系统，最后打开 index.php 网站文件。
下面应该是这时候 index.php 网站文件中的具体内容：
记住，为了学习这些具体相关代码，请尽量手工输入而不是拷贝和粘贴。
第1步：创建 container Div
在 header DIV 标签下添加一个 DIV 标签，并给它的 ID 赋值为 “container”，如下：
<div id=”container”>
</div>
“container” 这个 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 健而不是空格键进行具体相关代码缩进，)。
刚才发生了什么？
第3步：调用日志标题
在前面的课程中，我们学习了使用 bloginfo('name') 去调用博客的标题。现在我们将学习在主循环（The Loop）中如何调用日志标题。
在 the_post(); ?> 的后面和 <?php endwhile; ?> 的前面输入 <?php the_title(); ?>（wwwdxvkcom 网站建设）
保存 index.php 网站文件并刷新浏览器，这时候应该看到在博客描述的下方出现 hello World ，默认安装 WordPress网站程序 之后，博客只有一篇日志。而我的测试的博客有多篇日志，所以这里有多个日志标题，而且因为我所用的日志标题是一样的，我也没有进行组织整理他们，所以它们看起来像很长的一行 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 网站文件并刷新浏览器，结果如下：
WordPress网站程序 主循环就介绍到这里，现在 index.php 网站文件具体内容应该是：
名站网址导航 WordPress网站程序主题制作教程
关于WordPress教程,WordPress安装教程等WordPress教程就说到这里，如果可以帮到大家既可以了。WordPress网站程序 主题教程 #5b：日志具体内容
日志具体内容是从零开始创建 WordPress网站程序 主题系列教程第五篇的第二部分，在这篇中，我们将展示如果显示博客日志的具体内容，并且使用一个 DIV 标签把博客日志的具体内容和日志的标题区分开。再次强,下面开始这篇课程。首先还是打开 XAMPP，“tutorial”主题网站文件夹，浏览器并在浏览器地址栏输入：http://localhost/wordpress网站系统，最后打开 index.php。,在日志标题具体相关代码下面输入：<?php the_content(); ?>。,保存并刷新浏览器，现在在日志标题下面看到了一些文本：,刚才发生什么了?,我们使用了 PhP 函数 the_content() 调用了 日志的具体内容。现在，日志的具体内容只是一长行的文本，一直到窗口的右边，因为我们还没有样式化它。还记得最开始说到的 style.css 这个网站文件吗,我们在 WordPress网站程序 后台输入多篇多篇测试日志，就可以看到多篇日志一起被显示的样子：,返回浏览器，点击”查看”选择“页面源具体相关代码”，就会弹出一个源具体相关代码窗口，如果你使用的是 Internet Explorer，那么弹出的是记事本。,我使用的是 Firefox浏览器，下面是在 FireFox 中显示的样子：,你注意到 index.php 网站文件和它的源具体相关代码之间的区别了吗？所有的文本，图像和其他东西等所有上图展示的东西都是通过 the_content() 这个函数调用来的。是不是很有用？注意这些具体相关代码是不依赖具,还有，有没有注意到我圈出的开启和关闭的P标签。他们都没有在 index.php 网站文件中出现，但是他们在源具体相关代码中出现了。,P 标签，为什么和如何使用？,为什么 – 当我们输入日志的时候，每次跳过一行就是一个段落，这个时候需要一个具体方法如下去展示？我们可以通过 P （段落，paragraph）标签，每个段落会在 P 标签之间，这就是为什么段落之间有行距的原因,如何使用 – 非常容易，WordPress网站程序 模板系统会自动帮我们产生 P 标签。,给 the_content() 两边添加 DIV 标签并给该 DIV 标签附上class=”entry”属性，如下：,
,,你现在的 index.php 网站文件应该是：,保存并刷新浏览器，我们再次去查看源具体相关代码的话，就会发现每篇日志具体内容在 class=”entry” 的 DIV 标签中。,这样我们就很容易知道日志标题在哪里结束和日志具体内容在哪里开始，这样做也是以后使用style.css 网站文件对它进行样式化做准备，通过 class 我们就可以准确定位到日志具体内容，样式化日志的具体内容而不影响页面,id 和 class之间有什么区别呢？,到目前为止，对于每个 DIV 标签，我们可以用 id 去命名它，如 id=”header”，那么id 和 class之间有什么区别呢？id 是唯一的而 class不是。如果从头到尾浏览源具体相关代码，你会发现,那么 header 和 container 可以用 class 去取代 id 吗？完全可以。,但是不能重复任何 id，比如，不能在同一页面上有两个 id="header" 。当你想一遍又一遍重新利用一些东西如日志的标题，那么请使用 class。,第3步：给日志的标题和具体内容添加 class=”post” 的 DIV 标签,用一个 DIV 标签把日志的标题和具体内容一起围住。并把这个 DIV 标签命名为：class=”post”。,,,（class 和 ID 的名字不是一定要严格和上面一样，可以把 class 和 ID 的名字设置任何你想要的名字，但是 post 和 entry 更加简洁明了，也更容易记。）,现在你的 index.php 网站文件为：,这个是经过缩进整理后的版本：,一般我们使用 tab 健而不是空格键产生缩进的。为什么进行要对具体相关代码进行缩进呢？实际上的具体相关代码不像我上面的屏幕截图一样有红色或者绿色的高亮显示，我们需要有个能够跟踪具体相关代码的具体方法如下，通过缩进就能更容易知道哪个 ,保存并刷新浏览器，然后查看源具体相关代码中的具体相关代码。,为什么你要添加另外一个 DIV 标签去围住日志标题和日志具体内容？wwwdxvkcom 网站建设,增加这个 DIV class=”entry” 去把日志标题和日志具体内容区分开。而这个div class=”post”是把当前日志和其他具体内容区分开。,
