[Статья]

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

Как мы знаем, начиная с версии 4.1.4 штатный редактор vB был заменён на CKE Editor. Старые способы добавления кнопок в редактор стали неактуальными. Предлагаю нашим пользователям свой вариант добавления кнопок в быстрый ответ/редактор.

Чем мой вариант отличается от уже существующих (правка скриптов vB, создание CKE плагина)? Простотой и универсальностью Работать будем только с модулями vB. Для нашей задачи нам потребуется всего лишь один хук - editor_construct.

В статье мы рассмотрим не только пример добавления кнопки после всех стандартных, но и добавление кнопки в нужное нам место тулбара.

Ну что, начнем, помолясь?

Нам потребуется создать модуль и повесить его на хук editor_construct

---

Прмер 1: Добавляем кнопку в существующую группу кнопок

---

PHP Code:

if ($this->editor_type == 'qr' OR $this->editor_type == 'qe')
{
    foreach ($this->config['toolbar'] AS $key => $value)
    {
        if (is_array($value))
        {
            foreach ($value AS $id => $cmd)
            {
                if ($cmd == 'Quote')
                {
                    $this->config['toolbar'][$key][] = 'HorizontalRule';
                }
            }
        }
    }
} 


В данном примере мы добавили кнопку "Горизонтальная линия" после кнопки "Цитата".

---

Прмер 2: Добавляем несколько кнопок в существующую группу и отделяем их вертикальной линией

---

PHP Code:

if ($this->editor_type == 'qr' OR $this->editor_type == 'qe')
{
    foreach ($this->config['toolbar'] AS $key => $value)
    {
        if (is_array($value))
        {
            foreach ($value AS $id => $cmd)
            {
                if ($cmd == 'Quote')
                {
                    $this->config['toolbar'][$key] = array_merge($this->config['toolbar'][$key], array('-', 'HorizontalRule', 'Subscript', 'Superscript'));
                }
            }
        }
    }
} 


В данном примере мы добавили несколько кнопок после кнопки "Цитата" и отделили их вертикальной линией.

---

Прмер 3: Добавляем несколько кнопок в отдельную группу

---

PHP Code:

if ($this->editor_type == 'qr' OR $this->editor_type == 'qe')
{
    $this->config['toolbar'][] = array('Code', 'Html', 'Php');
} 


---

Прмер 4: Создаем новый тулбар с несколькими группами кнопок

---

PHP Code:

if ($this->editor_type == 'qr' OR $this->editor_type == 'qe')
{
    $this->config['toolbar'][] = '/';
    $this->config['toolbar'][] = array('Code', 'Html', 'Php');
    $this->config['toolbar'][] = array('Table', 'TableProperties', 'DeleteTable', '-', 'InsertRowBefore', 'InsertRowAfter', 'DeleteRow', '-', 'InsertColumnBefore', 'InsertColumnAfter', 'DeleteColumn', '-', 'Subscript', 'Superscript', 'HorizontalRule');
} 


Таким образом мы развенчали миф "о сложности добавления кнопок в CKE Editor"

Originally Posted by YURSHAT

Таким образом мы развенчали миф "о сложности добавления кнопок в CKE Editor".

и заодно миф о "закоренелых троешниках"

Вот это гемор с этим редактором...

Originally Posted by Luvilla

и заодно миф о "закоренелых троешниках"

Не-не-не Чисто из спортивного интереса и по принуждению князя Милославского

Originally Posted by Sven

Вот это гемор с этим редактором...

Гемор? Мне кажется, для кастомного редактора очень даже неплохо. Пару строк кода... Да и код вроде интуитивно понятный.

А автор знает, как написать всё "грамотно и понятно". Тема оформлена отлично, но как понять: что, как и куда вставлять?

1. Мне нужно создать новый модуль для editor_construct - да, это понятно, безусловно.
2. Как мне добавить bb-код после "B, U, I"? Где я должен найти информацию именно о данном блоке? Какой переменной данный блок обозначается? В теме этого не написано. Как вообще узнать, какой блок и какой переменной обозначается? Учитывая тот факт, что 90% пользователей и гостей вообще впервые все эти "коды" увидели.
3. В самом первом примере автор показывает, как после "Quote" вставить иконку с горизонтальной линией. Почему она называется "HorizontalRule"? В моих BB-кодах там вообще идёт такой пример:

PHP Code:

<span style="text-decoration:line-through;">Пример</span> 


Собственно, очень много вопросов.
Как мне добавить кнопку зачёркнутого текста после "B, U, I"?

Originally Posted by GOVARD

Где я должен найти информацию именно о данном блоке? Какой переменной данный блок обозначается? В теме этого не написано. Как вообще узнать, какой блок и какой переменной обозначается?

Посмотреть в методе setToolbar, который находится в скрипте vb/ckeditor.php. Стандартные блоки редакторов "сконструированы" там.

Originally Posted by GOVARD

Как мне добавить кнопку зачёркнутого текста после "B, U, I"?

PHP Code:

if ($this->editor_type == 'qr' OR $this->editor_type == 'qe')
{
    foreach ($this->config['toolbar'] AS $key => $value)
    {
        if (is_array($value))
        {
            foreach ($value AS $cmd)
            {
                if ($cmd == 'Underline]')
                {
                    $this->config['toolbar'][$key][] = 'YourBBCodeTitle';
                }
            }
        }
    }
} 


После танцев с бубном добавить нужную кнопку по описанному выше методу так и не получилось.
1. Кнопка "зачеркнутый текст" встала на своё место, после кнопки "подчеркивание", но уж больно она мне напоминает кнопку "вложения" ))
2. Текст зачеркивается, но после предварительного просмотра или сохранения, форматирование пропадает.

Пошел другим путём.
Добавил bbCode для зачеркивания, подключил нужную кнопку, но она стоит на отшибе... как поставить её рядом с кнопкой "подчеркивание"?

Версия vB, если что, 4.2.6
Кстати, а где все картинки кнопок редактора хранятся? В images/editor всего несколько картинок, а остальные?
Все просканировал, так и не понял откуда они в редакторе берутся. Думал, может быть выйду на картинку вложений,
что появилась на месте зачеркнутого текста.

Originally Posted by vob

Кстати, а где все картинки кнопок редактора хранятся?

images/editor/sprite.png
это вот они и есть, оттуда и берутся

Originally Posted by Luvilla

это вот они и есть, оттуда и берутся

Ну нефигасе, как далеко шагнул прогресс... и шо теперь делать, как нужную картинку на кнопку поставить?
Ладно, в лес спрайты... а ту кнопочку, что сейчас у меня на отшибе, реально сейчас перетащить на нужное место.
Или они все как-то через спрайты привязаны и вклинится не получится?