Wordpress / TinyMCE - Крюк / Фильтр для добавления Target = "_ blank" в URL - PullRequest
Новая
       11

Wordpress / TinyMCE - Крюк / Фильтр для добавления Target = "_ blank" в URL

0 голосов
/ 05 июля 2018

Я пробую это с прошлых 6 часов, и ничто, кажется, не работает для меня. Я хочу добавить target = "_ blank" по нажатию кнопки в редакторе Wordpress -TinyMce.

Вот что я делал до сих пор:

Ссылка : 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;
}

текст-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, чтобы добавить target = "_ blank" в верх вставленной ссылки в выделенном тексте.

когда я вставляю URL после нажатия вставка / редактирование ссылки в редакторе, она отображается как есть:

before clicking defined button

Но после нажатия кнопки ... URL-адрес меняется на www.google.com, как указано в коде.

enter image description here

Я пытался выяснить, что именно я должен дать в качестве переменной элемента в файле js , но не смог выяснить.

Я прошел через приведенное здесь решение:

Хук / фильтр WordPress для обработки ссылки внутри сообщения

и здесь:

Как установить целевой атрибут в tinyMCE

но не в состоянии выяснить проблему. Любая помощь будет действительно заметной. Большое спасибо заранее.

1 Ответ

0 голосов
/ 05 июля 2018

В соответствии с документацией плагина вам необходимо добавить функцию обратного вызова в событие addButton. В этом перезвоне вы должны выполнить то, что вы хотели. Обновление: убедитесь, что у вас указан правильный путь к файлу js в файле functions.php. Похоже, что в моем случае это будет $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);
           }
        });

Рабочий пример демо

...