4

Добавляю в редактор кнопки таким образом, через function.php:

QTags.addButton( 'sheens_jQtooltip', 'Phone', '+(7) 965 000-00-00');

Меня интересуют два вопроса:

1) Как можно придать созданной кнопке в редакторе цвет?

2) Если кнопок много, как их "категоризировать"? Допустим, я хочу, чтобы на одной линии были такие кнопки, как: телефон, адрес, имя, фамилия.

При обычном добавлении кнопки она просто становится в ряд по указанному типу. Как создать свой тип, и чтобы они были по линиям? Нужно, ибо когда они все вразброс - тяжеловато искать: одна - там, другая - сям.

1 ответ 1

4

Порядок кнопок задается седьмым параметром (priority) функции QTags.addButton:

QTags.addButton( id, display, arg1, arg2, access_key, title, priority, instance );

где

  • id - html id кнопки,
  • display - текст на кнопке,
  • arg1 - открывающий тег,
  • arg2 - закрывающий тег,
  • access_key - клавиатурный шорткод кнопки,
  • title - тултип (текст при наведении),
  • priority - приоритет кнопки (позиция в строке),
  • instance - экземпляр панели кнопок.

Добавьте в function.php такой пример:

function kagg_add_quicktags() {
    if (wp_script_is('quicktags')){
        ?>
        <script type="text/javascript">
            QTags.addButton( 'kagg_paragraph', 'p', '<p>', '</p>', 'p', 'Абзац', 2 );
            QTags.addButton( 'kagg_hr', 'hr', '<hr />', '', 'h', 'Горизонтальный разделитель', 201 );
            QTags.addButton( 'kagg_pre', 'pre', '<pre lang="php">', '</pre>', 'q', 'Преформатированный текст', 111 );
            QTags.addButton( 'kagg_phone', 'Phone', '+(7) 965 000-00-00', '', '', 'Телефон', 1 );
        </script>
        <?php
    }
}

add_action( 'admin_print_footer_scripts', 'kagg_add_quicktags' );

Этот код добавляет 4 кнопки: p, hr, pre и Phone. Обратите внимания на приоритеты и картинку с результатом внизу.

Чтобы задать цвет вашей кнопке, нужно запустить собственный файл стилей в админке. Добавьте следующий код в function.php:

function admin_style() {
    wp_enqueue_style('admin-styles', get_stylesheet_directory_uri().'/admin.css');
}

В папку вашей темы добавьте файл admin.css со следующим содержимым:

input#qt_content_kagg_paragraph,
input#qt_content_kagg_hr,
input#qt_content_kagg_pre,
input#qt_content_kagg_phone {
    background: red;
    color: white;
}

Вот такой результат я получил на своем тестовом сайте:

введите сюда описание изображения

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.