如何在 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-12-12
  • WordPress 教学

多语言表单有助于与全球观众沟通,使您的网站更易于使用,并吸引更多用户。本文介绍了如何使用WPForms和Formidable Forms插件在WordPress中创建多语言表单,以帮助您轻松实现这一目标。

閱讀更多
  • 2024-10-21
  • WordPress 教学

如果您在WordPress管理区域或其他地方遇到‘jQuery未定义’错误,不必担心,这是一个常见的问题。本文为您介绍了该错误的原因以及六种解决方法,以便让您的网站恢复正常运行。

閱讀更多
  • 2024-10-17
  • WordPress 教学

越来越多的人倾向于使用语音搜索而不是在搜索栏中输入关键词。语音搜索被认为是在线交互的未来,各种设备上数百万人每天都在使用它。与通过普通SEO优化网站一样,将网站适配语音搜索同样重要。在本文中,我们将深入探讨为什么语音搜索SEO如此重要,以及如何优化您的WordPress网站以捕获这些语音搜索。

閱讀更多

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