WP主题制作-第5-1课:循环

循环  调用您博客的条目。这是最重要的PHP代码集。到目前为止,您应该已经知道本教程系列的本课  开始之前的操作。继续并首先执行该操作,然后让我们回顾一下到目前为止所学到的知识。

到目前为止,您已经了解到

  • WordPress主题的规则,结构和层次结构
  • 您每个页面的组成部分
  • 如何安装主题
  • 如何调用博客标题并将其链接
  • 如何调用描述并将标头与其他所有内容分开

让我们从第5课开始
到目前为止,您应该已经打开Xampp Control,“ tutorial”主题的文件夹,位于http:// localhost / wordpress的浏览器以及记事本中的index.php文件。

这是在index.php文件中应具有的内容:

indexphp

请记住,要学习这些代码或Mumbo Jumpo,请输入所有内容,  请勿  复制和粘贴。

步骤1
在标题区域下添加DIV(无形框)。为其提供ID的“容器”,如下所示:

<div id =”容器”>

</ DIV>

这个DIV是做什么用的?这是为了将您的内容与之后的所有内容(如侧边栏和页脚)分开。

步骤2:在Container DIV标签之间添加以下代码。尝试完全按照您看到的方式输入。如果出现任何错误,请重新输入。

<?php if(have_posts()):?> <?php while(have_posts()):the_post(); ?>

<?php结束;?>

<?php endif; ?>

从现在开始,您将更容易识别每组代码的功能,而不是它们的功能和工作方式。您刚刚输入的是   WordPress中的The Loop。在我解释这些代码的含义之前。你应该有这个:

该环

请注意,我   在内容框中缩进了每一行,而且我倾向于跳过很多行。那是为了  组织。键入代码是不够的。您需要对它们进行组织,以便以后知道所有内容在哪里以及与哪些代码集相关。 对于缩进,请使用制表符代替空格键

刚刚发生了什么?

  • 如果(have_posts())  -检查,看看  是否  你    任何  职位
  • 虽然(have_posts())  -如果你拥有它,    你    任何  职位,执行the_post()。
  • the_post()  –调用要显示的帖子。
  • ENDWHILE;  –坚持规则1,这是要关闭  while()
  • 万一;  –关闭  if()
  • 注意:并非每组代码都需要两部分才能打开和关闭。有些可以自行关闭,这说明了  has_posts() 和  the_post(); 。因为  the_post();  位于  if()  和  while()之外,它需要使用自己的分号来结束/关闭自身。

步骤3:在上一课中,您学习了如何通过使用bloginfo('name')来调用博客的标题  。现在,您将学习如何 在The Loop之间  调用  帖子标题

键入  <?php the_title(); ?> the_post();  之后  ?>  和  <?php之前;?>

标题

保存index.php文件,刷新浏览器。您应该 在博客描述下方看到  Hello World。默认情况下,您的博客只有一个帖子。对我来说,我的测试博客有多个帖子,所以我有多个帖子标题。而且由于我使用的帖子标题是相同的,并且在本教程的这一部分中没有进行组织,因此它看起来像一排长长的Hello World。

你好,世界

步骤4:将您的  帖子标题  转换为  帖子标题链接。还记得您是如何将博客标题变成链接的吗?同样的事情, 在<?php the_title();周围  添加  <a href =“#”>  和  </a> 。?>

保存index.php并刷新浏览器。现在,您的标题是标题链接,但指向无处。使每个标题指向正确的帖子。您需要 用  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并刷新浏览器以查看更改。

标题后的标题
最终课-5-

这节课到此结束。 您现在应该拥有

注意:如果您还没有,请做几个虚拟的帖子来测试您的主题。转到  http://localhost/wordpress/wp-login.php。登录,单击“  写”  选项卡,确保您正在查看“  写帖子”,发表帖子,然后再进行几次。您可以 像我一样为所有  Hello World命名,也可以为其赋予唯一的标题。

未经允许不得转载:创之梦博客 » WP主题制作-第5-1课:循环

赞 (0)
分享到:更多 ()

欢迎各位吐槽评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址