阅读时间 14 分钟 (2844 字)

自定义字段 - 第四集：一步步教程

四月

Marc Dechèvre

星期一，2020 年 4 月 20 日

12490 次点击

0 条评论

1. 简介

joomla-custom-fields

自从 Joomla 3.7 以来，可以轻松地给文章、联系人、用户添加额外的字段。这是通过新功能自定义字段实现的。

有 16 种标准字段类型可供选择，从文本字段、下拉菜单、日期选择到自定义 SQL 选择字段。

使用这些字段，您可以确保网站上的数据以结构化的方式输入。

然后可以自由地使用这些单独的输入来显示文章、联系人或用户。

作为管理员，您可以在 Joomla 中轻松创建和配置这些字段。
得益于众多选项，字段可以完全根据您的意愿排列，并在前端、后端或两者中可见。
在编辑内容时，字段可以分组并显示在标签页中。
还可以设置
- 字段的 ACL（访问控制列表，即访问权限）以便只有某些用户可以查看/编辑它们，
- 语言以确保字段只对特定语言可见。

在本教程中，您将了解 Joomla 中这个新强大的功能。您将创建一个基于 Joomla 的简单菜谱网站，使用文章添加额外的属性，如菜谱类型、配料、人数和准备时间。

result

2. 一步步

让我们用20个小小的简单步骤来完成。

2.1. 创建菜谱菜单和分类

在本教程中，我们从空白的Joomla安装开始，但您也可以在现有的Joomla网站上遵循这些步骤。首先，在Joomla菜单管理器中创建一个名为“菜谱”的新菜单项，并选择分类博客视图。自从Joomla 3.7以来，有一个方便的新功能是我们可以直接从菜单创建“菜谱”分类。因此，在创建相应的菜单项之前，不再需要先创建分类。

step1

2.2. 创建字段组

然后我们为项目创建新的“字段组”。我们在内容 > 字段组下进行此操作。我们将“菜谱”作为第一个字段组的标题，第二个为“配料”。您可以输入的可选描述将在编辑时显示在字段上方。这可以用作字段组的可能说明。

step2

2.3. 创建文本字段

现在字段组已经创建，我们可以开始添加字段。首先，我们为菜谱的准备时间创建一个字段。在内容 > 字段下，我们创建一个新的字段类型“文本（文本）”并将其标题设为“准备时间”。此标题会自动作为字段标签复制，但可以根据需要调整。我们还可以看到字段的各个选项，例如，我们可以设置字段是否为必填项。我们不为这个字段设置其他任何内容，但我们将字段分配给右侧的“菜谱”组并保存字段。一旦保存了字段，就不再可能更改其类型。（备注：如果您想更改类型，只需删除您的字段并创建另一个即可）

step3

2.4. 创建文章

现在我们已经创建了第一个字段，我们将通过添加一个菜谱作为文章来测试它。我们将准备步骤添加到文章的内容中，并在“图片和链接”选项卡中选择一个菜谱图片。在添加文章时默认可见的选项卡之间，现在还有一个“菜谱”选项卡。这是我们创建的字段组，我们还可以在那里看到“准备时间”字段。在此处输入菜谱准备时间并保存条目。

step4

2.5. 字段位置

如果我们现在在网站上查看菜谱，我们会看到准备时间显示在文章文本上方。对于每个字段，您可以在字段选项中设置“自动显示”。您可以选择几个选项，例如，“在标题之后”，“在显示之前”，“在显示之后”……以及“不自动显示”。尝试不同的选项，看看字段将在文章的哪个位置可见。

我们现在知道如何创建字段，以及它们在哪里在管理和网站上可见。现在是时候添加更多字段了。

step5

2.6. 创建列表字段

对于我们要添加的新字段“菜肴类型”，我们选择类型“列表（列表）”。此字段将生成一个下拉列表，您可以从预设的多个选项中选择。在“列表值”中，我们输入三个选项：“开胃菜”、“主菜”和“甜点”（备注：文本是显示的内容，值是写入数据库的内容，除非您知道自己在做什么，否则不要更改后者）。在将“多选”设置为“是”的情况下，还可以指定用户可以选择多个选项。我们还将此字段分配给“菜谱”字段组，以便它在文章选项卡下可见。

step6

2.7. 创建数字字段

我们可以选择的其他字段类型之一是“整数”（整数是一个简单的数字）。我们使用此字段类型生成一个自动的下拉列表。对于“第一个”，我们设置为“1”，对于“最后一个”，设置为“10”，对于“步长”，我们输入“1”。如果我们保存此字段并转到文章，我们会看到出现一个包含数字1到10的下拉列表。当然，我们也可以选择字段类型列表并自行输入所有数字。（备注：如果您想按降序显示从2019年到1900年的年份，可以将“第一个”设置为2019，“最后一个”设置为1900，“步长”设置为“-1”）

step7

2.8. 创建URL字段

为了能够输入菜谱的源URL，我们创建了一个类型为“URL”的字段。我们选择只允许“HTTP”和“HTTPS”链接，并在“协议”下选择这些选项。在“选项”选项卡下，“自动显示”我们选择“显示后”，使该字段出现在文章底部。还可以提供用于显示字段的类，但请从模板中已设置的类中选择。我们输入“muted”类作为“渲染类”。因为标准的Joomla模板（即Protostar）使用Bootstrap CSS框架的2.3版本，所以这个字段将显示灰色文字。（备注：当然，您始终可以使用任何“渲染类”的自己的CSS。）

step8

2.9. 创建编辑器字段

我们希望通过一个带有编辑器的字段输入菜谱的成分。为此，我们创建了一个新的类型为“文本编辑器（编辑器）”的字段，我们可以输入各种选项，例如编辑器的宽度和高度。这次我们将“字段组”设置为“成分”组。这使得在编辑文章时该字段在新标签页中可见。对于“渲染类”，我们输入“well well-small”，这使访客在网站上的成分列表以灰色背景的框中显示。

step9

2.10. 创建引用字段

我们创建的最后字段是一个类型为“文本”的字段，将在文章本身中添加一种引用。我们将“自动显示”设置为“不自动显示”，因为我们想将此字段放置在我们的菜谱中某个位置。我们将“显示标签”设置为“隐藏”，以便只显示字段的正文内容，而不是标签。

step10

2.11. 在文章中加载字段

现在我们已经创建了引用字段，我们可以在文章文本中想放置的位置加载它。我们通过将短标签“{field X}”放置在字段应可见的位置来完成此操作。当然，您应该将“X”替换为您要加载的字段的ID（编号）。如果您有一个字段ID为7，则必须将您的短标签键入为“{field 7}”。在编辑器中，我们还给予短标签“块引用”样式。如果我们现在已经为字段本身输入了引用并保存了文章，则它将在网站上选择的位置可见。（备注：还有一个“字段”按钮，允许您通过界面轻松选择字段，而无需知道其ID。）

step11

2.12. 设置字段顺序

在管理字段时，还可以设置字段的顺序。这是通过Joomla拖放原则实现的。如果您转到内容 > 字段，您可以在字段前面的三个黑色小方块上单击并拖放以相应地更改顺序。

step12

2.13. 将字段分配给类别

如果您的网站提供除菜谱之外的其他文章（如新闻文章），您可能不希望菜谱属性的字段组也显示在这些文章中。这可以通过为不应出现在所有文章中的字段设置类别来防止。在编辑字段时，在右侧您将看到“类别”选项，您可以从中选择一个或多个类别。因此，如果您希望，您可以轻松地为每个类别创建特定的字段。

step13

2.14. 设置字段可见性

对于每个字段或字段组，您可以通过“访问”选项卡设置访问级别，该选项卡也适用于项目、菜单项和模块等。例如，我们希望能够仅向网站成员显示成分。我们通过将“成分”字段的“访问”设置为“注册”来实现这一点。在网站上，除非您登录，否则您将不再在文章中看到成分。如果您登录，您将再次看到该字段。

step14

2.15. 向访客显示字段

对于未登录用户，我们确实希望显示一个需要登录才能查看成分的文本。因此，我们创建了一个新的“文本编辑器（编辑器）”类型字段，并输入以下文本

<p>Log-in to view the ingredients under the option "Default value". No account yet? Create one!</p>

这样我们就无需为每篇文章重新输入文本。我们还将（i）将“访问权限”设置为“访客”，（ii）选择“成分”字段组（iii）并在“渲染类”中输入“well well-small”。只要您未登录，此字段在网站上就会可见。

step15

2.16. 编辑权限

除了设置可见性外，还可以设置哪些用户组可以编辑字段的内容。在“权限”选项卡下，您可以允许或拒绝“编辑自定义字段值”操作。这可以按字段调整，也可以按字段组调整，这样就不必为每个字段设置。这样，您可以允许用户组编辑文章，而无法编辑某些特定字段。例如，如果您想设置一个文章发布工作流程，其中一组可以编辑食谱的描述但不能编辑某些特定字段，这将很有用。

step16

2.17. 创建模板覆盖

字段现在都可见了，但我们希望将成分显示在文章的左侧。我们可以在扩展 > 模板 > 模板下创建一个模板覆盖来实现这一点。在那里打开活动模板，并转到“创建覆盖”选项卡。然后单击“com_content > article”。Joomla现在已创建覆盖，我们可以通过在文件夹HTML > com_content > article > default.php下的“编辑器”选项卡中找到它来进一步自定义它。

（NDLR：如果您不重命名那个“default.php”文件，那么它将适用于网站上的所有文章。如果您想有多个布局，只需将文件重命名为recipe.php等。然后，在您想使用该布局的每篇文章中，只需在“选项”选项卡下选择布局。或者，如果您有很多文章，创建或编辑指向您希望访问的类别的菜单项（分类博客或分类列表），并在“选项”选项卡下选择布局。该菜单项甚至可以隐藏。它仍然适用于获取所有相关文章的正确布局）

step17

2.18. 调整文章视图

在这个文件中，我们查找以下行

<?php echo $this->item->text; ?>

（显示文章的内容）并将其替换为

<div class="row-fluid">
    <div class="span4"></div>
    <div class="span8">
        <?php echo $this->item->text; ?>
    </div>
</div>

保存此更改后，我们在网站上看到文章文本已移至右侧，右侧有空间显示成分字段。具有class span4的div现在为空。

（NDLR：同样，这些现成的class span4和span8来自Bootstrap v2.3，这是Protostar使用的。）

如果您的模板使用

Bootstrap v3.x，将其替换为col-md-4和col-md-8
Bootstrap v4.x，将其替换为col-4和col-8

step18a

step18b

step18

2.19. 通过模板覆盖显示字段

为了在空白处显示成分字段，我们必须放置一段代码，以确保字段在空div中显示。所以我们放置这段代码

<?php if (isset($this->item->jcfields[X])): ?>
    <?php echo $this->item->jcfields[X]->value; ?>
<?php endif; ?>
<?php if (isset($this->item->jcfields[Y])): ?>
    <?php echo $this->item->jcfields[Y]->value; ?>
<?php endif; ?>

在这里，您将“X”替换为步骤9中的成分字段ID，将“Y”替换为步骤15中的字段ID，即访客未登录时可见的字段。

（NDLR：根据您的需要，您甚至可以删除“if (isset)”条件，在这种情况下，您只需有

<?php echo $this->item->jcfields[X]->value; ?>
<?php echo $this->item->jcfields[Y]->value; ?>

您会看到成分字段现在在文章上方和侧边栏中显示。因此，在字段的选项中，我们将“自动显示”设置为“不自动显示”，这意味着字段仅在侧边栏中可见。

（NDLR：我们对原始示例的代码进行了简化，原始示例的代码是）

<?php if (isset($this->item->jcfields[X])): ?>
    <?php echo FieldsHelper::render('com_content.article', 'field.render', array('field' => $this->item->jcfields[X])); ?>
<?php endif; ?>
<?php if (isset($this->item->jcfields[Y])): ?>
    <?php echo FieldsHelper::render('com_content.article', 'field.render', array('field' => $this->item->jcfields[Y])); ?>
<?php endif; ?>

（当然也可以工作）

step19

2.20. 继续按照您的喜好进行样式设置

视图现在几乎是我们预期的样子。我们只是想让字段标签更加清晰。所有字段的标签都添加了“field-label”类。因此，我们可以通过CSS进行调整。我们在模板中添加CSS使标签加粗（NDLR：在Protostar的情况下，您可以在文件夹/templates/protostar/css中创建自己的自定义CSS文件，只需将其命名为user.css即可）

.field-entry .field-label {
    font-weight: bold;
}

我们的食谱的显示现在已经准备好了，您已经了解了如何通过模板覆盖（或备用布局）轻松扩展Joomla文章并进一步设计您的页面。

step20

是时候开始在您的Joomla网站上使用自定义字段啦！ ;)

3. 文档

关于自定义字段的官方Joomla文档可以在以下位置找到：

https://docs.joomla.org/J3.x:Adding_custom_fields

4. 字段是Joomla插件

创建字段时，您可以选择16种不同类型。这些字段都是独立的插件。如果您转到扩展 > 插件并按类型“字段”筛选结果，您将再次看到所有字段。因此，您可以禁用某些插件，从而使某种类型的字段不可用。您也可以在插件中输入字段的常规设置。这可以防止您每次都为字段设置相同的设置。

framework-plugins

因为字段是插件，所以作为开发者，您也可以创建自己的字段插件，并在网站上提供新的字段类型。Joomla扩展目录（或Github /…）中定期出现一系列新扩展，提供新的字段类型作为功能。例如，Google Maps / OpenStreetMap、YouTube/Vimeo或相册字段，您可以使用它们轻松地将地图、嵌入视频或照片相册添加到文章中。