WordPress使用本地自定义字段(5个有用例子)

WordPress的自定义字段是任意的数据位,你可以应用到WordPress的帖子、页面和自定义帖子类型。元数据,就像它一样,以键/值对的形式。例如。

  • 键。 subtitle / 值。They are more than they are cracked up to be
  • 键。 header_color_override / 价值。#e52e05
  • 钥匙。 property_url / 价值。https://example.com/123

WordPress有他们自己的关于这个功能的文档,所以我不是要复制那个。我只是想向你展示WordPress中的自定义字段是什么,它们是如何工作的,如何使用它们,以及我个人经验中的一些使用案例。

如何在WordPress中添加/编辑/删除自定义字段

WordPress中自定义字段的用户界面是这样的。

Showing that Custom Fields in WordPress appear below the content area of the block editor in the admin user interface.

如果你没有看到它,可能你需要在三点菜单下,偏好,然后找到自定义字段的开关,把它打开。

Showing the option to enable Custom Fields in WordPresss in the Block Editor Preferences settings. It is at the first toggle beneath the Additional settings.

在打开和关闭该功能时,用户界面会强制你刷新页面。

要添加一个自定义字段,键入键(标有 "名称")和值,然后点击添加自定义字段

Showing a Custom Field in WordPress with a name of favorite_food and a value of burrito. There a button below the name input to add the custom field.

添加后,你可以通过键/名下面的按钮删除或更新它。

Showing a Custom Field in WordPress with a name of favorite_food and a value of burrito. There are two buttons below the name to delete or update the custom field.

在你使用自定义字段后,键将形成一个下拉菜单,以方便选择。

Showing the dropdown menu that opens when clocking on the Name field of a custom field in WordPress, allowing you to select an existing custom field.

为什么使用自定义字段?

自定义字段,连同自定义帖子类型,是使WordPress成为一个开箱即用的 内容管理系统原因,而不是局限于一个简单的博客平台。

在CSS-Tricks上,不管你信不信,我们在这个网站上使用了超过100个自定义字段来做不同的事情。我们倾向于在相对简单的事情上使用它们,这很好,因为它是WordPress的一个核心功能,将永远工作下去,而不用太担心兼容性或尴尬的技术债务。

这个大的想法是为了打开模板的可能性。想象一下,你有一个房地产列表的页面,它有。

  • 地址
  • 房源价格
  • 卧室
  • 卫生间
  • 等等。

有了自定义字段,你就可以把所有这些信息作为谨慎的小块数据来使用,你可以在任何需要的地方呼应(即显示)到一个页面模板中。这比把所有的数据放在文章内容本身要灵活得多,即使是用块状编辑器也是如此。

WordPress自定义字段使用案例

WordPress的自定义字段可以用来做很多不同的事情!但是,让我们看一下五个例子。但是,让我们看看我们在CSS-Tricks这里实现的五个实际用例。

1.显示额外的信息

假设你正在发布一个视频,并希望显示该视频的运行时间。这很简单,只需将running_time ,并在你想显示的地方显示出来即可。

A side-by-side showing a published post on the left with the running time of a video circled in red, and the WordPress admin on the right with the running time custom field circled in the block editor showing the exact same information that is published in the post.

注意这里使用的其他自定义字段,如youtube 字段,我们有这个字段,这样我们就可以在哪里输出

2.隐藏/显示不同的内容/功能

比方说,你想在不同的博客文章中有时能够折叠评论区。你可以设置一个名为should_toggle_comments 的自定义字段,并设置一个值为true 。这就是我们在CSS-Tricks上的做法。在我们的comments.php 模板中,我们输出一个所有评论的<ol> ,但是如果这个自定义字段在那里,我们就把整个字段包裹在一个<details> 元素中,默认折叠它。

<?php if (get_post_meta($post->ID, 'should_toggle_comments', true)) { ?>
<details class="open-all-comments">
  <summary>Toggle All Comments (there are a lot!)</summary>
  <?php } ?>

    <ol class="commentlist" id="commentlist">
      <?php wp_list_comments('type=comment&avatar_size=512&callback=csstricks_comment'); ?>
    </ol>

  <?php if (get_post_meta($post->ID, 'should_toggle_comments', true)) { ?>
  </details>
<?php } ?>
复制代码

3.特殊的拉引号

假设你有一个特殊的Category档案,显示一组包含相同类别的帖子,那么为这个类别使用一个自定义模板,如category-fancypants.php 。也许你从每篇文章中拉出一个自定义引语,作为一个自定义字段,称为main-pullquote

<blockquote>
  <?php
    echo get_post_meta($post->ID, 'main-pullquote', true);
  ?>
</blockquote>
复制代码

这就是我们为我们的年度年终系列所做的。

A side by side showing the the main pull quote custom field in WordPress circled in red, and the category archive on the right with a red arrow pointing to the corresponding pull-quote that displays on the page.

4.定制一个RSS提要

我们在CSS-Tricks上建立了几个完全自定义的RSS源,与WordPress提供的不同--一个用于视频,一个用于新闻简报。特别是视频源,它依赖于一些WordPress的自定义字段来输出特殊的数据,这些数据是使该源作为我们的视频播客的源所需要的。

Side by side showing the rss videos template in code on the left with the custom field part circled in red, and the RSS feed open in the browser on the right with an arrow pointing to where the corresponding code renders as the video enclosure.

视频的位置和持续时间都被保存在自定义字段中。

5.隐藏/显示作者

我们在CSS-Tricks上的赞助文章有时写得很像某公司的公告。他们是故意这样写的,而且在实际发布的时候,很可能是由多个人写的。这样的帖子其实不需要 "由 "人写。但有时赞助文章肯定是由一个特定的人写的,甚至有时是以第一人称写的,如果不显示署名就会很奇怪。这就是为什么我们使用一个showSponsorAuthor 自定义字段,如果我们需要的话,可以显示该作者。

<div class="sponsored-post-byline">
  ❥ Sponsored
  <?php if (get_post_meta($post->ID, 'showSponsorAuthor', true)) { ?>
    (Written by <?php the_author(); ?>)
  <?php } ?>
</div>
复制代码

上面是一个模板的一部分。我们总是在署名中把一篇赞助的文章标记为赞助(例子),但我们只是选择性地显示作者(例子),由一个自定义字段控制。

在WordPress中显示自定义字段的API

最常见的是,你想显示一个单一字段的值。

<?php echo get_post_meta($post->ID, 'mood', true); ?>
复制代码

true 结尾的意思是 "给我一个单一的值",这意味着即使有多个同名的自定义字段,你也只能得到一个。要获得多个同名的字段,请使用false ,如。

<?php $songs = get_post_meta($post->ID, 'songs', false); ?>
<h3>This post inspired by:</h3>
<ul>
  <?php foreach($songs as $song) {
    echo '<li>'.$song.'</li>';
  } ?>
</ul>
复制代码

如果你想把它们全部倒出来(可能主要是对调试有用),你可以这样做。

<?php the_meta(); ?>
复制代码

不过,请注意,这将跳过以下划线开头的自定义字段 (_),所以你可以考虑用这种方法。

查询WordPress中的自定义字段

假设你想查询所有有某些特定自定义字段的帖子。这是有可能的。

<?php
$the_query = new WP_Query(array(
  'meta_key' => 'example_field_name'
  'meta_value' => 'example_field_value' // as a string! 
));

if ($the_query->have_posts()) {
  while ($the_query->have_posts()) {
    $the_query->the_post();
    echo '<div>' . get_the_title() . '</div>';
  }
}

wp_reset_postdata();
复制代码

上面的例子将运行一个查询,查询同时具有example_field_name 自定义字段和该字段的值为example_field_value 的帖子。 你可以做任何一种。

在这里你可以做的还有很多。你可以使用比较法,你可以获得数字值,甚至可以一次查询多个字段。我们在《基于自定义字段的循环/查询》中详细介绍了所有这些。

在名称下拉中限制自定义字段

在WordPress中,现有的自定义字段的用户界面下拉菜单的上限是30个字段。所以,如果你有超过100个不同的键,下拉菜单将看起来被任意切断。你可以用 functions.php 中的一个过滤器或一个插件来增加这个数量。

function customfield_limit_increase( $limit ) {
  $limit = 150;
  return $limit;
}
add_filter( 'postmeta_form_limit', 'customfield_limit_increase' );
复制代码

还有什么其他块状编辑器的问题吗?

主要的问题是当你完全看不到自定义字段的用户界面。我们介绍了如何将其重新打开(因为它可能默认为关闭),所以要经常检查。高级自定义字段插件也会将其关闭,所以如果你使用该插件,请注意下面有一行可以帮助将其重新打开(如果你像我们一样同时使用这两个插件的话)。

我不确定是否有一个标准的方法来显示块编辑器中的自定义字段的值。如果你知道一个明确的方法,请留下评论!

与高级自定义字段的关系

在WordPress中,原生的自定义字段的用户界面是相当......不足的。它不花哨,它有粗糙的边缘(例如,我们发现自定义字段有一个奇怪的方式,在多个帖子保存时重复自己)。看起来自定义字段,虽然是原生的,但并不是WordPress的一个特别一流的功能。

高级自定义字段(ACF)在很大程度上改变了这一点。其精神仍然是一样的:将数据附加到内容上。但不是我们所详述的简单的基于字符串的键值接口,你基本上是用不同的类型对数据进行建模,它为你建立了非常好的自定义用户界面来输入数据,甚至直接与块编辑器集成。

想象一下一个播客网站,每个帖子都是一个单独的情节。块状编辑器可能对关于这一集的书面内容很好,但对与之相关的所有元数据可能不是一个好主意。客人名单,持续时间,MP3文件的位置,赞助商,时间跳转链接,等等。自定义字段是很好的选择,但由于有这么多的字段,你可以在这里使用高级自定义字段,而不是使用WordPress中的原始自定义字段。这里有一个设置的例子,就像我们在ShopTalk Show播客中做的那样,你会得到什么。

Side by side showing the settings for custom fields in the Advanced Custom Fields plugin on the left, and those custom fields displayed on the right in the  WordPress Block Editor of a new post.

ACF,可能是为了鼓励直接使用它,而不是用原生的自定义字段界面来混淆人们,删除了原生的自定义字段界面。如果你像我们一样,同时使用两种类型的字段,你需要用ACF提供的过滤器把本地自定义字段的用户界面带回帖子编辑器。

add_filter('acf/settings/remove_wp_meta_box', '__return_false');
复制代码

如果你在WordPress中使用本地自定义字段,你会希望在你的functions.php 文件或功能插件中使用。

插件开发者的注意事项

使用下划线隐藏技术。

一些插件使用自定义字段API作为存储帖子特定数据的地方。我认为这是可以的,但我想恳请插件开发者在这样做的时候总是使用下划线和插件前缀的自定义字段名。

当自定义字段以下划线开始时,它们不会显示在用户界面中。这意味着对于我们这些直接使用自定义字段用户界面的人来说,它不会被其他插件创建的字段弄得很混乱。当然,例外的是,如果你想让用户能够控制插件对自定义字段值的处理。在这种情况下,好吧,留下那几个非underscore前缀的字段。

_bobs_plugin_internal_value_1 // Hidden in UI
_bobs_plugin_internal_value_2 // Hidden in UI
bobs_plugin_config  // Shows in UI

_adrians_plugin_internal_value_1  // Hidden in UI
_adrians_plugin_internal_value_2 // Hidden in UI
作者:前端小工
来源:稀土掘金
THE END