Wordpress / TinyMCE-挂钩/过滤器以在网址中添加目标=“ _ blank”

Question

自最近6个小时以来，我一直在尝试，似乎没有任何效果。我想在Wordpress编辑器-TinyMce中单击按钮时添加target =“ _ blank”。

这是我到目前为止所做的：

参考：https://wordpress.stackexchange.com/questions/141344/add-button-in-tinymce-editor-to-insert-text

functions.php

    add_action( 'init', 'droid_buttons' );
function droid_buttons() {
    add_filter( "mce_external_plugins", "droid_add_buttons" );
    add_filter( 'mce_buttons', 'droid_register_buttons' );
}

function droid_add_buttons( $plugin_array ) {
    $plugin_array['droid'] = get_template_directory_uri() . '/js/text-button.js';
    echo get_template_directory_uri();
    return $plugin_array;
}

function droid_register_buttons( $buttons ) {
    array_push( $buttons, 'droid_title'); // droid_title
    return $buttons;
}

text-button.js

    (function() {
    tinymce.create('tinymce.plugins.Droid', {
    init : function(editor, url) {
    editor.addButton('droid_title', {
    title : 'Droid Title',
    cmd : 'droid_title',
    image : ''
    });

    editor.addCommand('droid_title', function() {
    var selected_text = editor.selection.getContent();
    var element = "http://www.google.com";
    var return_text = "";
    return_text = '<a href="'+element+'" class="droid_title" target="_blank">' + selected_text + '</span>';
    editor.execCommand('mceInsertContent', 0, return_text);
    });

    },

    });

    // Register plugin
    tinymce.PluginManager.add( 'droid', tinymce.plugins.Droid );
})();

因此，在我的functions.php文件和text-button.js文件中添加了以上代码之后，它在wordpress编辑器中添加了 button 来添加 target =“ _ blank” 在所选文本中插入链接的顶部。

当我在编辑器中单击插入/编辑链接后插入网址时，其显示为：

但是点击按钮后。. URL更改为 www.google.com，如代码所示。

我试图弄清楚应该在js文件中的 element变量中给出什么，但无法弄清楚。

我经历了这里给出的解决方案：

WordPress hook / filter to process link inside a post

在这里：

How to set target attribute in tinyMCE

，但无法找出问题所在。任何帮助都是非常可观的。提前非常感谢。

Answer 1

根据插件的documentation，您需要在addButton事件中添加一个回调函数。在此回叫中，您应该完成所需要的。 更新：请确保您在functions.php文件中具有js文件的正确路径。在我看来，这是$plugin_array['droid'] = get_template_directory_uri() . '/assets/js/text-button.js';，您可能错过了资产目录吗？

尝试这样：

(function() {
        tinymce.create('tinymce.plugins.Droid', {
        init : function(editor, url) {
        editor.addButton('droid_title', {
        title : 'Droid Title',
        cmd : 'droid_title',
        image : '',
        onclick: function() {
            var selected_text = editor.selection.getContent();
            var element = "http://www.google.com";
            var return_text = "";
            return_text = '<a href="'+element+'" class="droid_title"  target="_blank">' + selected_text + '</span>';
            editor.insertContent(return_text);
           }
        });

工作示例demo