WordPress 使用 shortcode() 增加编辑器功能 – VTHEME

WordPress 使用 shortcode() 增加编辑器功能

11-22

WordPress 主题开发

257

一，shortcode 简介

使用 shortcode 可以增加文章的功能，实现输入密码显示全部文章内容，付款后显示全部内容。

[shortcode]Some Content[/shortcode] // 封闭标签

[shortcode] // 自闭标签

[shortcode title=”example”] // 带有一个参数的自闭标签

[shortcode]<p><a href=”#”><span>内容</span></a></p>[/shortcode] // 标签内可以填写文本或 HTML

二，shortcode 使用例子

在使用 shortcode 前，首先必须在主题的 functions.php 文件中定义 shortcode ，例如：

/**
 * @param  $atts    shortcode 的各个参数
 * @param  $content 标签内的内容
 * @return          html string
 */
function test_shortcode($atts, $content = null){
    // 使用 extract 函数解析标签内的参数
    extract(shortcode_atts(array( "title" => '标题' ), $atts));


    return '<div class="myshortcode">
            <h3>'. $title .'</h3>
            <p>
                '. $content .'
            </p>
        </div>';
}
 
add_shortcode("test", "test_shortcode");

添加以上代码到 functions.php，经典编辑器可以直接输入

标题

标签调用该 shortcode，如：


            欢迎
            
                这里填入隐藏内容，回复后可见

如果使用的是古腾堡编辑器，可以新建小工具中的简码区块。

文章版权声明

发表评论取消

WordPress WP_Query() 文章置顶的方法

WordPress WP_Query() 文章置顶的方法

置顶文章的查询 WordPress 文章列表文章置顶，使用 WP_query() 时, ignore_sticky_posts 参数设置为 false，则会在查询结果的头部，附带所有的置顶文章。但实际开发中，因为各种需求，最好的方式是使用两个 WP_query()，第一个 WP_query() 只列出置顶的文章，第二个 WP_query() 只列出不置顶的文章，然后剩下的 Ajax 请求，都不 […]

WordPress 主题开发

11-22

208 0 0

WordPress 常用接口

简介 WordPress v4.4以后，已经内置了WP REST API。接口文档：https://developer.wordpress.org/rest-api/ The WordPress REST API provides an interface for applications to interact with your WordPress site by sending and r […]

WordPress 主题开发 RESTful API

2024-05-04

589 0 0

WordPress 发送邮件

一，WordPress 默认发送邮件的函数参数：$to (string|array) (Required)收信人地址，多个收信人使用数组形式。$subject (string) (Required) 邮件主题$message (string) (Required) 邮件内容$headers (string|array) (Optional) 额外的头部。 Default value: ” $at […]

WordPress 主题开发

2023-07-26

1.5千 0 0

vt-dialog 主题自带的对话框插件

vt-dialog 主题自带的对话框插件

简介: 这是主题中的一个对话框插件，主要包含两个文件，dialog.js 和 dialog.css 。 https://gitee.com/vthemecn/miragev/blob/main/assets/css/src/common/dialog.css https://gitee.com/vthemecn/miragev/blob/main/assets/js/src/dialog.js & […]

WordPress 主题开发

05-16

511 0 0

WordPress 添加文章自定义字段

WordPress 添加文章自定义字段

有时候需要给文章添加一些自定义字段，比如、价格和尺寸等自定义字段，参考如下代码。 /** * 文章编辑页-添加自定义字段 */ add_action('add_meta_boxes', 'flame_add_custom_box'); function flame_add_custom_box() { //需要添加自定义字段的文章类型 array('post','page','audio'); $ […]

WordPress 主题开发

11-22

189 0 0

WordPress 主样式表(style.css)

WordPress 主样式表(style.css)

主样式表(style.css)style.css是每个WordPress主题所需的样式表（CSS）文件。它控制网页的演示（视觉设计和布局）。位置为了使WordPress将主题模板文件的集合识别为有效的主题，style.css文件需要位于主题的根目录中，而不是子目录。有关如何将style.css文件包含在主题中的更详细说明，请参阅“启动脚本和样式”的“样式表”部分。基本结构WordPress […]

WordPress 主题开发

2023-06-15

1.3千 0 0

像素鱼丸

156 文章

1 评论

4 喜欢

测试产品

未分类

7小时前

14 0 0

退款和取消订单接口要不要合并

很多开发者在设计初期的常见思路。将“取消”和“退款”分开，从功能上看似乎很清晰，但在实际的复杂业务场景中，这种设计可能会带来一些问题。更主流和推荐的设计是提供一个统一的“申请取消订单”接口，由后端服务根据订单的当前状态，自动路由到不同的处理逻辑。为什么统一接口是更好的选择？前端逻辑简化：对于用户而言，他的诉求只有一个：“我不想要这个订单了”。无论订单是否支付，他在前端点击的都是“取消订单 […]

开发

8天前

39 0 0

Mirage 主题 v3.7.0 发布

Mirage 主题 v3.7.0 发布

Mirage 主题 v3.7.0 发布 feat 增加拉黑用户功能 feat 移动端向下滑动时隐藏header，向上滑动时显示header 下载地址 https://gitee.com/vthemecn/mirage/releases/tag/v3.7.0 https://github.com/vthemecn/mirage/releases/tag/v3.7.0 新增功能截图

动态

12天前

60 0 0

Mirage 主题 v3.6.0 发布

Mirage 主题 v3.6.0 发布

下载地址 Gitee下载地址：https://gitee.com/vthemecn/mirage/releases/tag/v3.6.0 Github下载地址：https://github.com/vthemecn/mirage/releases/tag/v3.6.0 更新内容 – feat 新增导航菜单悬浮顶部切换设置 – feat 增加隐藏登录按钮的设置 – feat 增加在前台显示登录按钮的 […]

动态

13天前

66 0 0