MarkitUP для новичков (или как добавить свои кнопки в редактор)

43




1. Введение

Заголовок говорит сам за себя — данная статья это итоги моего ковыряния в редакторе MarkitUP.
Все началось с того, что на сайте сообщества появилась небольшая статья о том как добавить кнопку в редактор (точнее это был вопрос) и в комментариях пользователь Shrike дал очень важные для меня наводки. После этого у меня появилась идея добавить пару новых возможностей в редактор:

  1. Цвет текста
  2. Выравнивания текста по центру, левому краю, правому краю
  3. Вертикальное выравнивание текста (sub, sup)


Их работу вы можете увидеть на скринах. Сразу хочу сказать, что если вам нужен такой редактор, как на скрине выше, и вы не хотите лазить в код, то вот прямая ссылка на архив (в архиве есть readme по установке). Если же вам интересен сам процесс — то читаем дальше.

2. Цели и задачи

Итак, мне нужно было добавить 5 кнопок:

  1. Выпадающий блок с селектором цвета
  2. Выравнивание по левому краю
  3. Выравнивание по центру
  4. Выравнивание по правому краю
  5. Вертикальное выравнивание SUB
  6. Вертикальное выравнивание SUP


Самым легким для меня казалось горизонтальное выравнивание текста, которое я решил делать через div align="..."

Вертикальное выравнивание текста я делал соответствующими тегами sub и sup, предварительно настроив их стили в reset.css, т.к. по стандарту их функции там «убивают» через vertical-align: baseline;

Самым сложным для меня было сделать возможность менять цвет текста. К счастью, покопавшись на оф. сайте, я нашел дополнение к редактору, которое как раз и выполняло нужные мне функции — Tango palette.

Итак, составив себе план действий, я принялся за его исполнение…

3. Ход работы


3.1 Горизонтальное выравнивание текста

Первое что я сделал — добавил в /config/jevix.php исключения для тега div с параметром align (left, center, right). Для этого в файле /config/jevix.php делаем следующее:
1) Находим в самом начале
// вызов метода с параметрами
			array(
				array('ls','cut','a', 'img', 'i', 'b', 'u', 's', 'video', 'em',  'strong', 'nobr', 'li', 'ol', 'ul', 'sup', 'abbr', 'sub', 'acronym', 'h4', 'h5', 'h6', 'br', 'hr', 'pre', 'code', 'object', 'param', 'embed', 'blockquote', 'iframe'),
			),	
и добавляем в конце массива через запятую (после 'iframe') нужный нам тег 'div', чтобы получилось так:
// вызов метода с параметрами
			array(
				array('ls','cut','a', 'img', 'i', 'b', 'u', 's', 'video', 'em',  'strong', 'nobr', 'li', 'ol', 'ul', 'sup', 'abbr', 'sub', 'acronym', 'h4', 'h5', 'h6', 'br', 'hr', 'pre', 'code', 'object', 'param', 'embed', 'blockquote', 'iframe', 'div'),
			),	


Ниже в этом же файле, после
array(
				'img',
				array('src', 'alt' => '#text', 'title', 'align' => array('right', 'left', 'center', 'middle'), 'width' => '#int', 'height' => '#int', 'hspace' => '#int', 'vspace' => '#int', 'class'=> array('image-center'))
			),
добавляем
array(
				'div',
				array('align'=> array('left','center','right'))
			),


Итак, сами теги div начали работать в редакторе и парсер их не съедал, теперь мне нужно было добавить сами кнопки непосредственно в редактор. Для этого я добавил в файл /templates/skin/ВАШ ШАБЛОН/js/markup_settings.js, который отвечает непосредственно за сам редактор, данные об этих 3-ех кнопках (их нужно вставить в 2 места — для редактора постов и для редактора комментариев, если нужно, чтобы эти кнопки были и там и там):
{name: ls.lang.get('panel_left'), className:'editor-left', openWith:'<div align="left">', closeWith:'</div>' },
{name: ls.lang.get('panel_center'), className:'editor-center', openWith:'<div align="center">', closeWith:'</div>' },
{name: ls.lang.get('panel_right'), className:'editor-right', openWith:'<div align="right">', closeWith:'</div>' },

Сейчас у нас были даже сами кнопки, только вот они были «невидимыми», и чтобы сделать их полноценными кнопками мне осталось добавить только сами иконки. Для этого я нашел в Интернете небольшой пак с иконками и нарыл оттуда 3 иконки с выравниванием текста:


Эти 3 кнопки я добавил в /engine/lib/external/jquery/markitup/sets/default/images/, а стили кнопок я прописал в /engine/lib/external/jquery/markitup/sets/default/style.css:
.markItUp .editor-left a 	{ background-image:url(images/edit-alignment.png); }
.markItUp .editor-right a 	{ background-image:url(images/edit-alignment-right.png); }
.markItUp .editor-center a 	{ background-image:url(images/edit-alignment-center.png); }


На этом первый «раунд» был закончен.

3.2 Вертикальное выравнивание текста

Здесь делаем все по аналогии, единственное, что теги sub и sup уже разрешены в jevix.php по умолчанию, но запрещены в reset.css шаблона, что, по-моему, очень странно. Поэтому, для начала мы отредактируем файл /templates/skin/ВАШ ШАБЛОН/css/reset.css. Для начала из длинного списка тегов
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote... 
удаляем sup, sub, и в конец файла добавляем правильные значения
sup{ vertical-align:super }
sub{ vertical-align:sub }

Сейчас теги SUP, SUB уже работают в тексте и, опять же, нам нужно просто добавить сами кнопки в редактор, но мы то уже знаем как это делать.
В файле /templates/skin/ВАШ ШАБЛОН/js/markup_settings.js добавляем (в 2 места, если нужно чтобы было и в комментариях и в топиках):
{name: ls.lang.get('panel_sub'), className:'editor-sub', openWith:'<sub>', closeWith:'</sub>' },
{name: ls.lang.get('panel_sup'), className:'editor-sup', openWith:'<sup>', closeWith:'</sup>' },

Вставляем еще 2 иконки в /engine/lib/external/jquery/markitup/sets/default/images/, а стили кнопок прописываем в /engine/lib/external/jquery/markitup/sets/default/style.css:

.markItUp .editor-sub a  { background-image:url(images/edit-subscript.png); }
.markItUp .editor-sup a  { background-image:url(images/edit-superscript.png); }


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

3.3 Цветовой селектор

Как я уже ранее сказал, покопавшись на сайте автора MarkitUP, я нашел интересное дополнение которое как раз и предназначено для изменения цвета текста. Его оставалось немного адаптировать и прикрутить к нашему редактору, чем я и занялся.

Дополнение Palette вставляло в текст просто выбранный цвет, поэтому мне потребовалось решить через какой тег менять цвет. Чтобы не заморачиваться, я решил использовать старый, добрый font color="#...".
Для начала я добавил в /config/jevix.php исключение для тега font (добавляем 'font' через запятую сразу после нашего тега 'div' как в первом примере) с нужными нам параметрами:
array(
				'font',
				array('color'=> array('#FCE94F','#EDD400','#C4A000',
						      '#FCAF3E','#F57900','#CE5C00',
						      '#E9B96E','#C17D11','#8F5902',
						      '#8AE234','#73D216','#4E9A06',
						      '#729FCF','#3465A4','#204A87',
						      '#AD7FA8','#75507B','#5C3566',
						      '#EF2929','#CC0000','#A40000',
						      '#FFFFFF','#D3D7CF','#BABDB6',
						      '#888A85','#555753','#000000',))
			),

Дальше я добавил код из дополнения в наш любимый /templates/skin/ВАШ ШАБЛОН/js/markup_settings.js:
{	name:'Colors', className:'palette', dropMenu: [
				{name:'Yellow',	openWith:'<font color="#FCE94F">', closeWith:'</font>',		className:"col1-1" },
				{name:'Yellow',	openWith:'<font color="#EDD400">', closeWith:'</font>', 	className:"col1-2" },
				{name:'Yellow', openWith:'<font color="#C4A000">', closeWith:'</font>', 	className:"col1-3" },
				
				{name:'Orange', openWith:'<font color="#FCAF3E">', closeWith:'</font>', 	className:"col2-1" },
				{name:'Orange', openWith:'<font color="#F57900">', closeWith:'</font>', 	className:"col2-2" },
				{name:'Orange', openWith:'<font color="#CE5C00">', closeWith:'</font>', 	className:"col2-3" },
				
				{name:'Brown', 	openWith:'<font color="#E9B96E">', closeWith:'</font>', 	className:"col3-1" },
				{name:'Brown', 	openWith:'<font color="#C17D11">', closeWith:'</font>', 	className:"col3-2" },
				{name:'Brown',	openWith:'<font color="#8F5902">', closeWith:'</font>', 	className:"col3-3" },
				
				{name:'Green', 	openWith:'<font color="#8AE234">', closeWith:'</font>', 	className:"col4-1" },
				{name:'Green', 	openWith:'<font color="#73D216">', closeWith:'</font>', 	className:"col4-2" },
				{name:'Green',	openWith:'<font color="#4E9A06">', closeWith:'</font>', 	className:"col4-3" },
				
				{name:'Blue', 	openWith:'<font color="#729FCF">', closeWith:'</font>', 	className:"col5-1" },
				{name:'Blue', 	openWith:'<font color="#3465A4">', closeWith:'</font>', 	className:"col5-2" },
				{name:'Blue',	openWith:'<font color="#204A87">', closeWith:'</font>', 	className:"col5-3" },
	
				{name:'Purple', openWith:'<font color="#AD7FA8">', closeWith:'</font>', 	className:"col6-1" },
				{name:'Purple', openWith:'<font color="#75507B">', closeWith:'</font>', 	className:"col6-2" },
				{name:'Purple',	openWith:'<font color="#5C3566">', closeWith:'</font>', 	className:"col6-3" },
				
				{name:'Red', 	openWith:'<font color="#EF2929">', closeWith:'</font>',  	className:"col7-1" },
				{name:'Red', 	openWith:'<font color="#CC0000">', closeWith:'</font>',  	className:"col7-2" },
				{name:'Red',	openWith:'<font color="#A40000">', closeWith:'</font>',  	className:"col7-3" },
				
				{name:'Gray', 	openWith:'<font color="#FFFFFF">', closeWith:'</font>',  	className:"col8-1" },
				{name:'Gray', 	openWith:'<font color="#D3D7CF">', closeWith:'</font>',  	className:"col8-2" },
				{name:'Gray',	openWith:'<font color="#BABDB6">', closeWith:'</font>',  	className:"col8-3" },
				
				{name:'Gray', 	openWith:'<font color="#888A85">', closeWith:'</font>',  	className:"col9-1" },
				{name:'Gray', 	openWith:'<font color="#555753">', closeWith:'</font>',  	className:"col9-2" },
				{name:'Gray',	openWith:'<font color="#000000">', closeWith:'</font>',  	className:"col9-3" }
			]
		},

* — повторюсь, что все коды, которые мы добавляли в файл markup_settings.js нужно добавлять 2 раза, если вы хотите, чтобы новые кнопки были доступны и в комментариях.

Теперь нам осталось добавить стиль для кнопки. Вставляем еще 1 иконку в /engine/lib/external/jquery/markitup/sets/default/images/, а стиль селектора цвета прописываем в /engine/lib/external/jquery/markitup/sets/default/style.css

Я думал, что на этом все и закончится, но, почему-то выпадающий список с цветами не выпадал. Я долго не понимал в чем проблема, пока не узнал, что используемая тема Simple для редактора MarkitUP не разрешает выпадающие кнопки в редакторе. И тут мне пришлось немного перелопатить файл /engine/lib/external/jquery/markitup/skins/simple/style.css. Скажу честно — не помню что именно я менял в файле, помню что просто много мелких элементов, поэтому выкладываю содержимое файла целиком.

4. Вывод

Данную фичу я пробовал на шаблонах new-jquery и social-jquery по типу «залить новые файлы, перезаписывая старые и не лезть самому в код» — и все работает.
В статье я показал как добавлять кнопки в редактор. Информация конечно далеко не новая, но, в любом случае, возможно новичкам она пригодится. От себя хочу сказать — обязательно навестите раздел с дополнениями к MarkitUP, вы там найдете много интересного.

Кое-что еще

В новой версии LS (тобишь начиная с версии LS 0.6) файл настроек будет лежать здесь — /engine/lib/internal/template/js/settings.js и вызываться так:
ls.settings.getMarkitup()


Всем спасибо за внимание, с ув. Frankenstein ;)
Источник

Комментарии (77)

RSS свернуть / развернуть
Интересно. Но зачем 2мя топиками? из-за длинны css-ок? так зачем их полность публиковать? можно просто ссылки на файлы бросить, а файлы куда нибудь залить
+1
Да, из-за css-ок. Согласен с вами, поправил статью, убрал часть кода в файлы по ссылкам.
+2
Это не просто интересно, это просто то что нужно!
Спасибо огромное)
+1
  • avatar
  • Lexx
  • 01 апреля 2012, 17:15
То что нужно! Огромное спасибо!

Еще бы очень хотелось узнать как в MarkItUp поставить смайлы и научить его BBcode
+1
там вроде по ссылке есть Bbcode, смайлы в нём работают от плагина Qip smiles (иконки туда любые можно подставить).
0
Не совсем понимаю зачем прикручивать BB-коды? MarkitUP существует несколько видов, типа: HTML, BBCodes, Wiki sintax. К ЛС прикручен HTML-пак. По-моему он даже удобнее.
На счет смайлов — можно сделать на основе селектора цветов — выпадающее меню с выбором смайлов и определенной настройкой markup_settings.js.
0
В планах сегодня-завтра доделать кнопки для создания фотоблоков внутри поста, для создания таблиц и, наверное, уже и смайлы.
0
Ну ведь не все используют ЛС для IT-направленных тематик :) Например для сети по компьютерным играм BB-коды намного удобнее, т.к. практически все форумы и оф.сайты игрушек используют именно их. Я в общем-то отношусь к тем, кому посвящена статья :) Не смог разобраться как сделать BB-коды, отталкиваясь от официальной информации. У меня получалось сделать BB коды при оформлении поста, но при отправки текст вместого такого, выглядел [b]вот так[/b] (то есть, редактор как бы не воспринимал BB-теги)
0
Принцип примерно такой — качаете сначала сет для кодов и делаете по аналогии — добавляете в ксс классы и меняете соответственно markup_settings.js
Потом качаете парсер для ббкодов тоже с офф сайта markitup и подключаете в markup_settings.js.
И, по сути должно все заработать, но почему-то не работает) Предполагаю, что это из-за jevix. Если кто знает, надеюсь ответят вам в комментах.
0
Парсер забыл скинуть.
0
Что добавить свой парсер — смотреть нужно engine\modules\text\Text.class.php — там парсер текста на основании разрешенных тегов из jevix.php
Я тут отвлекся ...
… я взял плагин Спойлер, вставил в него парсер BB-кодов BBCode2Html, «скормил» тест и на выходе получил отформатированный тест.
ТАК ЧТО РАБОТАЕТ
+1
Текстом после редактора занимается парсер.
+1
У меня так и не получилось :( Можете на примере показать, как в парсер вставить тег [b] [/b]? У меня он после публикации все равно не определяется и просто пишет [b]текст[/b]
-1
В понедельник, т.к. на работе эксперементировал
0
Если есть возможность, напишите пожалуйста по BBcode подробнее
0
Для начала с markitup.jaysalvat.com скачиваем парсер BBcode markitup.bbcode-parser.zip. В нем файл markitup.bbcode-parser.php. «Выдираем» берем из него целиком функцию BBCode2Html.
В плагине Спойлер файл plugins\spoiler\classes\modules\spoiler\Spoiler.class.php
Перед
public function Parser($sText)
вставляем функцию BBCode2Html
Нужно определить путь к смайликам например в начале функции
private function BBCode2Html($text) {

$sEmoticonsURL = Plugin::GetTemplateWEBPath('PluginSpoiler')."images/emoticons/";
...
, заменить EMOTICONS_DIR на $sEmoticonsURL и не забыть положить туда картинки
Окончательный штрих
public function Parser($sText)
	{
		$sResult = parent::Parser($sText);
		$sResult = $this->SpoilerParser($sResult);
		$sResult = $this->BBCode2Html($sResult);
		return $sResult;
	}
«натравливаем» парсер BBCode на исходный текст.
Замечание — кроме «трансляции» BBCode в HTML этот парсер расставляет <р>, удаляет <Ьr/> для некоторых тегов. см. исходный код
0
Спасибо! Сделал все как вы описали, работает, но после добавления:
$sResult = $this->BBCode2Html($sResult);

перестает реагировать кнопка «предпросмотр» при создании/редактировании топика. В чем может быть проблема?
0
Странно.
У меня предпросмотр работает.
0
А кто знает, как сделать в нём отступ как красная строка? Либо элемент отдельный, либо просто чтобы он не съедал пробелы?
0
  • avatar
  • Lexx
  • 01 апреля 2012, 18:20
Могу предложить очень странный вариант)
В markup_settings.js заменить
onTab:   {keepDefault:false, replaceWith:'    '},
на
onTab:    {keepDefault:false, replaceWith:'& nbsp;& nbsp;& nbsp;& nbsp; <!--Красная строка--> '},
. Сохраните файл в UTF-8 без BOM, очистите кеш. Теперь при нажатии на TAB будет вставляться действительно Красная строка :)

*между & и n в новом коде уберите пробелы, т.к. их парсер съедал и я добавил, чтобы сохранить код.
0
Спасибо вам большое, помогло)
0
В новой версии LS файл настроек будет лежать здесь — /engine/lib/internal/template/js/settings.js и вызываться так:
ls.settings.getMarkitup()
+2
  • avatar
  • ort
  • 01 апреля 2012, 21:45
Инфу добавил к пост на будущее.
0
а выравнивание по ширине вы будете добавлять?
0
или можно ссылку на пак, чтобы я сам попробовал добавить)
0
Какой пак? Официальный сайт MarkitUP вот тут, может я не понял чего-то.
Чтобы сделать выравнивание по ширине нужно сделать div align=«justify». Я показал пример как сделать другие выравнивания, это легко можно сделать по аналогии. Иконку предложу из того-же пака что и предыдущие —
0
пак, где изображения лежат)
0
ура у меня получилось!!!
0
Если плагин «спойлер» выключить, то работает…
А если включить плагин «спойлер», то не работает (пропадают кнопки)
+1
Шаманьте тут: /plugins/spoiler/templates/skin/default/js/markup_settings.js
+2
А можешь подсказать что надо делать? А то спойлер очень нужен.
-2
Включить плагин spoiler.
Если нужно добавить кнопки — то правим файл /plugins/spoiler/templates/skin/default/js/markup_settings.js (вместо указанного в топике templates/skin/ВАШ ШАБЛОН/js/markup_settings.js).
Всё.
0
А какой код вставлять?
0
Если просто спойлер нужен — активируйте плагин спойлер.
Если нужно вставить доп. кнопки — смотри мой комментарий выше.
0
Просто если отрубить спойлер, Фон сайта становится белым (на шаблоне Social скин Movie). А если активировать плагин, то кнопочки пропадут.
0
Я же все доступно описал.
0
Как-то все нелогично с фоном :)
nartuk пытался сказать, что все действия, описанные в топике нужно проводить в файле /plugins/spoiler/templates/skin/default/js/markup_settings.js, а не в templates/skin/ВАШ ШАБЛОН/js/markup_settings.js, т.к. он подменяется файлом из плагина.
0
Спасибо выручаешь всегда.
0
Да это понятно… я это обошел… но плагин Lite image (multiupload) перестал работать тоже…
Вообщем тщательней советовать надо… или плагины тщательнее стряпать… — одно из трех…
0
1. Не очень красиво с вашей стороны указывать на то, что я еще не «очень тщательно вам посоветовал что делать». Делайте тогда все сами и не слушайте советов — у вас все будет заебись.
2. Одно из двух ;)
+1
Я вам не грубил, уважаемый… я указал на нестыковки для тех, кто будет использовать ваш хак…
0
А я все-таки не считаю корректным с вашей стороны говорить, что «автор не проверил хак на совместимость с 200+ плагинами». Согласен, что нужно учитывать как можно больше мелочей, что я и пытался. Мне дали репорт о плагина спойлер — я подсказал как исправить. Вы же не дали репорт а сразу начали указывать, что я якобы безолаберно посоветовал вам как нужно что-то делать.
В крайнем случае — статья это не руководство к действию, это «мой опыт от ковыряния в редакторе», как я и указал в статье.
+1
репорт про «спойлер» я вам же и дал…
Поймите правильно, что я основываюсь на логике…
Плагины прошли модерацию и что мне остается думать...?
Но еще раз повторяю, что мои подсказки были адресованы не вам, а тем, кто будет ставить ваш хак
0
почему выравнивание текста через «div»? почему не через «p»?
0
Вы можете сделать через «p», я просто показал пример :)
+1
Спасибо за труды
скачал готовый вариант сделал все по инструкции- не работает
версия 5.1
шаблон evolution
с нетерпением жду рабочий вариант со смайликами, возможностью изменять шрифт и размер
0
От шаблона не должно зависеть. Проверяйте какие у вас плагины установлены, может как раз что-то из плагинов мешает.
Я проверял на нулевой ЛС 0.5.1 и шаблонах new-jquery и social-jquery — все работает по схеме «просто перезалить новые файлы». А по инструкции вроде как тем-более должно работать.
0
Осталось все выше сказанное «прямыми» руками в плагин упаковать
+1
ух ты. не поверите, но тот факт, что в LS используется markitUp стал для меня откровением ))
0
а. это с версии 0.5
0
Не поверите, но я тоже только от вас узнал, что markitup используется только с 0.5, хотя сам узнал о движке еще с 0.3.1)
0
Прикрутил цветовые селекторы и выравнивание. Перестало правильно работать цитирование – выделенный текст после нажатия соответствующей кнопки не вставляется. Вставляются только парные html-теги
<blockquote></blockquote>

Что может быть?
0
см. в markup_settings.js что с panel_quote
0
Отключил плагин spoiler, вернул оригинальные markup_settings.js в папке плагина и в папке темы. Не помогло. Цитирование не работает как надо. Выделенный текст не вставляется. Вставляется только парные html-теги.

Еще идеи?
0
Опытным путем удалось выяснить, что виноват W1\markitup\jquery.markitup.js. В отличие от оригинального, из него вырезан кусок ф-ции get() c 417 по 429 строки (включительно).
// get the selection by outer text
selectionOuter = '';
if(window.getSelection){
	selectionOuter = window.getSelection().toString();
} else if(window.document.selection){
	var sel = window.document.selection.createRange();
	selectionOuter = sel.text || sel;
	if(selectionOuter.toString) {
		selectionOuter = selectionOuter.toString();
	} else {
		selectionOuter='';
	}
}
Возврат оригинального jquery.markitup.js на место, исправляет цитирование. Не пойму для чего был вырезан этот кусок?
0
Выводы:
— Не надо бездумно что-то менять.
— Всегда делайте бэкап перед изменениями.
— Удача — иметь светлую голову и «прямые» руки
0
Очень странно, видимо я зацепил файл не из движка, а из стандартного сета markitup, потому что работал изначально с ним, поэтому получилось так. Архив перезалил.
0
Не пойму для чего был вырезан этот кусок?
это не вырезанный кусок — это доработанная часть редактора для выделения текста в LS
0
Значит я все-таки зацепил файл из стандартного пака markitup. Сейчас уже все нормально.
0
Кеш после каждой операции сбрасывал (если, что). Изменение панели инструментов происходило без проблем. Страницы обновлял.
0
вот это бы в стандартную поставку ЛС, та ещё чуть приукрасить. типография в ЛС хромает.
и сделать пару профилей редактора, которые будут назначаться в конфиге (напр., расширенный, стандартный, супер расширенный).

Автор молодец.
+4
всё работает вышесказанное, но не могу найти где прописать альты к значкам кнопок. можете подсказать?
0
в markup_settings.js
markupSet:  [ 
			{name: ls.lang.get('panel_b'),
0
опс, поспешил
Вообщем name это
0
Задам вопрос по-другому. Сейчас тот же 'panel_b' отображается как «жирный», моя же 'panel_fotorama' вообще никак не отображается. Где файл, где можно присвоить все эти значения? Перелопатил всю папку маркитапа. Это что-то стороннее чтоли?
0
templates\language\russian.php
0
О! Это полезно, спасибо =)
0
Всё равно не добавляется. Причем, если меняю старые надписи — они изменяются, а новый не хотят добавляться…
0
Вроде суть проблемы понял, получается, что кнопки добавляются из установленного плагина aceBlogextender, + из маркитап файлов и здесь какая-то несостыковка происходит… буду разбираться
0
Совсем забыл. Нужно еще подгрузить их в шаблон
для добавления топика в \templates\skin\new-jquery\actions\ActionTopic\add.tpl
ls.lang.load({lang_load name="panel_b,panel_i,panel_u,panel_s,panel_url,panel_url_promt,panel_code,panel_video,panel_image,panel_cut,panel_quote,panel_list,panel_list_ul,panel_list_ol,panel_title,panel_clear_tags,panel_video_promt,panel_list_li,panel_image_promt,panel_user,panel_user_promt"});

добавляем в конец списка
также для других экшинов photoset, blog, talk
для комментов \templates\skin\new-jquery\comment_tree.tpl
+1
Добавлю, для пользователей aceBlogextender, тоже самое находится в
plugins\aceBlogextender\templates\skin\default\actions\ActionTopic\mtopic-add.tpl
0
А вы сделали кнопку фоторамы? А как вы это сделали? Может, пост напишете? Как подключить фотораму — понятно, а как кнопку сделать — нет.
0
Всё делается так же, как и выше описано. Это в /templates/skin/ВАШ ШАБЛОН/js/markup_settings.js
{name: ls.lang.get('panel_fotorama'), className:'editor-fotorama', openWith:'<div class="fotorama">', closeWith:'</div>' },

Кнопку в style.css
И прописать div в jevix.php, если вдруг не прописан.
До этого конечно надо, чтоб фоторама работала в обычных топиках. У меня aceBlogExtender и почему-то если прописывать .css и .js в header шаблона, то не пашет фоторама в обычных топиках, пришлось прописать в topic-type.tpl. Если нет этого плагина, то думаю заработает, если прописать соответствующие файлы в header.tpl вашего шаблона
0
а можно пример как прописать?
0
Как я сделал у себя для tinymce кнопку изменения цвета текста:
Всё как в шапке только в /config/jevix.php все допустимые цвета для font

array(
     'font',
     array('color' => '#text')
),

В инициализации tinymce (в шаболоне) добавим кнопку выбора цвета forecolor
Запретим конвертацию font в span convert_fonts_to_spans: false
Для цветного текста вместо span вернем font formats: {forecolor: {inline: 'font', attributes: {color: '%value'}}}

Думаю можно закрепить в шапке
+1
  • avatar
  • ff00
  • 08 апреля 2012, 10:51
И как выглядит


+1
  • avatar
  • ff00
  • 08 апреля 2012, 11:20
забавно цвета люди к редакторам подбирают :)
0
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.