Настройка кнопки Quicktags в HTML-редакторе для открытия диалога выбора параметров вставки

Question

Настройка кнопки Quicktags в HTML-редакторе для открытия диалога выбора параметров вставки

5 сент. 2011 г., 00:42:59

Просмотры: 857

Голосов: 9

Я хочу добавить пользовательские кнопки быстрой вставки (quicktags), которые позволят отображать промежуточное диалоговое окно перед вставкой кода.

Ситуация

При нажатии на кнопку quicktag открывается диалоговое окно или модальное окно thickbox.
Открытое диалоговое окно отображает параметры, такие как классы, и кнопку "Вставить".
Нажатие кнопки "Вставить" добавляет код.

Предыстория

Для добавления кнопки quicktags мы обычно используем:

edButtons[ edButtonsLength+ ] = new edButton(
    'ed_mybutton' , 'Вставить кнопку', '<div class="class-name">', '</div>'
);
////
edHTML += '<input type="button" value="Вставить пользовательский код" id="ed_my_button" class="ed_button" onclick="edInsertTag( edCanvas, edButtonLength_t + 1)" title="Вставить код" />';

Теперь вопрос: как можно изменить поведение кнопки, чтобы она открывала диалоговое окно (или модальное окно thickbox) вместо прямой вставки?

Я могу добавить кнопку без стандартного определения, например:

edHTML += '<input type="button" value="Вставить пользовательский код" id="ed_my_button" class="ed_button" onclick="customFunction()" title="Вставить код" />';
// и
var customFunction = function() {
   openURL = '<?php admin_url() ?>admin-ajax.php?action="insertCodeAction&TB_iframe=true';
   tb_show( 'Вставить пользовательский код', openURL );
};

Поделитесь своими знаниями. Заранее спасибо.

P.S.: Сделать это в TinyMCE относительно просто, интересно как реализовать подобное для HTML quicktags. :)

OpenOne

182

записи редактор быстрая кнопка

Комментарии

У меня нет конкретной идеи, как добавить модальное окно или открыть диалоговое окно, но есть решение для замены кода, чтобы публиковать как контекст и добавить css-класс, возможно, это немного поможет вам. Код можно найти здесь: https://github.com/bueltge/AddQuicktag/blob/master/js/add-quicktags.dev.js#L150

bueltge

1 июн. 2018 г. 12:37:35

Все ответы на вопрос

Комментарии

это не дает мне результат

Amol Bhandari SJ

25 нояб. 2019 г. 09:51:13

dean1997 21 · Answer 1 · 2014-04-16T00:38:46Z

Согласно Codex, вы не можете сделать это напрямую через API. Однако вы можете сделать это, используя свой собственный файл quicktags.js, как показано ниже.

function sample_load_admin_scripts()
{
  if ( is_admin() ) {
    wp_deregister_script('quicktags');
    wp_register_script('quicktags', ("/path/to/your/quicktags.js"), false, '', true);
  }
}

if (is_admin()) {
  add_action('init', sample_load_admin_scripts);
}

Затем просто добавьте JavaScript для выполнения работы. Форматирование относительно простое, но так как вы знаете, как делать всё с помощью TinyMCE, я не буду углубляться в это. Возьмите здесь свой собственный файл quicktags.js.