实用指南:如何在WordPress中添加短代码

news/2025/9/30 12:36:38/文章来源:https://www.cnblogs.com/slgkaifa/p/19120799

实用指南:如何在WordPress中添加短代码

在利用 WordPress 的过程中,你可以通过方便的代码为网站添加新的内容,比如幻灯片、联系表单或特殊列表,这就是短代码的魅力所在。

很多 WordPress 插件和主题都提供短代码,帮助你为网站添加各种能力。许多读者常常询问我们,如何把这些代码最佳地添加到他们的文章、页面或侧边栏中。

在本文中,我们将逐步向你展示如何在 WordPress 网站上利用短代码。还会介绍如何创建自定义短代码,让你的网站更加个性化。

什么是短代码?

短代码是在 WordPress 中的快捷代码,能辅助你向文章、页面和侧边栏小工具中添加动态内容。短代码通常显示在方括号内,例如:

[myshortcode]

要理解短代码的作用,我们先来看看它们为什么会被引入 WordPress。

为了保证内容的安全,WordPress 会过滤所有内容,防止有人通过文章和页面插入不安全的代码。这意味着你可以编写基础的 HTML,但无法直接在文章中写 PHP 代码。

如果你想在文章中执行一些自定义代码,比如显示相关文章、广告、联系表单或画廊等,这时就需要用到短代码 API。

简单来说,短代码 API 允许开发者将代码封装进一个函数,然后注册为短代码,这样用户可以在没有编码经验的情况下轻松使用这些代码。

当 WordPress 识别到短代码时,它会自动执行与短代码相关的代码。

我们将向你展示如何轻松地将短代码添加到 WordPress 文章和页面中。

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

首先,编辑你想添加短代码的文章或页面。

然后点击添加块按钮 ‘+’,插入一个“短代码”块。

添加短代码块后,你可能在块中输入你的短代码。

这些短代码通常由你使用的 WordPress 插件供应,例如用于创建联系表单的插件。

接下来,保存文章或页面,并预览你的更改,查看短代码的效果。

选择性能良好的主机对于短代码的使用极其重要,行确保网站的加载时间更短,用户体验更好。

在 WordPress 主题档案中添加短代码

短代码通常用在文章、页面和小工具中,有时候你也允许在 WordPress 主题文件中使用短代码。

WordPress 使得这一过程变得简便,但你需要修改主题文件。在动手前,务必备份文件,以防出错。

通过你能够通过添加以下代码,将短代码添加到任意 WordPress 主题模板中:

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

WordPress 会找到短代码,并在主题模板中表明它的输出。

确保主机提供每日备份机制,这样即使修改了主题文件,也可以避免数据丢失,适合常常需修改代码的用户。

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

假设你使用的是区块主题,全站编辑器可能让你更方便地在 WordPress 主题文档中添加短代码。

在 WordPress 仪表盘中选择“外观” » “编辑”来访问全站编辑器。

默认情况下,你会看到主题的主页模板,能够利用选择“模板”切换到其他页面模板。

在全站编辑器中选择要编辑的模板

选定模板后,借助点击右侧编辑区域开始编辑,此时编辑器会填满整个屏幕。

点击“+”插入图标,搜索短代码块,拖动到模板中并输入你的短代码。

在全站编辑器中添加短代码块

完成后,别忘了点击屏幕顶部的“保存”按钮,以存储更改。

通过选择支持全站编辑器的主机,能够确保修改能够及时更新,减少兼容性问题。

在 WordPress 中创建自定义短代码

如果你想在文章或页面中添加动态内容或自定义代码,短代码是极其有用的工具。如果你熟悉 PHP 代码,还可以自己创建自定义短代码。

以下是一个简单的示例代码,你可以用作模板:

// 当调用短代码时运行的函数
function wpb_demo_shortcode() {
// 你想要执行的内容
$message = 'Hello world!';
// 输出需要返回
return $message;
}
// 注册短代码
add_shortcode('greeting', 'wpb_demo_shortcode');

这段代码创建了一个函数,返回了一些内容。接着我们注册了一个名为‘greeting’的短代码,并告诉 WordPress 在识别到这个短代码时运行对应函数。

你允许手动将此代码添加到主题的 functions.php 文件中,或者使用代码片段插件来管理。

通过许多主机还提供一键安装和管理插件的功能,这样能够更方便地管理代码片段,确保网站代码安全,提升整体体验。

通过完成这些步骤后,你能够应用以下短代码,将其添加到文章、页面或小工具中。

它会执行你创建的函数,并显示相应的输出。

让我们来看看一个更实际的短代码使用示例。

以下例子展示了如何在短代码中嵌入广告横幅:

// 短代码函数
function wpb_demo_shortcode_2() {
// 将广告代码粘贴到变量中
$string .= '<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:block; text-align:center;"
data-ad-format="fluid"
data-ad-layout="in-article"
data-ad-client="ca-pub-0123456789101112"
data-ad-slot="9876543210"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>';
// 返回广告代码
return $string;
}
// 注册短代码
add_shortcode('my_ad_code', 'wpb_demo_shortcode_2');

记得将广告代码替换为你自己的广告代码。

现在,你允许在 WordPress 文章、页面和侧边栏小工具中使用 [my_ad_code] 短代码。WordPress 会自动运行与短代码关联的函数并显示广告。

希望这篇文章能帮忙你学会如何在 WordPress 中使用短代码。你也许可查看我们的其他指南,学习如何在不编写代码的情况下创建自定义 WordPress 主题。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/922840.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

填坑:VC++ 采用OpenSSL 3.0接口方式生成RSA密钥 - 教程

填坑:VC++ 采用OpenSSL 3.0接口方式生成RSA密钥 - 教程pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "Consolas&…

JUC:AQS

AbstractQueuedSynchronizer AQS重要性: Java => JVM JUC => AQS 4.11.1 前置知识公平锁和非公平锁 可重入锁 自旋思想 LockSupport 双向链表数据结构 模板设计模式4.11.2 AQS入门级理论知识AQS定义抽象的队列同…

CF1980F2 Field Division (hard version) 题解

Sol 注意到如果允许走没有限制边境的点答案一定不变,所以只考虑修改在边境上的点即可。 然后再注意到一个点边境上的点如果变成可通信的,那么每个不在边境上的点只会变成了边境上的点至多 \(2\) 次。 所以暴力即可。…

JUC:ThreadLocal

4.8 ThreadLocal 线程局部变量。 4.8.1 常见面试题ThreadLocal中ThreadLocalMap的数据结构和关系? ThreadLocal的key是弱引用,为什么? ThreadLocal内存泄漏问题是什么? ThreadLocal中最后为什么要加remove方法?4.…

广义串并联图とP6790 [SNOI2020] 生成树

广义串并联图とP6790 [SNOI2020] 生成树 前置知识:广义串并联图 定义广义串并联图为不存在与 \(K_4\)(即 \(4\) 个点的完全图)同胚的子图的连通无向图(同胚是指可以通过边的放缩而互相转化的图,即 \((x\leftright…

Manim实现波浪形文字特效

本文将介绍如何使用Manim实现波浪形文字特效,通过自定义动画类让文字产生波浪般的动态效果。 1. 实现原理 波浪形文字特效的核心是通过自定义Animation类,对文本对象中的每个字符应用不同的位置偏移,从而形成波浪效…

网站开发电子书网站ip地址 转向域名

内容简要 1分析网站 2简单爬取 3进阶自定义爬取 4保存进数据库 学校基础设施太差&#xff0c;宿舍电量过低提醒虽然贴在楼下&#xff0c;但是作为低头一族&#xff0c;经常忘记看提醒导致宿舍酣战时突然黑屏&#xff0c;为了避免这种尴尬的场景以及强化PY学习&#xff0c;我决定…

JUC: synchronized与锁升级

4.10.1 面试题谈谈你对synchronized的理解 synchronized的锁升级机制是什么? 偏向锁和轻量锁有什么区别?高并发时,同步调用应该去考量锁的性能损耗。能用无锁的数据结构,就不要用锁。能用锁块,就不要锁整个方法体…

cron表达式,每月1号凌晨3点执行和每周4凌晨3点半执行

cron表达式,每月1号凌晨3点执行和每周4凌晨3点半执行cron表达式,每月1号凌晨3点执行和每周4凌晨3点半执行 1.每月1号凌晨3点执行的Cron表达式为:0 0 3 1 * ? 每个月1号 凌晨3点   0 0 3 1 * ? 和 0 0 3 1 …

学python的第8天

学python的第8天字符编码 水导链接——字符编码 水导链接——Python2和3字符编码的区别 文件基本操作 从硬盘中读取数据、写入数据 水导链接——文件基本操作 绝对路径和相对路径 水导链接——绝对路径和相对路径 文件…

2025.9.30

坐火车回家

lang / philipino / feilvbin / taglog / tajialu

s菲语 翻译magandang tanghali 下午好end

C#/.NET/.NET Core技术前沿周刊 | 第 56 期(2025年9.22-9.28)

前言 C#/.NET/.NET Core技术前沿周刊,你的每周技术指南针!记录、追踪C#/.NET/.NET Core领域、生态的每周最新、最实用、最有价值的技术文章、社区动态、优质项目和学习资源等。让你时刻站在技术前沿,助力技术成长与…

漳州做网站建设的公司做网站 赚广告费

作为当下大语言模型的典型代表&#xff0c;ChatGPT对人类学习方式和教育发展所产生的变革效应已然引起了广泛关注。技术的快速发展在某种程度上正在“倒逼”教育领域开启更深层次的变革。在此背景下&#xff0c;教育从业者势必要学会准确识变、科学应变、主动求变、以变应变&am…

US$249 Autek IKEY820 New License for GM, Grand Cheokee and Dodge Durango Key Programming

Autek IKEY820 New License for GM, Grand Cheokee and Dodge Durango Key ProgrammingWith this license, Autek IKEY820 can support new car models as below:1. Added 2018 Buick LaCrosse Pincode and Key Progra…

Estun机器人数据断电保持问题解决方案

Estun机器人数据断电保持问题解决方案要数据断电保持: 1.变量必须为全局变量 2.用等号做赋值运算

天津港口海鲜之旅全攻略(2025最新版)

🦀 天津港口海鲜之旅全攻略(2025最新版) 天津不仅是工业重镇,更是海鲜爱好者的天堂!每年9月开海后,正是吃海鲜、出海捕鱼的黄金时节。以下是为你整理的天津港口海鲜之旅全攻略,涵盖出海码头、海鲜购买、美食推…

tomcat创建bat启动,结合任务计划实现自动重启tomcat服务 - 详解

tomcat创建bat启动,结合任务计划实现自动重启tomcat服务 - 详解pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "C…

如何从安卓手机恢复手机照相机消失的相机照片?(6个高效办法)

pre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: block !important; font-family: "Consolas", "Monaco", "Courier New", …

实用指南:【论文精读】Few-Shot Object Detection with Attention-RPN and Multi-Relation Detector

实用指南:【论文精读】Few-Shot Object Detection with Attention-RPN and Multi-Relation Detectorpre { white-space: pre !important; word-wrap: normal !important; overflow-x: auto !important; display: bloc…