如何在 WordPress 中添加短代码 (初学者指南)

02/14/2024

什么是短代码?

WordPress 的短代码是代码快捷方式,可以帮助您在 WordPress 文章、页面和侧边栏小部件中添加动态内容。它们显示在方括号内,如:[myshortcode]

为了更好地理解短代码,让我们来看看它们被添加的背景。WordPress 会过滤所有内容,以确保不会有人在文章和页面内容中插入恶意代码。这意味着您可以在文章中编写基本的 HTML,但不能编写 PHP 代码。

但是,如果您想在文章中运行一些自定义代码以显示相关文章、广告横幅、联系表单、画廊或其他内容呢?这就是短代码 API 的用武之地。

基本上,它允许开发人员将代码添加到一个函数中,然后将该函数注册为 WordPress 短代码,这样用户就可以轻松使用它们,而无需任何编码知识。当 WordPress 找到短代码时,它会自动运行与之关联的代码。

在 WordPress 文章和页面中添加短代码

首先,您需要编辑要添加短代码的文章或页面。然后,您需要点击添加块按钮 ‘+’,以插入一个短代码块。

添加短代码块后,您只需在块设置中输入您的短代码。短代码通常由您使用的各种 WordPress 插件提供,例如用于联系表单的 WPForms 或用于电子邮件营销的 OptinMonster。

在 WordPress 侧边栏小部件中添加短代码

您也可以在 WordPress 侧边栏小部件中使用短代码。只需访问外观 » 小部件页面,并将一个‘短代码’小部件块添加到侧边栏中。

现在,您可以将您的短代码粘贴到小部件的文本区域中。别忘了点击‘更新’按钮以保存您的小部件设置。然后,您可以访问您的 WordPress 网站,查看侧边栏小部件中短代码的实时预览。

在旧版 WordPress 经典编辑器中添加短代码

如果您仍在使用旧版经典编辑器,这里是如何在文章和页面中添加短代码的方法。只需编辑您要添加短代码的文章或页面,然后将短代码粘贴到内容编辑器中的任何位置。确保短代码在其自己的行中。不要忘记保存您的更改,然后查看文章或页面预览,查看短代码的效果。

在 WordPress 主题文件中添加短代码

虽然短代码主要用于 WordPress 文章、页面和小部件中,但有时您可能希望在 WordPress 主题文件中使用短代码。WordPress 使得这一操作变得简单,但您需要编辑 WordPress 主题文件。如果您之前没有做过,可以参照我们关于如何在 WordPress 中复制粘贴代码的指南。实际上,您可以通过添加以下代码,将短代码添加到任何 WordPress 主题模板中:

<?php echo do_shortcode('[your_shortcode]'); ?>

WordPress 现在会查找短代码并在您的主题模板中显示其输出。

在块主题文件中使用全站编辑器添加短代码

如果您正在使用块主题,那么使用全站编辑器在 WordPress 主题文件中添加短代码会更容易。您可以通过选择 WordPress 仪表板中的外观 » 编辑器来访问此工具。默认情况下,您将看到主题的主页模板,您可以通过选择‘模板’选项切换到其他模板。

选择模板后,您可以通过在编辑器右侧窗格中单击开始编辑。此时,编辑器将充满整个屏幕。现在,您可以点击‘+’块插入图标并搜索短代码块。然后,您只需将其拖到模板上,并输入您想使用的短代码。不要忘记点击屏幕顶部的‘保存’按钮,以保存您的更改。

创建自定义短代码

短代码在您希望在 WordPress 文章和页面中添加动态内容或自定义代码时非常有用。然而,如果您希望创建自定义短代码,则需要一些编码经验。如果您熟悉编写 PHP 代码,可以使用以下示例代码作为模板:

// function that runs when shortcode is called
function wpb_demo_shortcode() {

// 您想要执行的操作。
$message = 'Hello world!';

// 输出需要返回
return $message;
}
// 注册短代码
add_shortcode('greeting', 'wpb_demo_shortcode');

在这段代码中,我们首先创建了一个函数,该函数运行一些代码并返回输出。然后,我们创建了一个名为‘greeting’的新短代码,并告诉 WordPress 运行我们创建的函数。您可以手动将此代码添加到主题的 functions.php 文件中,或者使用代码片段插件如 WPCode。

完成后,您可以使用以下代码在文章、页面和小部件中添加此短代码:[greeting]。它将运行您创建的函数并显示预期输出。

短代码与 Gutenberg 块

用户经常问我们关于短代码与 Gutenberg 块的区别。基本上,块允许您以更用户友好的方式做与短代码相同的事情。

不需要用户添加显示动态内容的短代码,块使用户能够通过更直观的用户界面在文章/页面中添加动态内容。许多流行的 WordPress 插件已经转而使用块而不是短代码,因为它们更适合初学者。

我们已经汇总了一些最有用的 Gutenberg 块插件,您可能希望尝试。如果您想创建自己的自定义 Gutenberg 块,可以按照我们的逐步教程在 WordPress 中创建自定义 Gutenberg 块。

我们希望这篇文章帮助您学会如何在 WordPress 中添加短代码。您可能还想参考我们的指南,了解如何在不编写任何代码的情况下创建自定义 WordPress 主题,以及我们专家推荐的最佳拖放式 WordPress 页面构建器插件。如果您喜欢这篇文章,请订阅我们的 YouTube 频道,观看 WordPress 视频教程。您也可以在 Twitter 和 Facebook 上找到我们。



Related Posts

  • 2024-08-04
  • WordPress 教学

不喜欢 WordPress 4.3 引入的格式化快捷键?觉得有点烦人?最近,有用户问我们如何在 WordPress 中禁用视觉编辑器格式化快捷键。在本文中,我们将向您展示如何做到这一点。

閱讀更多
  • 2024-07-31
  • WordPress 教学

你在 WordPress 网站上看到 503 服务不可用错误吗?503 错误是因为服务器无法处理请求,通常是由于服务器过载或维护。而这个错误不会告诉你具体原因,这对于初学者来说非常令人沮丧。本文将向你展示如何修复 WordPress 中的 503 服务不可用错误。

閱讀更多
  • 2024-07-30
  • WordPress 教学

管理一个企业需要大量的工作。如果您无法正确维护您的 WordPress 网站,可能会迅速看到流量和销售额下降的现象。幸运的是,您可以聘请虚拟助手 (VA) 来帮助管理您的网站。本文将教您如何聘请 WordPress 虚拟助手,以便您可以专注于业务中最重要的活动。

閱讀更多

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
>