Редактор Joomla: TinyMCE и CodeMirror. Пропал визуальный редактор в joomla
Редактор JCE: как заставить его не вырезать HTML теги
Дорогие друзья, уважаемые посетители сайта GeoDum.ru!
Сегодняшняя статья предназначена для тех вебмастеров, которые работают с визуальным редактором Joomla Content Editor (JCE), составляя, публикуя и редактируя с его помощью статьи в блоге/сайте на платформе Joomla.
Вы, вероятно, уже заметили, что, когда вы вставляете в статью текст, заключенный в HTML теги (естественно, в текстовом, а не визуальном режиме редактора), такие как например, <embed>, <object>, <iframe>, <div>, <span> и другие, то при сохранении статьи эти теги и заключенный внутри них текст исчезают. То же самое происходит и при переходе в визуальный режим и возврате обратно в текстовый. Это - типичная проблема для начинающего, да и порой опытного Joomla-пользователя, впервые столкнувшегося с этим явлением.
Но это не баг, а просто мера защиты сайта от вставки нежелательного и опасного содержимого, когда публиковать материалы позволено любым посетителям сайта (это определяется настройками прав в профилях посетителей). И это по умолчанию распространяется на всех редакторов материалов, в том числе и на самый верхний уровень прав – супер-администраторов, то есть вас самих.
Как же быть, если эти теги все-таки нужны, например, <iframe> для вставки видео?
В интернете этому вопросу посвящено несколько материалов. Наиболее подробные рекомендации изложены в посте «Настраиваем редактор TinyMCE так чтобы не вырезались теги». Этот материал, как видно из названия, относится к другому визуальному редактору. Моя попытка применить его к JCE в Joomla 2.5 (а JCE основан на TinyMCE) не увенчалась успехом. Эти меры оказались недостаточными. Поэтому я излагаю ниже те изменения в настройках редактора JCE и платформы Joomla, которые позволили мне добиться желаемого результата.
Итак, последовательность действий такова:
1. В Панели управления Joomla выбираем в меню Компоненты – JCE Editor – Global Configuration и выбираем настройки как на рисунке в рамках. Сохраняем настройку.
2. Выбираем Компоненты – JCE Editor – Profiles – Default – Editor Parameters – Advanced и в поле, отмеченном на рисунке рамкой, вписываем все теги, которые мы хотим не вырезать. Здесь все на ваше усмотрение. В моем примере вписаны нужные мне теги div, iframe (использую для вставки видео), span и allow (используется в плагине DisAllow для преобразования внешних ссылок во внутренние). Сохраняем настройку.
3. Остается еще один шаг. Выбираем Сайт – Общие настройки – Фильтры текста и для групп пользователей ставим нужные настройки. В частности, для Super Users ставим Нет фильтрации, то есть разрешен любой текст. Сохраняем настройку.
Вот теперь указанные мной выше теги будут сохраняться при сохранении статьи, а также при переходе между видами в редакторе (визуальный и текстовый виды).
Все, проблема решена.
Удачи вам, до новых встреч на страницах моего блога.
Если вас интересует излагаемая мной тематика статей, то вы можете подписаться на рассылку новостей на моем сайте. И тогда вы точно ничего не пропустите.
geodum.ru
Joomla редактор текста не работает
Короткий пост о визуальном редакторе Joomla 1.5 который возможно поможет решить проблемы некоторым читателям, а именно проблемы с родным визуальным редактором Joomla 1.5 который не работает.
Дело в том, что на некоторых моих сайтах Joomla уже не первый раз пропал визуальный редактор текста. Вот так вот ни с того ни с сего по непонятным причинам вдруг исчез установленный по умолчанию редактор текста TinyMCE Так как многие посетители пользуются движком Joomla решил поделится своей проблемой и способом ее решения. Пропал родной редактор ну и бог с ним он и так не особо радовал, но возникла потребность в поиске нового визуального редактора.
Попробовал текстовый редактор JCE но что то не понравился , слишком громоздкий. Затем стал искать визуальный редактор SPAW для джумла 1.0.15 который по сей день стоит на некоторых сайтах, но увы SPAW заточенный под 1.5 не нашел. В конце концов после поисков и раздумий какой текстовый редактор скачать и установить , остановился на JoomlaCK Отличный визуальный редактор с русской панелью и всеми необходимыми функциями все видно на скрине.
Joomla редактор текста
Так что если возникла проблема и не работает визуальный редактор текста на Joomla 1/5 вы можете скачать текстовый редактор JoomlaCK версия 3.4.6 Устанавливается как обычно, если не включен включается в меню «расширения-менеджер плагинов» Что бы установить редактор по умолчанию проходим в «общие настройки» и выставляем редактор там, а так же в меню пользователи-выбираем себя-и выставляем для себя нужный редактор. Ну вот и все, надеюсь, что кому то помог этим постом.
Не забывайте жать кнопочку +1
www.stef33.ru
Редактор Joomla: визуальный TinyMCE и CodeMirror
Всем привет! Редактор Joomla понадобиться нам для написания статей сайта, вот три стандартных варианта:
- многофункциональный визуальный редактор TinyMCE Joomla;
- редактор с подсветкой синтаксиса кода CodeMirror;
- самый суровый способ работы с материалами — совсем без редактора.
Выбрать редактор Joomla можно в настройках своего профиля, используя опцию «Редактор».
Визуальный редактор TinyMCE
Пожалуй, самый популярный визуальный редактор Joomla. Что же его делает таковым?
Его остоинства:
1. Главное достоинство — это, конечно, возможность работать с материалами Joomla даже не зная, что такое html. И правда, людям, у которых блог посвящен даче, кулинарии или вышиванию не очень хочется забивать голову каким-то html. Им он просто ни к чему. А тот же Word, интерфейс которого во многом копирует TinyMCE, знают практически все.
2. В версиях Joomla 2.5.х TinyMCE доступен сразу после установки Джумла. Зачастую люди сразу к нему привыкают и уже не ищут какой-либо альтернативы.
3. Функционал TinyMCE очень велик, поэтому пользователи совершенно не знакомые с html не будут чувствовать себя стесненными при форматировании текста материалов.
Недостатки
Они вытекают из достоинств TinyMCE. Он не дает полного контроля над кодом создаваемого материла, а автоматически создает его излишне «загрязненным» тегами с атрибутами стилей. Все-таки все стили следует выносить в отдельный файл и привязывать их к используемым html тегам за счет классов и идентификаторов.
Еще одним недостатком является невозможность вставки скриптов на php или javascript. При сохранении они просто удаляются.
Как работать с TinyMCE
Почему его называют визуальным? Все очень просто — материал в TinyMCE показывается точно так, как он будет отображаться на странице сайта. Нет никакого html кода, только функциональные кнопки над окном ввода текста, которые позволяют отформатировать его по вашему желанию. По интерфейсу и принципу работы TMCE напоминает текстовые редакторы, самые популярные из которых Microsoft Word и его бесплатный аналог OpenOffice Word.
Если не знаете назначение какой-либо кнопки, то просто наведи на нее курсор мыши, и появится справка на русском языке.
Хочу отметить некоторые моменты.
Редактирование html кода
Пусть вы не видите html код, но для форматирования текста именно он и используется. Чтобы его увидеть и в случае необходимости отредактировать, используйте кнопку HTML или просто выключите на время редактор.
Логично было бы предположить, что при выключенном редакторе скрипты все таки можно вставить, но, к сожалению, это не так. При сохранении они все равно удаляются. Поэтому советую для этих целей использовать второй редактор — CodeMirror, у него проблем таких нет.
Вставка картинок
Для загрузки картинки на сервер и последующей вставки ее в текст материала, воспользуйтесь кнопкой «Изображение».
В центральном поле появившегося окна, представлена структура каталогов папки /images, в которой хранятся все изображения Joomla. В нижнем углу можно увидеть кнопку «Обзор», используя которую выберете необходимую картинку со своего компьютера. Для загрузки ее на сервер нажмите на появившуюся кнопку «Загрузить».
Теперь изображение автоматически загрузится на сервер и будет доступно в центральной области. Выберете картинку, укажите для нее описание, заголовок и выравнивания и нажмите кнопку «Вставить» в правом верхнем углу.
Для дальнейшей настройки изображение выделите его и воспользуйтесь кнопкой «Добавить/изменить изображение».
Откроется окно, в котором помимо заголовка и выравнивания можно настроить размеры, границу и отступы (указывайте с величиной измерения, например, 2px, 5px).
Расширенный режим
Почему люди ищут альтернативу TinyMCE? Потому что считают, что он предоставляет недостаточное количество функциональных кнопок для форматирования материала. Они просто не знают, что по умолчанию используется стандартный режим, а ведь есть еще и расширенный!
Переходим в менеджер плагинов, находим в списке «Редактор — TinyMCE» и жмем на него. Попадаем в его настройки.
Основных параметром достаточно много, но, пожалуй, единственный из них, который заслуживает внимание — это Режим. Выбираем расширенный.
Теперь TinyMCE выглядит следующим образом.
Впечатляет? Еще бы! Тут и добавление таблиц, и вставка текста из Word, смайликов, разделителей, клипов и еще вагон всевозможных полезных и не очень фишек. Обо всех кнопках рассказывать не буду, ибо к каждой есть подсказка на русском языке, по которой становится понятно ее назначение.
Русификация TinyMCE
Вопрос русификации Tiny я уже затрагивал при рассмотрении русификации Joomla в целом. Дабы не отправлять вас перечитывать ту статью, я решил несколько повториться и рассказать об этом здесь.
Для русификации TinyMCE нам потребуется русский языковой пакет. Где его можно взять? С сайта joomlaportal.ru. Скачайте «Пакет русской локализации Joomla 2.5.х».
Распаковав полученный архив, вы обнаружите в нем еще три архива. tinymce_ru-RU.zip — это и есть русский языковой пакет для TinyMCE. Распаковывать его не надо. Заходим в админку Joomla и с помощью менеджера расширений устанавливаем данный языковой пакет. Теперь его следует активировать (если это не произошло автоматически).
Переходим в менеджере расширений в раздел «Управление». В списке всех доступных расширений находим TinyMCE ru-RU и включаем его. На этом русификация TinyMCE закончена.
Редактор Joomla с подсветкой синтаксиса кода CodeMirror
Вторым стандартным редактором для Joomla является CodeMirror. Назвать его визуальным язык не поварачивается — он только подсвечивает синтаксис кода, который вы вводите вручную. Будет полезен для людей, которые хорошо знакомы с кодом и привыкли с ним общаться напрямую.
Достоинства
Подсвечивает синтаксис кода и добавляет нумерацию строчек — и на том спасибо. Здраво воспринимает скрипты, а не зачищает от них код.
Приведу простой пример, когда может понадобиться использовать скрипты: вывод социальных кнопок на страницы сайта через модуль HTML-код. Код социальных кнопок состоит из двух частей: скрипта, отвечающего за функционал, и html кода, отвечающего за вывод кнопок на сайт. TinyMCE обрезает скриптовую часть кода, поэтому социальные кнопки работать не будут. Просто используйте CodeMirror. После вставки скрипта в модуль и его сохранения, можете вновь переключится на Tiny, если он является для вас основным.
Недостатки
Для себя заметил только один существенный недостаток — отсутствует возможность добавлять, так называемые, «быстрые теги», которые позволяют не печатать каждый тег отдельно, а забить их на горячие кнопки, что значительно экономит время.
Конечно, для людей не знающих хотя бы основы html и css, CodeMirror покажется абсолютно бесполезным.
Работа с CodeMirror
Тут все делается в ручную: набиваем текст и вставляем html теги с атрибутами. CodeMirror только подсвечивает синтаксис кода, подобно тому же Notepad++.
Как видите, обязательно нужно знать HTML и CSS.
Режим «без редактора»
Ни разу не пользовался им. Просто даже не могу придумать задачу, которую нельзя было бы решиться с помощью одного из редакторов Joomla, описанных выше.
Функциональные кнопки, общие для всех редакторов
Если вы заметили, то под полем для текста располагаются функциональные кнопки.
Материал — вставка ссылки на уже существующий материал.
Изображение — загрузка картинки на сервер и вставка ее в текст материала.
Разрыв страница — позволяет представить текст материала постранично. На страницу добавляется содержание и постраничная навигация.
При вставке разрыва страницы, необходимо указать заголовок последующей страницы и ее название в содержании.
А вот так это выглядит на сайте.
Подробнее — весь материал до тега «подробнее» попадает в анонс материала.[stextbox]
Если в редакторе Tiny "Подробнее" не вставляется, следует открыть html форму материала и вставить следующий тэг вручную:
| <hr /> |
[/stextbox]
На этом же на сегодня все. Спасибо за внимание!
Лучший способ выразить благодарность автору - поделиться с друзьями!
Узнавайте о появлении нового материала первым! Подпишитесь на обновления по email:
Следите за обновлениями в Twitter и RSS.
fairheart.ru
