Настройка Tiny_MCE

В свое время долго мучался с редактором TinyMCE, который идет в стандартной сборке ЛС-а. По роду деятельности я не программер, по этой причине пустяковые проблемы почти не имели решений, но все же я смог осилить настройку и изменение этого редкатора.

Чем моя сборка отличается от той, что в ЛС-е?
1. Корректная расстановка переносов строк;
2. Набор смайликов (не qip);
3. Нет глюка с заголовками;
4. Добавлено несколько кнопок;
5. При включении редактора не отключается стандартный в комментах;

Чуть подробнее о каждом пункте
1. В сборке LS-а при включении редактора Tiny MCE образуется двойной перенос строк. Если отключить авто-перенос, то в редакторе все начинает работать как нужно, а в комментах строки более не переносятся. Спасибо Dr_Death, который помог решить проблему (ссылка на топик)
2. На сайте Tiny MCE есть плагин смайликов, но те смайлики мне очень не понравились. На форуме одного знакомого были очень добродушные желтые человечки, которыми он со мной поделился и я их вкрутил к себе на сайт (по словам знакомого — смайлики бесплатные).
3. Полное описание глюка с загаловками можно найти тут. Разобраться никто не помог, поэтому был сделан финт ушами, в результате которого была изменена одна из стандартных кнопок редактора.
4. На 100% не помню, что за кнопки я добавлял и сколько именно их добавил (редактор переделывал еще в эпоху 0.3.1). Мне нехватало полноэкранного режима написания топика — решено.
5. Никогда не понимал этой настройки в ЛС-е. Если реч идет об Tiny MCE, то почему отключается стандартный редактор из комментов при включении Tiny MCE для публикации топиков? Решение данной проблемы — 1 символ, но об этом ниже.

Недостатки
1. Это не плагин. Плагины я делать не умею…
2. В сборке настроенные стили с моего сайта L2Plus.ru, по этой причине тем, кому данная цветовая гамма (заголовков) не подойдет — нужно менять самим.
P.s.: внешний вид и функционал кнопочек можно посмотреть все тут-же www.L2Plus.ru

Хочу!
1. Качаем хак из раздела модулей или с моего сайта (пока хак на модерации)
2. Копируем из архива папку engine на сервер (замены файлов не будет т.к. папка ложиться рядом с дефолтным Tiny MCE)
3. Нам нужно указать, какие теги вырезать и какие параметры у тегов разрешать. Для этого итем в engine/modules/text/text.class.php и настраиваем теги. В архиве лежат два файла, первый и из который — родной (966 сборка — релиз 0.4.2), а второй — измененный.
Описывать изменения тут не вижу смысла, т.к. можно просто сравнить содержимое функции protected function JevixConfig().
4. В этом же файле нужно выключить перенос строк в топике и включить в комментариях. Стандартными средставми этого сделать нельзя, поэтому вмешиваемся в код.
Находим:
// Отключение авто-добавления 
		$this->oJevix->cfgSetAutoBrMode(true);

Заменяем:
// Отключение авто-добавления 
		$this->oJevix->cfgSetAutoBrMode(false);

Находим:
public function JevixParser($sText,&$aError=null) {		
		$sResult=$this->oJevix->parse($sText,$aError);
		return $sResult;
	}

Заменяем:
public function JevixParser($sText,&$aError=null) {		
		if (Config::Get('view.tinymce')) {
		        $this->oJevix->cfgSetAutoBrMode(!preg_match('/<p([^>]*)>|<\/p>/isu', $sText));
		}
		$sResult=$this->oJevix->parse($sText,$aError);
		return $sResult;
	}

5. Теперь нам нужно переключить редактор с дефлтного на обновленный. Идем в этот файл templates/skin/new/actions/actiontopic/add.tpl
Находим:
{if $oConfig->GetValue('view.tinymce')}
<script type="text/javascript" src="{cfg name='path.root.engine_lib'}/external/tinymce_3.2.7/tiny_mce.js"></script>

<script type="text/javascript">
{literal}
tinyMCE.init({
	mode : "textareas",
	theme : "advanced",
	theme_advanced_toolbar_location : "top",
	theme_advanced_toolbar_align : "left",
	theme_advanced_buttons1 : "lshselect,bold,italic,underline,strikethrough,|,bullist,numlist,|,undo,redo,|,lslink,unlink,lsvideo,lsimage,pagebreak,code",
	theme_advanced_buttons2 : "",
	theme_advanced_buttons3 : "",
	theme_advanced_statusbar_location : "bottom",
	theme_advanced_resizing : true,
	theme_advanced_resize_horizontal : 0,
	theme_advanced_resizing_use_cookie : 0,
	theme_advanced_path : false,
	object_resizing : true,
	force_br_newlines : true,
    forced_root_block : '', // Needed for 3.x
    force_p_newlines : false,    
    plugins : "lseditor,safari,inlinepopups,media,pagebreak",
    convert_urls : false,
    extended_valid_elements : "embed[src|type|allowscriptaccess|allowfullscreen|width|height]",
    pagebreak_separator :"<cut>",
    media_strict : false,
    language : TINYMCE_LANG
});
{/literal}
</script>

Заменяем на:
{if $oConfig->GetValue('view.tinymce')}
<script type="text/javascript" src="{cfg name='path.root.engine_lib'}/external/tinymce/tiny_mce.js"></script>

<script type="text/javascript">
{literal}
tinyMCE.init({
	mode : "textareas",
	theme : "advanced",
	theme_advanced_toolbar_location : "top",
	theme_advanced_toolbar_align : "left",
	theme_advanced_buttons1 : "formatselect,bold,italic,underline,strikethrough,|,bullist,numlist,|,undo,redo,|,lslink,unlink,|,forecolor,|,emotions,blockquote,|,lsvideo,lsimage,|,sub,sup,|,fullscreen,pagebreak,code",
	theme_advanced_buttons2 : "",
	theme_advanced_buttons3 : "",
	theme_advanced_statusbar_location : "bottom",
	theme_advanced_resizing : true,
	theme_advanced_resize_horizontal : 0,
	theme_advanced_resizing_use_cookie : 0,
	theme_advanced_path : false,
	object_resizing : true,
	force_br_newlines : false,
    forced_root_block : '', // Needed for 3.x
    force_p_newlines : true,    
    plugins : "lseditor,safari,inlinepopups,media,pagebreak,fullscreen,emotions",
    convert_urls : false,
    extended_valid_elements : "embed[src|type|allowscriptaccess|allowfullscreen|width|height]",
    pagebreak_separator :"<cut>",
    media_strict : false,
    height:500,
    language : TINYMCE_LANG
});
{/literal}
</script>

6. Возвращаем стандартный редактор в комментарии. Идем в этот файл templates/skin/new/comment_tree.tpl
Находим:
{if !$oConfig->GetValue('view.tinymce')}

Заменяем на:
{if $oConfig->GetValue('view.tinymce')}


P.S.: на создание данного топика подтолкнула эта тема. На уникальность и идеальность решения не претендую т.к. редактор настраивал исключительно для себе… Может кому-то и пригодится.

57 комментариев

avatar
Отличная работа.
Кто умеет и не трудно, пожалуйста переделайте в плагин.
avatar
SkyNet спасибо тебе большое!!! Очень здорово выручил своим решением!
Но все же поддерживаю тему перевода хака в плагин! ))
avatar
Зачет!
avatar
всё хорошо — работает. только вот я попробовал добавить кнопки добалвения видео, изображений, списков — не работает. кто-нибудь знает почему?
avatar
Все что Вы перечислили — лично у меня работает.
Пункт 3 точно сделали? Там как-раз настройка тегов, которые не должны вырезатьсяю
avatar
копировал код из топика в комменты и забыл поменять название формы. а чтобы изображения работали — нужно инклюдить еще файл window_load_img.tpl
avatar
а как обстоит дело с аплоадом картикон и вставкой видео?
avatar
l2plus.ru/blog/freya/118.html на этой странице 5 видео
страниц с картинками оооочень много (почти все)
avatar
спасибо за инфу
avatar
Считаю это не нужным. Стандартный редактор вполне хорош… ну разве что кроме вставки видео и всё впрочем.
avatar
не всегда стандартный редактор будет подходить ко всем проектам. Наличие альтернатив расширяет возможность использования движка.
avatar
Авторизовался на Вашем сайте, кроме цитирования в IE — ничего не работает. Такая же проблема о которой я писал в том топике, всплывает белое окно без каких либо опций, смайлы всплывают но также не вставляются. Проверял в IE 8, opera 10.60, FF 3.6.6. Непонятно в чем причина…
avatar
Может антивирус блокирует таким способом всплывающие окна?
avatar
Сделайте же плагин))
avatar
а у мя не сработало. точнее доп кнопки не появились.
сделал почти все так же как и было описано за исключением 3 пункта, взял из указанного архива измененный файл и заменил ими файл engine/modules/text/text.class.php который стоял по умолчанию., по этому 4 пункт не выполнял. в итоге изменений не обнаружил. изгалялся на 4.2.0. подскажите где и что я пропустил или не сделал!!!
avatar
Если ничего не поменялось, то либо не правильно подключен, либо подключен не там, либо вовсе не подключен.
Пункт 5-й сделан? Если сделан и не работает то стоит обратить внимание на платные плагины. К примеру, у меня стоит плагин avadim-a (aceBlogExtender), который перекрывает вывод данного файла и для корректного отображения редактора нужно вносить аналогичные изменения в файл дизайна aceBlogExtender-а
avatar
такого плагина увы нету(((
avatar
Киньте в личку адрес сайта на котором не получается запустить редактор
avatar
сайт офлайн, но все равно спасибо за помощь
avatar
А у вас вообще включен редактор TinyMCE?
Если есть админка, очень легко проверить, заходите вашсайт/admin/site/settings/ и в группе «Редактирование», ставим галочку на пункте «Использовать визуальный редактор TinyMCE:»
Удачи!
avatar
а вот это самое интересное. галочка не стояла, но када я ее ставлю у мя полностью пропадает тулбар, то есть окошко для текста остается, а кнопочки над ним пропадают при чем все.
avatar
А у меня кнопка смайликов не появилась, подскажите, что нужно сделать?
avatar
Проверить еще раз, все ли Вы сделали по инструкции. Сегодня специально на тестовом домене поставил на чистый ЛС данный редактор (по инструкции). Все работает…
avatar
завтро на работе попробую все с 0 сделать. нужен лайв 4.2.0, админка к нему и твой архив и все? иил еще что то надо?
avatar
Для работы нужен сам LS 0.4.х т.к. редактор подменяет стандартный Tiny_MCE
Админка не нужна именно для работы редактора
avatar
не дошел я до работы дома все сделал а терь по пункта.
1. установил лс 4.2.0, админку самую свежую, поиск
2. начал действовать по описанным пунктам
а. скачал занова твой хак
б. копирую на сервер папку classes, пр иэтом она мне говорит что она хочет заменить ту что уже лежит на сервере, тада я открываю твою папку классы и вырезаю от туда папку либ и скидываю в папку классы на серве
в. engine/modules/text/text.class.php делаю хитрее. В архиве лежат два файла, первый и из который — родной (966 сборка — релиз 0.4.2), а второй — измененный. беру сразу измененный тобою и втыкаю его в папку по указанному пути, при этом старый файл удаляю а твой переименовываю так как он должен был быть.
г. 4 пункт не трогаю так как твой файл уже изменен. я проверял все ровно.
д. templates/skin/new/actions/actiontopic/add.tpl — делаю в точности как ты и написал.
е. templates/skin/new/comment_tree.tpl все так же
вот. немного отойду от повествования. када установил лс залез в админку и поставил галку по поводу «Использовать визуальный редактор TinyMCE» — потом проверил — да все работает тулбарка изменилась
ну вот и так после всех превращений в итоге я захожу в написание нового топика и у мя вообще нету тулбарки. пропала. где я лажанул????
avatar
Кажется понял в чем проблема.
Попробуй добавить в файл config/config.local.php эту строку
$config['view']['tinymce']          = false;  // использовать или нет визуальный редактор TinyMCE

При этом в админке поставь галочку «использовать TinyMCE»
Отпишись, поможет или нет.

P.s.: у меня тоже начал редактор «неадвекватно» себя весьти когда я экспериментировал с включением/выключеним его в админке (не админка виновата, а я горе-программер :)
avatar
Нет, проблема не в этом :) Более того, проблем аж две штуки

1. Копировать lib надо (вопреки инструкции) не в папку classes, а в папку engine (именно там находится оригинальная версия редактора, и именно туда указывает переменная path.root.engine_lib, которая используется в коде подключения нового редактора)

2. Папка с новым редактором называется tiny_mce, а в коде подключения написано tinymce, надо поменять либо там, либо там.
avatar
добавляю строку по твоему адрессу config/config.local.php и и ставлю галочку в админке, ничего не происходит, кстати в config/config.php уже есть эта строчка и она у мя фолсовая (false).
avatar
Почему у меня formatselect показывает названия типа advanced.block, advanced.paragraph и так далее, а не нормальные слова типа Формат, Параграф? Что и где надо подкрутить?

avatar
Это из кеша грузится. У меня было такое когда я в редакторе капался, после очистки кеша стал показыать то, что должен…

Вообщем-то, неоднократно народ просил это в плагин переделать, может все же найдется тот, кто оформит плагин?
avatar
И, кстати, а почему новый редактор сделан на базе древней версии tinymce 3.2.1, а не 3.2.7, которая включена в LS 0.4.2?
avatar
Как я писал выше, редактор я настаивал, когда в ходу была версия 0.3.1 и мена данная настройка полностью устраивает, поэтому перенес ее и в текующую версия (для себя)
avatar
Мгм… Ладно, попробую найти исходники 3.2.1, выделить изменившиеся части и прикрутить к 3.2.7. Не хочется даунгрейдить редактор.
avatar
от терь все заработало!!! спасибо SkyNet и barancev
avatar
Подскажите пожалуйста, что именно помогло. Добавлю это в топик.
avatar
1. Копировать lib надо в папку engine
2. Папка с новым редактором называется tiny_mce, а в коде подключения написано tinymce, я поменял название папки на tinymce. и все заработало)))

а теперь сложный вопрос. к примеру я хочу оставить стандартные кнопки которые шли при установке, но к ним хочу прикрутить смайлы из tiny_mce. такой вообще реально реализовать???
avatar
Обновил архив с плагином.
Исправлено несколько ошибок, из-за которых возникали проблемы при установке.
avatar
ничего не пойму, все сделал как написано, но все осталось так же, нету ни смайлов, ничего нового
версия лс — 0.4.2
avatar
удалил папку tinymce_3.2.7 и панелька исчезла, это значит что редактор не заменился?
avatar
Это значит, что пункт 5 не выполнен или выполнен, но не правильно.
Данный пункт может быть сделан, но не работать в том случае, если какой-то из плагинов у Вас перехватывает страничку написания топика (к примеру — aceBlogExtender). Если есть такой файл, то нужно и в него добавить по аналогии пункту 5.
avatar
смотреть, может чем-нибудь поможет, нашел в Казнете
avatar
помогите :)
добавил в разрешённые теги div, table, при публикации tinymce видит table, но не восприниамет class в теге div и id в теге table, в результате получаю таблицу без стилей и в голом диве и перед ним кучу
. что-то, наверное, надо ещё подкрутить в text.class.php, но не могу догнать, что конкретно :)
avatar
Кроме table нужно добавить еще ячейки таблицы: tr и td
Чтобы у тега table не вырезался class добавьте строку:
$this->oJevix->cfgAllowTagParams('table', array('class'));

аналогично с div-ом
$this->oJevix->cfgAllowTagParams('div', array('id'));

Добавлять строки по аналогии с существующими (там все просто — достаточно взглянуть на код)
avatar
спасибо! проделал эту операцию с table и div; все теги таблицы (td, tr, th, tbody) в разрешённые вставил. Теперь стили к таблице подключились, всё ок; но редактор вставляет перед таблицей кучу <br/>, отодвигая таблицу далеко вниз; в стилях таблицы margin и padding — 0.
avatar
тег br — больная тема… тут не подскажу :(
avatar
С тегом br всё просто
Сегодня сам вставлял таблицу и искал потом, откуда столько БРок перед ней.
Таблицу надо вставлять в одну строку, без переносов, тогда будет выглядеть нормально.
avatar
Спасибо за статью, друг-очень помог!
avatar
Спасибо. Единственно, слово заголовок пишется через букву «о». Мелочь, а режет глаз, тем более на фоне грамотного в целом текста.
avatar
интересует вопрос по 5 пункту но для 3.1 версии, как сделать?
  • job
  • 0
avatar
не понимаю что я не так делаю…
1. Скачал
2. Скопировал из архива папку engine на сервер в корневой каталог, там где точно такая же папка
3. В архиве лежало 2 файла, я взял файл «после» и содержимое из него заменил то что было в файле engine/modules/text/text.class.php
4.Нашел заменил, нашел заменил
5. и тоже нашел заменил нашел заменил
6. и тут эту строчку нашел и заменил

в итоге выглядит при добавлении топика —
в добавлении комментария —
avatar
да, всё верно у тебя так же
avatar
1) почистите кеш джаваскрипта своего браузера+кеш js лайвстрита и возможно кеш смарти
2) Изначально TinyMCE доступен только для топиков. Чтоб его включить для коментов юзайте плагин «редактирования коментов + TinyMce»
avatar
Народ! А подскажите, как в меню TinyMCE добавить тег
или заставить его правильно работать?
Проблема в том, что если даже в редакторе зайти в редактирование html-кода, написать скрипт, обрамить его в <code>
, то при выходе из этого режима, переносы строк удаляются.
  • Oden
  • 0
avatar
Извиняюсь, речь идет о теге
<code>
avatar
а как абзацы (тег ) в последней версии 0,5,1?
avatar
Столкнулся с Tiny MCE 3, когда передали сайт на Joomla. Вопрос вот в чем, разные странички по разному настроенным интерфейсом

в другом случае

Во втором случае активен стиль «Paragraf» и не удается его отменить. Где это настраивается?
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.