也想出现在这里?联系我们

WordPress怎么给后台编辑器添加按钮

2024.03.02 wordpress教程
  • 文章介绍
  • 升级版本
  • 评价&建议

要在WordPress后台编辑器中添加按钮,您需要使用WordPress的自定义功能来实现这一点。以下是一些步骤:

  1. 创建一个插件:首先,您需要创建一个WordPress插件,如果您还没有一个。您可以在WordPress的wpcontent/plugins/目录中创建一个新文件夹,并在其中创建一个PHP文件,例如mycustomeditorbutton.php

  2. 添加按钮代码:在插件文件中,您可以使用以下代码来添加按钮到后台编辑器:

function custom_editor_button() {
    if (current_user_can('edit_posts')) {
        add_filter('mce_external_plugins', 'add_custom_editor_plugin');
        add_filter('mce_buttons', 'register_custom_editor_button');
    }
}

function add_custom_editor_plugin($plugin_array) {
    $plugin_array['custom_editor_button'] = plugin_dir_url(__FILE__) . 'customeditorbutton.js';
    return $plugin_array;
}

function register_custom_editor_button($buttons) {
    array_push($buttons, 'custom_editor_button');
    return $buttons;
}

add_action('init', 'custom_editor_button');
  1. 创建JavaScript文件:在插件目录中创建一个名为customeditorbutton.js的JavaScript文件,用于定义按钮的行为。例如:
(function() {
    tinymce.PluginManager.add('custom_editor_button', function(editor, url) {
        editor.addButton('custom_editor_button', {
            text: '自定义按钮',
            icon: false,
            onclick: function() {
                // 这里可以定义按钮被点击时的操作
                editor.windowManager.open({
                    title: '自定义按钮',
                    body: [{
                        type: 'textbox',
                        name: 'custom_text',
                        label: '自定义文本'
                    }],
                    onsubmit: function(e) {
                        editor.insertContent('你选择的文本是: '  e.data.custom_text);
                    }
                });
            }
        });
    });
})();
  1. 激活插件:在WordPress后台,转到“插件”页面,并激活您创建的插件。

  2. 编辑器中使用按钮:现在,当您编辑帖子或页面时,您应该在编辑器的工具栏中看到您添加的自定义按钮。点击它,并按照JavaScript文件中定义的行为使用它。

这些步骤将帮助您在WordPress后台编辑器中添加自定义按钮。请注意,您可以根据您的需求修改JavaScript文件中的按钮行为。

有用0
  • 2024.03.02初次和大家见面了!

等待您对该主题的建议

发表评论

还能输入240个字

Hi, 欢迎加入Wordpress技术交流群,带你装逼带你飞!

我要入群
也想出现在这里?联系我们
wordpress加速

我来推荐一个更牛逼的给你看看?

  • 猛戳我吧