如何在 WordPress 中创建和使用自定义字段

已发表: 2016-09-22

WordPress 自定义字段是扩展您网站上典型帖子或页面内容的好方法。 它们是附加到您的 WordPress 网站上的帖子或页面的元数据,这意味着通过使用此方法,您可以将任何类型的附加信息添加到您的内容中。

以键/值格式组织,自定义字段用于跨多个帖子或页面添加数据。 键是提供一致性并标识特定字段的名称,例如“项目”。 这总是一样的。 值是将在字段中显示的信息。 不同帖子的值会有所不同,具体取决于输入的信息。

在帖子中添加自定义字段

以下步骤将向您展示如何在帖子中使用自定义字段。 如果您更愿意在页面上使用它们,同样的想法将适用,但必须在负责构建页面而不是帖子的模板文件中实现。

1. 转到帖子编辑器屏幕并检查“自定义字段”。

自定义字段选项

2. 找到自定义字段框作为帖子编辑的一部分。 当您在帖子页面上时,您会在底部看到一个新部分,标题为“自定义字段”。

自定义字段在后

现在让我们看一个非常基本的 WordPress 自定义字段示例。 健身博客的这个例子将让事情变得更加美好。 我们将使用自定义字段来跟踪和列出帖子上的各种类型的身体活动。

3. 添加键,在本例中为“锻炼类型”。 我们将使用此框向帖子添加特定详细信息。 单击“输入新”并在字段中键入密钥。

4. 增加价值。 让我们和尊巴一起去吧。 请记住,这只会出现在这个特定的帖子上。 在不同的帖子中,您可以输入不同的值,例如“椭圆”或其他类型的锻炼。

type-of-exercise-01

5. 保存帖子。

在这一刻,你实际上不会看到太多。 您仍然需要添加一些格式来显示信息。 到目前为止,这些附加信息都存储在数据库中,因此可以调用它来显示。 对于本教程,我选择在帖子(而不是页面)上显示这些自定义字段,因此我将通过最基本的方式来格式化所有内容。

如何使用 CMB2 创建自定义元框

几年前,我一直在寻找一种方法来查询帖子并在 Google 地图上显示帖子的位置。 在我的研究中,我偶然发现了一篇关于如何建立商店的博客文章...

在帖子上显示自定义字段

使用模板修改将自定义字段添加为重复站点数据是一种有效的处理方式。 假设您首先在帖子的开头显示自定义字段,但后来决定它在底部看起来会更好。 通过使用模板修改,该更改很容易进行,因为更改模板将更新整个站点。 如果您不使用此方法,而是将信息单独保存在每个帖子中,则您必须编辑每个帖子以进行更改,从而使更改变得更加困难。

对于这个例子,自定义字段将显示在帖子之前,因此读者可以在阅读整个帖子之前正确地看到练习类型。 为了以这种方式显示它,数据将在 WordPress 循环之前被调用。

注意:这些自定义当然应该在子主题中完成,我们将使用single.php文件。 与往常一样,此类定制最好在开发环境中进行测试。

1. 打开single.php文件并在 WordPress 循环之外添加以下代码:

<?php the_meta(); ?>

它将显示如下内容:

自定义字段 1

如果您希望将其显示在页面的其他位置,请尝试将该代码段放在循环中或循环之后。 例如,通过将函数放在<main>标记内,自定义字段信息将显示为主要内容的一部分。

<div id="primary" class="content-area">
     <main id="main" class="site-main" role="main">

此方法还可以显示您创建的其他自定义字段。

关于这个例子有一点要提一下:子主题是从非常流行的 WordPress 25 父主题创建的。 如果您正在尝试在何处显示自定义字段,除了single.php文件之外,您的子主题中可能还需要其他模板。 为了在帖子中显示信息,将content.php添加到子主题中。 上面的代码片段被放置在页面内容中,因此它作为帖子的一部分出现。

儿童主题

2. 设置字段样式。 如果您转到检查器,您会看到页面中添加了一些新类。

以下是使用两个不同自定义字段的示例:

作为列表使用非常简单。 通过一些样式,它看起来会与网站的风格更加融合。 只需几个简单的 CSS 修改,我们就可以调整文本颜色和列表样式。

ul.post-meta li {
	color: #898989;
	list-style-type: none;
}

ul.post-meta li span.post-meta-key {
	color: #1fc3d2;
	font-weight: bold;
}

风格定制

更多自定义字段自定义

前面示例中的样式可以正常工作,但我们要做的还有更多。 以下示例将向您展示如何使用特定用例的其他显示选项调整自定义字段。 将自定义字段作为帖子的一部分阅读并使用有用的标题设置上下文将是帖子的一个很好的补充。 如果您是一步一步来的,请务必注释掉<?php the_meta(); ?> <?php the_meta(); ?>您在上一个示例中添加的。

对于这个例子,事情已经稍微修改了。 密钥已简化为“练习”,因此可以更轻松地将其添加到模板中,并且代码片段已添加到子主题的 content.php 文件中,因此它将出现在帖子内容中,而不是之前或之后.

<?php $exercises = get_post_meta($post->ID, 'exercises', false); ?>
<h3>Today’s exercise:</h3>
<ul>
<?php foreach($exercises as $exercise) {
echo '<li>'.$exercise.'</li>';
} ?>
</ul>

自定义字段现在以列表格式显示在标题为“今天的练习:”的下方。 这已设置为<h3>但可以轻松调整为另一种标题或段落样式。 如果您不希望它采用列表格式,也可以按照您的意愿进行结构化。

示例-02

有条件的自定义字段

有时可能不包含自定义字段。 比如说,有一个帖子没有锻炼价值。 这将允许您显示后备信息,因此它不只是留空。

<?php $exercises = get_post_meta($post->ID, 'exercises', true); ?>

<h3>Today’s exercise:</h3> 
<ul>
<?php if ($exercises) { ?> 

<?php echo '<li>' .$exercises. '</li>'; ?>

<?php } //if there is nothing for exercises then display

else { ?>

<li>Today was a rest day.</li>

<?php } ?>
</ul>

示例-03

高级自定义字段插件

通过遵循该教程,您可以轻松启动并运行自定义字段。 如果您更愿意使用插件来添加自定义字段,那么也有可用的选项。 高级自定义字段是一个非常受欢迎的选项。 这取代了 WordPress 中的默认自定义字段界面。 从本教程创建的最终产品也可以使用此插件创建。

字段组

高级自定义字段插件允许字段组,值得一提,因为它们与上述教程密切相关。 本质上,我们创建了一个非常基本的迷你字段组版本。 高级自定义字段组包含自定义字段、位置规则和显示选项。 每个字段组将使用其位置规则在需要时在正确的位置显示字段。 与手动操作方式一样,这些显示选项允许您根据需要自定义页面。 这个插件有很多字段组可供选择。

字段组 acf

这几乎没有触及这个插件可以做什么的表面。 要全面了解情况,请务必访问高级自定义字段网站。

自定义字段是 WordPress 开箱即用的功能。 只需对模板进行一些修改,您就可以轻松地将此功能添加到您的网站。 这些步骤涵盖了基础知识,通过一些实验,您将对如何实现自定义字段有一个清晰的了解。 在规划下一个项目时,请务必考虑自定义字段提供的灵活性。 它们可以容纳各种类型的内容,同时可以轻松地进行站点范围的更改。