如何给Wordpress经典编辑器添加短代码功能?下面我们提供Wordpress基本短代码功能定义方法和例子示例演示,要在WordPress经典编辑器中添加短代码功能,你可以通过以下纯代码实现方式来完成。这涉及到创建一个自定义的短代码,并将其注册到WordPress中。
首先,在你的主题的 functions.php 文件中,添加一个函数来定义你的短代码。这个函数将定义短代码的内容和功能。
function my_custom_shortcode($atts, $content = null) {
// 提取短代码属性
$atts = shortcode_atts(
array(
'attribute1' => 'default_value1',
'attribute2' => 'default_value2',
),
$atts,
'my_shortcode'
);
// 返回短代码的HTML输出
return '<div class="my-shortcode-class">' . $content . '</div>';
}
add_shortcode('my_shortcode', 'my_custom_shortcode');
接下来,你需要确保短代码在WordPress中注册并可用。这通常通过在 init 钩子上添加一个动作来实现。
function register_my_shortcodes() {
add_shortcode('my_shortcode', 'my_custom_shortcode');
}
add_action('init', 'register_my_shortcodes');
步骤 3: 在经典编辑器中启用短代码按钮(可选)
如果你希望在经典编辑器中添加一个按钮来方便地插入短代码,你可以使用以下代码。这需要使用WordPress的TinyMCE API。
function add_my_shortcode_button() {
// 检查用户权限
if (!current_user_can('edit_posts') && !current_user_can('edit_pages')) {
return;
}
// 检查是否启用了经典编辑器
if (get_user_option('rich_editing') == 'true') {
add_filter('mce_external_plugins', 'add_my_tinymce_plugin');
add_filter('mce_buttons', 'register_my_shortcode_button');
}
}
add_action('admin_init', 'add_my_shortcode_button');
function add_my_tinymce_plugin($plugin_array) {
$plugin_array['my_shortcode_button'] = get_template_directory_uri() . '/style/js/my-shortcode-button.js';
return $plugin_array;
}
function register_my_shortcode_button($buttons) {
array_push($buttons, 'my_shortcode_button');
return $buttons;
}
步骤 4: 创建TinyMCE插件脚本
在主题目录下创建一个 style目录,再在该目录下创建js 文件夹,并在其中创建一个名为 my-shortcode-button.js 的文件。这个文件将定义按钮的行为。
(function() {
tinymce.create('tinymce.plugins.MyShortcodeButton', {
init: function(editor, url) {
editor.addButton('my_shortcode_button', {
title: 'Insert My Shortcode',
icon: 'icon dashicons-before dashicons-shortcode',
onclick: function() {
editor.insertContent('Your content here');
}
});
},
createControl: function(n, cm) {
return null;
},
});
tinymce.PluginManager.add('my_shortcode_button', tinymce.plugins.MyShortcodeButton);
})();
将以下代码放入你的主题的 functions.php
文件中,或者放在自己自定义的插件中。
//自定义短代码 begin
function my_custom_shortcode($atts, $content = null) {
// 提取短代码属性
$atts = shortcode_atts(
array(
'attribute1' => 'default_value1',
'attribute2' => 'default_value2',
),
$atts,
'my_shortcode'
);
// 返回短代码的HTML输出
return '<div class="my-shortcode-class">' . $content . '</div>';
}
add_shortcode('my_shortcode', 'my_custom_shortcode');
//步骤2
function register_my_shortcodes() {
add_shortcode('my_shortcode', 'my_custom_shortcode');
}
add_action('init', 'register_my_shortcodes');
//步骤3
function add_my_shortcode_button() {
// 检查用户权限
if (!current_user_can('edit_posts') && !current_user_can('edit_pages')) {
return;
}
// 检查是否启用了经典编辑器
if (get_user_option('rich_editing') == 'true') {
add_filter('mce_external_plugins', 'add_my_tinymce_plugin');
add_filter('mce_buttons', 'register_my_shortcode_button');
}
}
add_action('admin_init', 'add_my_shortcode_button');
function add_my_tinymce_plugin($plugin_array) {
$plugin_array['my_shortcode_button'] = get_template_directory_uri() . '/style/js/my-shortcode-button.js';
return $plugin_array;
}
function register_my_shortcode_button($buttons) {
array_push($buttons, 'my_shortcode_button');
return $buttons;
}
将以下代码命名为my-shortcode-button.js文件,并放在 https://hao-blog.com/wp-content/themes/SEO/style/
下的js目录中:
(function() {
tinymce.create('tinymce.plugins.MyShortcodeButton', {
init: function(editor, url) {
editor.addButton('my_shortcode_button', {
title: 'Insert My Shortcode',
icon: 'icon dashicons-before dashicons-shortcode',
onclick: function() {
editor.insertContent('Your content here');
}
});
},
createControl: function(n, cm) {
return null;
},
});
tinymce.PluginManager.add('my_shortcode_button', tinymce.plugins.MyShortcodeButton);
})();
以上是基本短代码功能的案例演示,如果想了解更多请关注好客站seo研究中心hao-blog.com ,下面我们讲讲wp添加短代码API的专业教程。
您可以使用 Shortcode API 添加您自己的短代码。该过程涉及使用注册$func短代码的回调 $tagadd_shortcode()。
add_shortcode(
string $tag,
callable $func
);
[wporg]是您的新短代码。使用该短代码将触发wporg_shortcode回调函数。
add_shortcode('wporg', 'wporg_shortcode');
function wporg_shortcode( $atts = [], $content = null) {
// do something to $content
// always return
return $content;
}
可以使用 Shortcode API 删除短代码。该过程包括$tag使用remove_shortcode()删除已注册的短代码。
remove_shortcode(
string $tag
);
尝试移除之前,请确保短代码已注册。请为add_action()指定更高的优先级 ,或将其挂接到稍后运行的操作钩子中。
要检查短代码是否已注册,请使用shortcode_exists()。
使用集成短代码为您的帖子添加丰富的内容,包括标签、警报、进度条等。使用我们简洁的短代码生成器用户界面轻松插入短代码,无需任何编程。
要将短代码插入到您的帖子内容中,请导航到帖子编辑器屏幕,然后单击 WordPress 编辑器工具栏中的短代码图标:
在经典编辑器中添加短代码功能 - WordPress中的基本短代码按钮图示