Сегодня наконец закончил работу над спойлером для своего блога и сразу решил расписать к чему я пришел и как это выглядит.

Перед тем как получить то что хотелось, перепробовал несколько модулей для Drupal и парочку плагинов для CKEditor (а именно в этом редакторе я предпочитаю работать), но ничего не нравилось. Модули либо были слишком громоздкие, либо не находилась интеграция в CKEditor в виде кнопки, либо код, в который оборачивался спойлер оказывался на столько объемным, что просмотр «Источника» в редакторе приводил просто в ужас. Ряд модулей для Drupal и отдельных плагинов для CKEditor, генерировали исключительно отвратительного вида спойлеры, и использовать их у себя в блоге я просто не захотел.

После всех поисков была поставлена нетривиальная задача:

• найти простую и элегантную реализацию спойлера
• интегрировать ее в CKEditor в виде кнопки, которая каким-то образом прятала бы нужный нам текст под спойлер

Путем сложения и вычитания было найдено следующее решение.

За основу была взята эта реализация спойлера. Выглядит красиво и элегантно, что и требовалось. Оставалось только прикрутить это творение к CKEditor.

Поиск выдал несколько вариантов, но выбран был этот.

Выбор был сделан в ползу этого решение по нескольким простым причинам:

• плагин без проблем подцеплялся через модуль CKEditor,
• корректно работал с редактором версии 3.6.2 (на данный момент последняя версия)
• по нажатию кнопки на панели CKEditor вызывалось окошко, где можно было вводить заголовок спойлера и текст под спойлером.

Можно было бы оставить и эту реализацию спойлера но то, как он выглядел, меня как то не вдохновляло. Посему код плагина был скорректирован под выбранную реализацию спойлера.

Теперь мы имеем вариант, который:

• прост как все гениальное
• может быть использован без лишних манипуляций  в CKEditor
• выглядит достаточно красиво, но без всяких там ненужных «рюшечек» и т.п.

Вот собственно сам

В этом файле найдутся все исходники spl.tar.gz

p.s. Пользуюсь преимущственно Linux, посему и формать архива такой, нужно будит кому в *.zip, отпишите, добавлю.

UPD: В связи с изменениями в модуле CKEditor, для удобства активации спойлера я написал простенький модуль ckeditor_spoiler.

Применение:

1. Копируем папку с модулем туда же куда и все модули.
2. Активируем модули CKEditor и ckeditor_spoiler.
3. В настройках CKEditor в нужном профиле (например Full) в блоке EDITOR APPEARANCE находим кнопки.
4. Перетаскиваем кнопку Spoiler (четвертая строка в All buttons "синий квадратик с текстом") туда куда нам нужно в Used buttons.
5. Отмечаем галочкой - Plugin for inserting text under spoiler (buttons: Spoiler).
6. Сохраняем профиль.
7. Очищаем все кэши.
8. Теперь во всех случаях когда используется профиль Full будит отображаться кнопка спойлер.

TODO: Сделать так, чтобы при наведение на спойлер появлялась подсказка, типа "Нажмите чтобы развернуть". Где-то попадалось решение на базе CSS3...