WordPress Loop(循环查询)开发完整指南

WordPress Loop 完整指南:您需要知道的一切

WordPress Loop 是 WordPress 网站显示内容不可或缺的一部分。如果您想自定义网站的某些部分(或者想涉足 WordPress 开发),您就需要了解 WordPress Loop。

无论你是从未听说过 WordPress Loop,还是已经有了一些基本的了解,这篇文章都会让你快速掌握关于 WordPress Loop 的所有知识。

我们将解释它是什么,以及为什么使用 Loop 会非常有用。然后,我们将逐步向您展示如何在 PHP 模板(经典主题)中使用循环,以及在较新的区块主题中使用查询循环区块。

什么是WordPress Loop?

WordPress Loop 是 WordPress 用来在网站上显示内容的方式。传统上,它是 PHP 代码,您可以使用模板标签对其进行自定义,不过较新的 WordPress 区块主题使用查询循环区块而不是PHP。

用更专业的术语来说,Loop 查询网站数据库以获取每篇文章的数据,然后根据模板显示这些数据。要控制这个模板,你可以使用各种模板标签或区块,这取决于你使用的是 PHP 还是查询循环区块。

例如,您有一个列出最新博客文章的页面,比如您的主博客列表页面:

  1. 首先,循环将检查是否存在任何文章。
  2. 如果有文章,它将根据模板显示第一篇文章。
  3. 然后,它会检查是否存在另一篇文章。如果存在另一个文章,它将再次“循环”模板,并根据同一模板显示第二个文章。
  4. 它会继续“循环”您的文章,直到没有更多文章为止(或遇到其他限制,如分页规则)。

下面是闪电博博客中循环的前端示例–每个突出显示的方框都是“循环”的另一次迭代。可以看到,所有六个方框都使用了相同的模板。

WordPress 循环示例

WordPress 循环示例

WordPress何时使用循环来显示内容?

WordPress 依靠循环在任何列出多个内容的页面(文章、页面、自定义文章类型等)上显示内容。

以下是 WordPress 使用循环的一些主要情况,但这并不是一个完整的列表:

  • 显示最近文章的网站主页
  • 主博客列表页
  • 分类列表页面
  • 标签列表页面
  • 搜索结果页面
  • 自定义文章类型列表页面

从技术上讲,WordPress 也可以使用循环来显示单个内容。在这些情况下,“循环”会在查询到第一个项目后结束。

然而,当大多数人想到 WordPress 循环时,他们想到的是它在多个项目中“循环”,以某种列表的形式显示它们。

WordPress循环可以用来做什么?

学习如何编辑和操作 WordPress 循环,可以帮助您使用 WordPress 构建更加友好、动态的网站。

以下是使用 WordPress 循环改进网站的三种主要方式…

控制如何显示基本的文章内容和元数据

自定义 WordPress Loop 的最常见原因是控制网站内容的基本布局。

例如,您想控制博客列表页面的布局。通过操作 WordPress 循环,您可以控制重要元素的布局,如文章标题、内容、作者、元数据(如发布日期)等。

使用条件,您还可以为不同类型的内容创建不同的布局。例如,您可以使用一种布局来列出“新闻”类别的文章,而使用另一种布局来列出“访谈”类别的文章。

这样就可以针对网站上不同类型的内容优化设计,为访问者创造良好的体验。

插入自定义字段数据,构建更具活力的网站

了解如何使用 WordPress 循环还可以帮助您使用 WordPress 构建更多动态类型的内容网站。

例如,假设您想创建一个房地产列表网站。作为其中的一部分,您想创建一个页面,通过您创建的“房屋”自定义文章类型列出可出售房屋的信息。

如果您只使用主题自带的默认文章列表设计,那么它只会显示标题和内容等基本信息,就像显示普通博客文章一样。

通过编辑“房屋”文章类型的 WordPress 循环并添加相关模板标签,您可以在其中包含您使用的自定义字段的信息,例如每栋房屋的卧室和浴室数量、面积等。

在文章列表中插入非文章内容(如广告)

学习如何使用 WordPress 循环还可以帮助您在网站内容列表中插入非动态内容。这些内容不是从 WordPress 数据库中提取的。

例如,您想在列表中的每篇文章之间插入横幅广告(或其他类型的静态内容)。通过编辑循环,您可以轻松地在布局中的任意位置注入广告。

使用WordPress循环的两种方法

现代 WordPress 主题开发中,与 WordPress Loop 交互的方式取决于您使用的主题类型。

过去,所有的 WordPress 主题都是基于 PHP 模板的,因此您需要在这些主题模板文件中使用 PHP 与 Loop 进行交互。如今,这类主题被称为经典 WordPress 主题

大多数流行的 WordPress 主题仍在使用这种经典方法,这意味着您将使用 PHP 来使用 WordPress Loop。经典主题包括 Astra、GeneratePress、Kadence、Neve、OceanWP 等。

不过,在站点编辑器上构建的新 WordPress 区块主题不再像经典主题那样使用 PHP 模板文件,因此如果使用区块主题,就不能使用 PHP 来定制 Loop。相反,这些新的区块主题使用一个特殊的“查询循环”区块来定制 WordPress 循环。

您可以查看我们的最佳区块主题列表,了解一些使用这种方法的热门主题示例。

下面,我们将带您使用这两种方法来使用 WordPress Loop:

  • 如果您使用的是经典主题,您将使用 PHP 与 Loop 进行交互。
  • 如果您使用的是区块主题,您将使用查询循环区块方法与循环进行交互。

如果你不确定自己使用的是哪种主题,可以查看 WordPress 面板中外观菜单下的选项:

  • 如果你看到其他选项,如自定义、小工具主题文件编辑器,那么你使用的是经典主题。
  • 如果只看到编辑器选项而没有其他选项,通常意味着你使用的是区块主题。

如何在经典主题中使用WordPress Loop(代码)

如果您使用的是经典 WordPress 主题,您可以在主题的 PHP 模板文件中使用 WordPress 循环。

下面是一个最基本的 WordPress 循环实现示例:

<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
the_title( '<h2>', '</h2>' );
the_post_thumbnail();
the_excerpt();
endwhile;
else:
_e( 'Sorry, no posts matched your criteria.', 'textdomain' );
endif;
?>

为了帮助您理解这段代码的作用,我们将其分为三个部分:

  • 打开循环
  • 使用模板标签控制显示内容
  • 关闭循环

然后,我们将进入稍微高级一点的主题,即使用条件语句根据不同情况调整循环。

如何开始WordPress循环

要打开 WordPress 循环,需要四个元素:

  • <?php – 这将告诉你的网络服务器,你将使用 PHP。
  • if ( have_posts() ) – 这将告诉服务器,它应该检查网站数据库中是否有符合查询条件的文章,如果有,就执行下面的代码。如果没有文章,可以使用 else 语句添加一些后备文本,我们将在下面介绍。
  • while ( have_posts() ) – 这将告诉您的服务器,只要有文章要显示,就应该一直循环。这个限制一般由你在“设置”→“阅读”区域中设置。例如,如果您将网站配置为每页最多显示 10 篇文章,那么服务器将一直循环显示 10 篇文章(只要您发布了至少 10 篇文章)。
  • the_post();– 这将告诉服务器从网站数据库中实际获取每篇文章的数据。您可以使用模板标记来控制这些数据的显示,我们将在下一节介绍。
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();

如何控制WordPress循环内容

打开 WordPress 循环后,您可以使用模板标签来控制每篇文章要包含的信息,以及这些内容的总体布局*。

注:当然,你还可以使用 HTML 和 CSS 来帮助你完成这项工作。包括如何在 WordPress 中使用 CSS

您在 Loop 中使用的模板标签将在每篇显示的文章中重复使用。

以下是一些最常用的模板标记,您可能需要使用它们:

如果您正在构建更多的自定义 WordPress 网站,您可以在 WordPress 循环中包含来自自定义字段的数据。最简单的方法是通过高级自定义字段(ACF)Meta BoxPods 等插件来实现,这些插件都有自己的模板标签功能,您可以在WordPress循环中使用。

例如,我们来看看一个简单循环的语法,它只显示标题、特色图片缩略图和每篇文章的摘录。

如下所示:

// first, we need to open the loop as we showed you in the previous section
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
// now, we can use template tags to control what information to display for each post
the_title( '<h2>', '</h2>' );
the_post_thumbnail();
the_excerpt();

如何结束WordPress循环

要关闭 WordPress 循环,您需要关闭 while 循环、if 语句和 PHP。

为了处理WordPress无法返回任何文章的情况,您可以在关闭 if 语句之前添加一个 else 语句。

下面是关闭循环的示例,其中添加了 else 语句,以处理没有文章匹配查询的情况。

// first, we need to open the loop as we showed you in the previous section
<?php
if ( have_posts() ) :
while ( have_posts() ) : the_post();
// now, we can use template tags to control what information to display for each post
the_title( '<h2>', '</h2>' );
the_post_thumbnail();
the_excerpt();
// once we're finished with the template tags, we can now close the loop
endwhile;
else:
// this tells your site what to do if no posts match the query
_e( 'Sorry, no posts matched your criteria.', 'textdomain' );
endif;
?>

在WordPress循环中使用条件控制行为

了解了循环的基本结构后,您就可以开始以更高级的方式使用它了。

使用条件语句是最好的入门方法之一。这些语句可以让你轻松地针对不同类型的内容调整 Loop 的行为,比如在我们之前的例子中,你可以使用一种布局来列出“访谈 ”类别中的文章,而另一种布局则用于“新闻”类别中的文章。

以下是一些可以使用的条件标记:

如果您点击上面的链接,就可以看到如何针对不同类型的条件修改 WordPress 循环的代码示例。

例如,使用 in_category,对 ID 为“3”的类别中的文章应用不同的 <div> 样式。

<?php
// Start the Loop.
if ( have_posts() ) :
while ( have_posts() ) : the_post();
/* * See if the current post is in category 3.
* If it is, the div is given the CSS class "post-category-three".
* Otherwise, the div is given the CSS class "post".
*/
if ( in_category( 3 ) ) : ?>
<div class="post-category-three">
<?php else : ?>
<div class="post">
<?php endif;
// Display the post's title.
the_title( '<h2>', ';</h2>' );
// Display a link to other posts by this posts author.
printf( __( 'Posted by %s', 'textdomain' ), get_the_author_posts_link() );
// Display the post's content in a div.
?>
<div class="entry">
<?php the_content() ?>
</div>
<?php
// Display a comma separated list of the post's categories.
_e( 'Posted in ', 'textdomain' ); the_category( ', ' );
// closes the first div box with the class of "post" or "post-cat-three"
?>
</div>
<?php
// Stop the Loop, but allow for a "if not posts" situation
endwhile;
else :
/*
* The very first "if" tested to see if there were any posts to
* display. This "else" part tells what do if there weren't any.
*/
_e( 'Sorry, no posts matched your criteria.', 'textdomain' );
// Completely stop the Loop.
endif;
?>

如何在区块主题中使用WordPress循环(站点编辑器)

如上所述,WordPress 区块主题使用站点编辑器来控制主题模板,而不是 PHP 模板文件。

因此,如果您使用的是区块主题,就不能使用 PHP 来定制 WordPress 循环。取而代之的是使用查询循环区块。

不过基本原理是一样的。

从本质上讲,您将使用查询循环区块来打开循环。在 Query Loop 区块中有一个 Post Template 容器和其他用于分页和“无结果”的容器。

然后,您将在文章模板容器中添加 WordPress 主题区块,以控制每个循环项的布局,而不是像使用 PHP 那样使用模板标记。

如何添加查询循环区块

首先,进入网站编辑器(外观 → 编辑器),创建或编辑相关模板。您也可以将循环添加到单个内容中,例如您想列出文章的单个页面。

无论哪种方式,你都可以先添加查询循环区块。然后,你可以单击“选择”使用主题中现有的循环模式,或单击“从空白开始”从空白画布开始。

在本例中,我们将选择从空白开始

如何添加查询循环区块

如何添加查询循环区块。

然后,您可以选择几种不同的启动方式,最简单的选择是只显示每个项目的标题和内容。

如何选择循环的起始变体

如何选择循环的起始变体。

完成上述操作后,您就可以使用查询循环区块侧边栏中的设置来控制您想在循环(“查询”)中包含的内容。

默认情况下,它会列出普通文章,但你也可以更改文章类型,列出其他类型的内容。您还可以更改顺序并使用筛选器只查询特定的内容,如具有特定类别的内容、来自特定作者的内容等。

如何自定义 Loop 的查询

如何自定义 Loop 的查询。

如何自定义循环模板

现在,您可以使用主题部分的区块来进一步自定义查询循环中的文章模板。同样,这些区块的基本作用与 PHP 代码中的模板标记相同。

例如,如果您想显示每篇内容的作者,可以在需要显示作者姓名的地方添加作者姓名区块。

如何自定义 Loop 的模板

如何自定义 Loop 的模板。

您还会发现其他相关项目区块,如精选图片、日期、类别、标签等。

如果查看大纲,就会发现所有这些区块都位于“文章模板 ”组中。

查看查询循环区块的结构

查看查询循环区块的结构。

还有其他组来控制分页和查询不返回结果的情况。

使用WordPress循环的提示

由于循环是 WordPress 不可分割的一部分,任何错误都可能给网站带来问题。尤其是在使用 PHP 模板时,语法错误可能会触发“您的网站出现严重错误”消息

为了避免出现问题,这里有一些提示…

在本地开发环境中进行实验和学习

如果这是你第一次使用 WordPress Loop,你可能会想尝试和玩弄不同的概念,以进一步了解它是如何工作的。

为安全起见,您可以使用本地 WordPress 开发环境,它为您提供了一个由本地计算机驱动的安全沙盒。

在实时网站的暂存环境中工作

如果您正在为一个实时 WordPress 网站开发 WordPress Loop,我们强烈建议您在将更改应用到实时 WordPress 网站之前,先在暂存网站上完成所有工作。

验证一切正常后,您就可以轻松地将暂存更改推送到网站的正式版本。

替代直接使用WordPress循环的插件

如果您觉得直接使用 WordPress Loop 有点困难,那么有几款流行的插件可以为您提供其他“循环”内容的方法,而无需使用 PHP 或查询循环区块。

以下是一些可供参考的 WordPress 循环插件,但这绝不是一份完整的清单。

Elementor Pro

Elementor 是一款流行的可视化拖放页面生成器插件。使用 Elementor Pro,你可以获得完整的主题构建功能,使用 Elementor 设计主题模板文件。2022 年,Elementor 为 Elementor Pro 添加了循环生成器功能,让你可以使用 Elementor 的可视化界面控制和自定义“循环”内容。

我们撰写了完整的 Elementor 使用指南,以及大量其他 Elementor 内容。

Bricks

Bricks 是另一款流行的 WordPress 可视化网站构建工具。作为其众多设计工具的一部分,它包括自己的查询循环构建器,该构建器使用简化的代码方法,并在图形界面中提供大量附加选项。

我们还有一份关于使用 Bricks 构建 WordPress 网站的指南

WP Show Posts

WP Show Posts 没有前两个插件那么灵活。不过,如果你正在寻找一种简单的方法来列出各种格式的 WordPress 文章,它可能是最简单的工具。

它是免费的,与流行的 GeneratePress 主题来自同一个开发商。虽然开发者不再为插件添加新功能,但他仍在维护插件的现有功能。

小结

要提升 WordPress 开发技能,就必须了解 WordPress 循环。Loop 是 WordPress 显示内容不可或缺的一部分;学习如何使用 Loop 可以让您更好地控制如何在网站上显示内容。

尽管如此,较新的 WordPress 区块主题不再像经典主题那样依赖 PHP 模板,因此您可能不需要使用 PHP 来使用 Loop。相反,如果你正在接受区块主题运动,你可以使用查询循环区块来实现类似的效果。

无论如何,学习如何更有效地使用 WordPress Loop 都会让您受益匪浅。

评论留言