Кастомные кнопки для BUeditor





Кнопки для BUeditor

У Друпала есть один замечательный редактор — bueditor. Все разработчики его любят, поскольку он не совсем WYSIWYG, а следовательно не создает много мусора и дает полный контроль над вводимой информацией. Но, тем не менее, функция просмотра у него так же существует.

Из явных фич можно отметить:

  • Расширяемый интерфейс;
  • Возможность создавать кнопки как с иконками, так и с обычным текстом;
  • Настройка редактора по ролям
  • Поддержка html/bbcode/etc-тегов

Идея сделать свой набор кнопок c иконками мучила меня уже не первый месяц, но как-то не доходили руки. И когда на работе в ib.by мне свалилась задача таки сделать эти кнопки для клиентского сайта, я понял, что одним выстрелом двух зайцев свалить реально. Итак, представляю вам наш совместный проект — набор кнопок и иконок для bueditor.

На данный момент к набору кнопок от дефолтного редактора я добавил:

  • вставка символов,
  • вставка таблицы,
  • загрузка файлов (требуется модуль ocupload),
  • цвет текста,
  • верхний/нижний индекс,
  • выравнивание текста,
  • удаление всех html-тегов,
  • кнопки "отменить" и "повторить".

Иконки для BUeditor

Установка кнопок:





  • установить bueditor
  • скачать архив с кнопками и файлом импорта редактора
  • положить папку turbueditor с иконками в /sites/default/files/
  • зайти в админку admin/config/content/bueditor и выбрать "Импорт редактора"
  • "название редактора" — Turbueditor, "папка файлов редактора — turbueditor", "php-код" — из файла Turbopxl.bueditor.txt
  • импорт

После импорта редактора осталось только определить назначения редакторов для ролей /admin/config/content/bueditor. Вот и все.

Какие кнопки используете вы?

Вообще есть мысли нарисовать еще с десяток пиктограмм, так что если у вас есть идеи — оставляйте в комментариях.





Комментарии

Кнопка Headings в Bueditor-5.x-1.2 не работает.
Как её можно перенести в модуль для 5-го Друпала? Просто перенос функции из редактора ничего не дает. Появляется сообщение об ошибке E.tagChooser.
Это не срабатывает JavaScript. Не смог разобраться какой и как он подключается. Очень удобная кнопка. Одной можно выставить шесть разных тегов.
Может что посоветуете? Как её задействовать для 5-й версии?

К сожалению (или к счастью) мне не довелось работать с 5 версией. Там в редакторе по умолчанию нет возможности вставлять заголовки?

По умолчанию там много чего нет, и заголовков тоже.

Добрый день!

Хорошая работа, а есть вариант выпустить релиз иконок в виде спрайта?

В браузерах быстрее будет работать.

В буэдиторе есть возможность создавать спрайты из текущих иконок. Для этого в настройках редактора нужно поставить соответствующую галочку.

Про спрайты.
Понял, bueditor сам создаёт. Вопрос не актуален.

Отличная тема! Буду пользоваться

Дим, есть небольшой баг: в кнопках выравнивания текста смени <div> теги на <p>, что будет семантически более верно. И в кнопке выравнивания по ширине замени "right" на "justify".
Удачных разработок!

Спасибо, исправил.

Добавить комментарий

Plain text

  • HTML-теги не обрабатываются и показываются как обычный текст
  • Адреса страниц и электронной почты автоматически преобразуются в ссылки.
  • Строки и параграфы переносятся автоматически.
Drupal
02
04 '13 — 12:16:16