WordPress 自定义帖子类型——更进一步

在我们关于 WordPress 自定义帖子类型的系列中，到目前为止，我们已经研究了使用插件创建自定义帖子类型以及如何通过编写自己的自定义代码片段来手动创建自定义帖子类型。 我们还研究了如何将一些基本配置应用于您的帖子类型，以便您可以从 WordPress 管理员更轻松地处理它们。 如果您还没有查看这些文章，那么请务必查看！

在本文中，我们将通过构建我们之前创建的自定义帖子类型来进一步扩展它们在我们网站上的功能和可用性。 如果您想继续，那么您需要创建我们在我们的文章“手动创建 WordPress 自定义帖子类型”中构建的自定义帖子类型，因此请确保您已先完成此操作，以便以下信息有意义。

让我们开始吧！

在任何地方显示自定义帖子类型

正如您将看到的，我们之前构建了一个自定义帖子类型来在我们的网站上显示食谱。 这是自定义帖子类型是扩展我们网站功能的一种非常有用的方式的完美示例。

在我们的示例中，我们可以通过将食谱帖子添加到我们的主网站菜单来显示它们。 我们还设置了一个存档视图，列出了我们所有与食谱相关的帖子。 这些是显示我们新的自定义帖子类型的绝佳选择，但是当我们想在我们网站的其他地方显示此内容时会发生什么？

使用 WP_Query 函数显示自定义帖子类型

为了在我们网站上选择的位置显示我们的新食谱帖子，我们将使用WP_Query功能。 在其参数中，我们可以找到将在此实例中使用的post_types ，因为它定义了我们要查询的帖子类型。 除了它，我们将使用publish和orderby参数，因为我们想要显示具有已发布状态的食谱帖子，并按降序排列它们以显示最新的第一个。

假设我们想在版权信息上方的网站页脚中显示我们的食谱帖子列表。 为此，我们将使用一段代码，在我们的例子中，它需要插入到<footer>元素开始下方的singular.php文件中。

 <?php $args = array( 'post_type' => 'recipes', 'post_status' => 'publish', 'orderby' => array( 'date' => 'DESC' ), ); $recipes = new WP_Query( $args ); if( $recipes->have_posts() ) { ?> <div class="recent-recipes"> <?php while( $recipes->have_posts() ) : $recipes->the_post(); ?> <div class="recipe"> <a href=""><?php get_post_permalink(); ?><h3><?php the_title(); ?></h3> <?php the_post_thumbnail( 'thumbnail' ) ; ?> </a> </div> <?php endwhile; wp_reset_postdata(); ?> </div> <?php } else { esc_html_e( 'No recipes found' ); } ?>

在此示例中，我们使用当前默认的 WordPress Twenty Twenty 主题。 如果您使用二十二十以外的主题，您应该编辑包含您的主题的页脚内容的文件。

添加代码后，我们可以打开我们的网站，我们应该会在页脚中看到我们的食谱帖子。

这些帖子在您的页脚中的布局和外观可以使用 CSS 设置为您希望的样式。 添加任何 CSS 的最佳位置是位于主题主文件夹下的style.css文件中。 我们有一些您可能想要在下面使用的 CSS。

 .recent-recipes h3 { font-size: 18px; margin: 15px 0; } .recipe { float: left; margin: 15px; } .recent-recipes { height: 240px; margin: 0 auto; width: 1190px; }

保存此 CSS 并刷新页面后，您应该会在页脚中看到食谱帖子的布局，如下所示：

重置循环的重要性

您可能已经注意到，在代码中定义了必要的参数之后，一个 post 循环以wp_reset_postdata()函数开始和结束。 此功能的使用非常重要，原因如下。

当 WordPress 创建页面布局时，它使用全局$post变量，如果页面中只有一个循环，该变量可以正常工作。 现在我们添加了自定义循环，我们基本上覆盖了全局$post变量，除非我们告诉 WordPress 循环重置，否则它将使用我们在循环中定义的自定义帖子类型从那里恢复。

让我们通过在上面的代码下呼应帖子标题来看看这在实践中是如何工作的，如下所示：

 <?php $args = array( 'post_type' => 'recipes', 'post_status' => 'publish', 'orderby' => array( 'date' => 'DESC' ), ); $recipes = new WP_Query( $args ); if( $recipes->have_posts() ) { ?> <div class="recent-recipes"> <?php while( $recipes->have_posts() ) : $recipes->the_post(); ?> <div class="recipe"> <a href=""><?php get_post_permalink(); ?><h3><?php the_title(); ?></h3> <?php the_post_thumbnail( 'thumbnail' ) ; ?> </a> </div> <?php endwhile; wp_reset_postdata(); ?> </div> <?php } else { esc_html_e( 'No recipes found' ); } ?> <?php the_title(); ?>

现在，如果我们刷新我们网站前端的页面，我们会在我们最近的食谱下看到“帖子 1”标题。

这是有道理的，因为我们使用wp_reset_postdata(); 功能。

现在，注释掉wp_reset_postdata(); 从你的代码。 你会注意到the_title(); 代码将回显“Recipe 1”标题而不是“Post 1”。

自定义帖子类型 - 进一步管理

为了进一步自定义我们的自定义帖子行为和外观，我们将查看一些选项，这些选项可以添加为我们在上一篇文章中用于注册我们的“食谱”帖子类型的代码的扩展。

 function recipes_post_type() { register_post_type( 'recipes', array( 'labels' => array( 'name' => __( 'Recipes' ), 'singular_name' => __( 'Recipe' ) ), 'public' => true, 'show_in_rest' => true, 'supports' => array('title', 'editor', 'thumbnail'), 'has_archive' => true, ) ); } add_action( 'init', 'recipes_post_type' );

我们将添加更多参数以便：

1. 更改食谱自定义帖子类型的 URL slug
2. 更改自定义帖子类型管理菜单的位置
3. 更改菜单图标

更改自定义帖子类型 URL Slug

如果我们创建一个食谱帖子并将其命名为“食谱 1”，那么“食谱 1”帖子的默认 URL 将类似于https://mycompanyname.com/recipes/recipe-1/ ，前提是永久链接设置为“在我们的固定链接设置中发布名称。

如果要更改“食谱自定义帖子类型”在 URL 中的显示方式，可以使用rewrite参数及其slug键。

正如我们从 URL 中注意到的，如果跳过此参数，默认值将是自定义帖子类型标签“食谱”。 例如，如果我们想将其更改为my-home-recipes ，我们必须通过编辑我们的代码片段来覆盖它，如下所示：

 function recipes_post_type() { register_post_type( 'recipes', array( 'labels' => array( 'name' => __( 'Recipes' ), 'singular_name' => __( 'Recipe' ) ), 'public' => true, 'show_in_rest' => true, 'supports' => array('title', 'editor', 'thumbnail'), 'has_archive' => true, 'rewrite' => array( 'slug' => 'my-home-recipes' ), ) ); } add_action( 'init', 'recipes_post_type' );

现在，如果您保存永久链接（刷新永久链接缓存）并再次查看您的食谱，您的 URL 应该是https://mycompanyname.com/my-home-recipes/recipe-1/

请注意，如果您更改 slug，您还必须在主菜单页面中将存档 URL 从/recipes/更改为/my-home-recipes/ 。

更改自定义帖子类型菜单定位

如果您希望将食谱菜单移动到不同的位置，您可以使用menu_position参数，如下所示：

 function recipes_post_type() { register_post_type( 'recipes', array( 'labels' => array( 'name' => __( 'Recipes' ), 'singular_name' => __( 'Recipe' ) ), 'public' => true, 'show_in_rest' => true, 'supports' => array('title', 'editor', 'thumbnail'), 'has_archive' => true, 'rewrite' => array( 'slug' => 'my-home-recipes' ), 'menu_position' => 5, ) ); } add_action( 'init', 'recipes_post_type' );

您可以用于此参数的值是：

0：在最顶端
5：以下帖子
10 : 媒体下方
15：以下链接
20：以下页面
25：以下评论
60 : 低于菜单中的第一个间隙
65：在插件下面
70：低于用户
75：在工具下方
80 : 低于设置
100 : 低于菜单中的第二个间隙

下面的屏幕截图显示了将值 5 添加到menu_position参数时菜单的位置。

更改自定义帖子类型菜单图标

目前，食谱菜单使用默认的帖子图标。 如果它有自己独特的图标，那就太好了。 为此，我们可以使用menu_icon参数。

 function recipes_post_type() { register_post_type( 'recipes', array( 'labels' => array( 'name' => __( 'Recipes' ), 'singular_name' => __( 'Recipe' ) ), 'public' => true, 'show_in_rest' => true, 'supports' => array('title', 'editor', 'thumbnail'), 'has_archive' => true, 'rewrite' => array( 'slug' => 'my-home-recipes' ), 'menu_position' => 5, 'menu_icon' => 'https://mycompanyname.com/wp-content/uploads/2020/10/recipes.svg', ) ); } add_action( 'init', 'recipes_post_type' );

要显示您自己的图标，您可以插入菜单图标位置的完整 URL（如上面的代码所示）或通过添加图标的类名来使用 WordPress Dashicons 库。 您可以在此处查看带有相应类的图标。

例如，如果您选择食物图标，您可以像这样将它添加到您的代码中'menu_icon' => 'dashicons-food' 。

 function recipes_post_type() { register_post_type( 'recipes', array( 'labels' => array( 'name' => __( 'Recipes' ), 'singular_name' => __( 'Recipe' ) ), 'public' => true, 'show_in_rest' => true, 'supports' => array('title', 'editor', 'thumbnail'), 'has_archive' => true, 'rewrite' => array( 'slug' => 'my-home-recipes' ), 'menu_position' => 5, 'menu_icon' => 'dashicons-food', ) ); } add_action( 'init', 'recipes_post_type' );

最终结果应该是您选择的图标出现在您的自定义帖子菜单中……帮助您的自定义帖子感觉，嗯，真正的自定义！

延伸阅读

使用插件创建 WordPress 自定义帖子类型
手动创建 WordPress 自定义帖子类型
使用您自己的插件创建 WordPress 自定义帖子类型！

结论

希望这些技巧能真正帮助您建立自己的自定义帖子类型，并让您进一步改进 WordPress 网站的功能和使用。 与所有编码一样，最好花一些时间试一试，看看您的新代码如何影响您的网站。 然后，在这些基础上构建将使您能够处理需要大量定制的更复杂的项目。