Рассмотрим еще раз самый качественный и продвинутый визуальный редактор материалов для Joomla 2.5/3.х. Широко функциональный инструмент позволяет существенно облегчить и ускорить процесс создания материалов для страниц Вашего сайта. Значительно богаче чем стандартный TinyMCE .
Текстовый редактор JCE (Joomla Content Editor ) это целый пакет расширений. На сайте разработчиков JCE можно скачать сам компонент JCE-Editor , плагины к нему и русификатор . Бесплатно у разработчиков выложен только один плагин - MediaBox .
Установка редактора JCE и плагина JCE MediaBox происходит стандартным способом: Расширения -> Менеджер расширений . Русификатор и остальные плагины устанавливаются через встроенный инсталлятор редактора JCE - Install Add-ons .
После установки, необходимо включить редактор JCE по умолчанию. Сайт -> Общие настройки
. В колонке "Редактор по умолчанию"
выставляем "Редактор - JCE"
.
При копировании и вставке текста из Microsoft Word или из интернета редактор копирует текст вместе со стилями и оформлениями. Редактор JCE не убирает этот “мусор”, и он потом проявляется на вашем сайте. Обычно текст сначала копируют в блокнот, а из него в Joomla.
Однако кое-что можно настроить в редакторе JCE так, чтобы оптимизировать эти манипуляции. В панели управления компонента во вкладке "Профили редактора" открываем шаблон Default .
На закладке Параметры плагина выбираем Буфер обмена и выставляем:
- Очистка Microsoft Word - "Всегда"
- Атрибуты классов - "Да"
- Удалять все SPANS - "Да"
- Удалять все стили- "Да"
Теперь вставка материала из Microsoft Word в окно редактора JCE с помощью той же комбинаций клавиш Ctrl-C и Ctrl-V или с помощью кнопки Paste в панели инструментов редактора будет осуществляться без ненужного хлама.
Еще один способ не углубляясь в настройки редактора JCE вставлять текст в дополнительное диалоговое окно которое вызывается нажатием иконки Вставить как Обычный текст . Этот способ более чише вставляет текст.
Большую часть работы с CMS Joomla занимает работа с текстом. И чтобы эта работа была более комфортной, хорошо бы подобрать себе инструмент по вкусу. В этой статье мы познакомимся с текстовыми редакторами, которые наиболее часто используются в Joomla. Это TinyMCE, Code Mirror и JCE. Первые два включены в дистрибутив Joomla. Редактор JCE является расширением сторонних разработчиков. Все три текстовые редакторы обеспечивают комфортную работу не только с текстом, но и с таблицами и изображениями.
Текстовый редактор TinyMCE
Редактор TinyMCE входит в стандартную сборку Joomla и относится к WYSIWYG редакторам. WYSIWYG это сокращение от английской фразы «What You See Is What You Get», что в переводе значит: «Что ты видишь, то ты и получишь». Другими словами это визуальный редактор, в котором пользователь сразу видит результат редактирования, максимально похожий на тот, что будет отображаться на сайте.
В состав Joomla, TinyMCE входит в виде плагина. Для изменения фунций плагина нужно открыть меню «Расширения», далее в «Менеджер плагинов», а затем в списке - плагин «Редактор – TinyMCE» и произвести изменения.
Текстовый редактор CodeMirror
В работе с сайтом на Joomla иногда возникает потребность в редактировании исходного кода. В визуальных текстовых редакторах есть функция для работы с HTML тэгами, но она, как правило, не корректно работает с текстами сценариев (скриптов). К тому же есть профессионалы, которым привычнее работать с материалами сайта в простом текстовом редакторе, используя HTML тэги. Поэтому в стандартный набор Joomla 2.5 входит простой текстовый редактор CodeMirror.
с, так же как и TinyMCE входит в состав Joomla в качестве плагина. . Его полезные свойства в полной мере проявляются при редактировании страниц и каскадных таблиц стилей шаблона, при установке различных счетчиков, скриптов, произвольных html – модулей и т. д.
Текстовый редактор JCE
Текстовый редактор JCE (Joomla Content Editor) по праву является одним из лучших текстовых редакторов для Joomla. Вместе с дополнениями, редактор JCE представляет собой целый пакет для работы практически с любым видом контента.
JCE является расширением Joomla и функционирует как компонент. Устанавливается редактор, как и все остальные расширения, через «Менеджер расширений». Сначала устанавливаем только компонент. Дело в том, что все дополнения для JCE устанавливаются через его внутренний установщик. После установки в меню «Компоненты» появится новый пункт – «JCE Editor», который в свою очередь содержит ещё четыре подпункта меню. Перейдём в подпункт «Install Add-ons»:
Нажимаем на кнопку «Browse», выбираем файл пакета локализации и кликаем по кнопке «Install Package». После установки, язык интерфейса редактора JCE изменится на русский. Теперь вы знаете, как устанавливать дополнения для этого текстового редактора и впоследствии сможете сами добавить нужный вам функционал.
На странице установки / удаления дополнений JCE в правом верхнем углу есть кнопка «Обновления». Если вы хотите содержать cms в актуальном состоянии, то следует периодически устанавливать обновления для JCE. К сожалению, JCE пока не обновляется через общий компонент обновлений расширений Joomla 2.5 и поэтому обновлять его придется отдельно.
В верхней части административного интерфейса JCE расположены четыре ссылки: «Панель управления», «Глобальная конфигурация», «Профили редактора», «Установка дополнений». С установкой дополнений мы уже разобрались, перейдём в панель управления JCE.
Панель управления редактора содержит актуальную информацию о JCE и кнопки доступа к настройкам. Например, кнопка «Браузер файлов» запускает простейший файловый менеджер, который работает в директории «Images» нашего сайта на Joomla. С помощью этого файлового менеджера можно создать папку, загрузить, удалить или переименовать файл, посмотреть его свойства. В правом верхнем углу панели управления JCE находится кнопка «Параметры», которая отвечает за настройку параметров компонента. В параметрах JCE можно настроить разрешения для доступа к разделам управления, ввести ключ обновления для коммерческих дополнений, изменить тип обновлений и ссылку сайта поддержки, включить или отключить ленту новостей JCE.
По кнопке «Глобальная конфигурация» или по одноименной ссылке вверху панели управления JCE переходим в панель настроек глобальной конфигурации компонента.
В этой панели можно настроить кодировку, стили редактора, разделители новых строк и т. д. Полезными опциями являются параметры сжатия. Рекомендуется включить настройки «Сжимать Javascript» и «Сжимать CSS» для ускорения загрузки. Настройки глобальной конфигурации применяются ко всему компоненту. А раз есть глобальные настройки, то должны присутствовать и локальные. Дело в том, что текстовый редактор JCE поддерживает профили. Т.е. можно сохранить определённый набор опция для какого-то конкретного пользователя или группы пользователей. Это очень удобно, когда над редактированием сайта работают несколько человек – можно настроить редактор в соответствии с требованиями, разрешениями и предпочтениями пользователя. Сохраняем изменения в глобальной конфигурации и переходим по ссылке «Профили редактора».
По умолчанию присутствуют два профиля: «Default» и «Front End». Кликаем на «Default» и знакомимся с настройками профиля.
С помощью этих настроек можно сконфигурировать JCE как угодно. Например, на вкладке «Особенности и Макет» можно добавить нужные кнопки на панели редактора или наоборот, удалить ненужные, можно задать надписи для кнопок и выбрать тему, можно отключить строку состояния. Настроек – масса
В этом уроке рассмотрим самый качественный и продвинутый визуальный редактор для создания материала для Joomla 2.5/3.х. Начнем с установки редактора и закончим выставлением его необходимых настроек для работы.
Редактор JCE в отличие от стандартного TinyMCE обладает отдельным компонентом, что делает его более функциональным и настраиваемым. Текстовый редактор JCE (Joomla Content Editor) это целый пакет расширений для работы с практически любым материалом. Широкий функционал инструментов, расположенных в рабочей панели редактора, позволяет значительно облегчить и ускорить процесс создания материалов для страниц Вашего сайта.
На сайте разработчиков JCE можно скачать сам компонент JCE-Editor, плагины к нему и русификатор. Бесплатно у разработчиков выложен только один плагин - MediaBox. О назначении плагинов я напишу в дополнительной статье. Платные плагины значительно расширяют функционал редактора JCE. В конце статьи я дам ссылку на скачивание плагинов из моей библиотеки расширений (без вредоносных скриптов и левых ссылок) У меня эти плагины работают на Joomla 2.5 и Joomla 3.х.
Итак заходим на сайт https://www.joomlacontenteditor.net/downloads/editor/joomla-3 и скачиваем последнюю версию редактора.
Затем скачиваем последнюю версию плагина JCE MediaBox for Joomla!3.
И наконец скачиваем пакет русификации для редактора.
Установка и настройка визуального редактора JCE для Joomla 2.5/3.х.
Установка редактора JCE и плагина JCE MediaBox происходит стандартным способом: Расширения
>>> Менеджер расширений.
Русификатор и остальные плагины устанавливаются через встроенный инсталлятор редактора JCE - Install Add-ons.
После установки заходим в Компоненты
>>> JCE Administration
Переходим на вкладку "Install Add-ons". Нажимаем Browse - выбираем архив русской локализации для JCE Editor и устанавливаем Install Package.
Точно таким образом устанавливаем необходимые плагины.
Переходим на вкладку "Общие настройки редактора". Здесь оставляем все по умолчанию.
Здесь выбираем "Установки"
В принципе здесь то же можно все оставить по умолчанию.
Вкладка "Особенности и макет"
– здесь вы можете отредактировать кнопки необходимые вам путем обычного перетаскивания из "Текущий макет редактора"
в "Доступные кнопки"
и также обратно. Смотрите рисунок ниже.
Вкладка "Параметры редактора" >"Очистить и вывести" – оставляем по умолчанию.
Вкладка "Параметры редактора" >"Типографика" – здесь тоже нас всё устраивает.
Вкладка "Параметры редактора" >"Файловая система" – оставляем без изменений.
Вкладка "Параметры редактора" >"Расширенные" – меняем "Нет" на "Да" Разрешить Javascript, Разрешить CSS, Разрешить PHP, Встроенные скрипты XHTML.
Теперь переходим к настройкам плагинов. Вкладка "Параметры плагинов" . Отмечаем все элементы форматирования .
Можете пробежаться по всем позициям: Формат, Разрыв статьи, Браузер файлов и т.д. Отдельно хочу остановиться на "Буфере обмена" .
При копировании и вставке текста из Microsoft Word в окно редактора JCE с помощью известных комбинаций клавиш Ctrl-C и Ctrl-V копируется много лишней информации, заключенной в стилях и тегах Microsoft Word . Их можно увидеть перейдя из визуального вида редактора JCE в HTML вид с помощью кнопки "Toggle Editor" . Дело в том, что редактор JCE не убирает этот мусор, что в свою очередь приводит к увеличению объема кода страницы и, как следствие, к увеличению времени ее загрузки. Поэтому, прежде чем вставить статью в окно редактора JCE, материал нужно сначала скопировать в блокнот, а из него в окно редактора JCE.
Однако можно настроить редактор JCE так, чтобы оптимизировать и сократить код без ущерба для вида страницы после вставки материала сразу из Microsoft Word.
Выставьте параметры как указано ниже.
Очистка Microsoft Word
-выбираем "Всегда"
.
Атрибуты классов - "Да".
Удалять все SPANS- "Да".
Удалять все стили- "Да".
Теперь вставка материала из Microsoft Word
в окно редактора JCE с помощью той же комбинаций клавиш Ctrl-C
и Ctrl-V
или с помощью кнопки "Paste" в панели инструментов редактора будет осуществляться без ненужного хлама.
После установки, необходимо включить редактор JCE по умолчанию. Для этого заходим в Сайт > Общие настройки > Сайт
. В колонке "Редактор по умолчанию"
выставляем "Редактор - JCE"
. Далее жмём "Сохранить и закрыть".
В "менеджере материалов" - "создать материал" видим окно редактора JCE и панель его инструментов.
P.S.
Если у вас при попытке, вставить изображение в статью во всплывающем окне неожиданно появятся "кракозябры" не огорчайтесь, просто нужно в файл administrator/components/com_jce/jce.php
после строчки: defined("_JEXEC") or die("RESTRICTED");
прописать следующую строчку: header("Content-type: text/html; charset=utf-8");
и все будет на русском языке.
Если у вас возникли вопросы напишите об этом комментарий. Спасибо за внимание!
На личном опыте я убедился, что наиболее удобный визуальный редактор для Joomla 3.x – это JCE, который обладает максимальными возможностями для оформления контента. Единственной проблемой может стать его правильная установка и настройка, поэтому их мы рассмотрим в данном уроке. Последняя проверка (и скрины) проводилась на Joomla 3.4.8.
Получение исходных файлов
В отличие от стандартных редакторов, JCE является компонентом, что значительно расширяет его функциональность и возможности настройки. Помимо основной программы, разработчики предоставляют множество плагинов для расширения функционала, но кроме плагина MediaBox, все остальные платные.
Затем качаем пакет русификации
И плагин JCE MediaBox for Joomla! 3
Установка и настройка редактора JCE для Joomla 3.x
Установка компонента com_jce_2516 и плагина plg_jcemediabox_122_joomla3 происходит обычным способом через Расширения – Менеджер расширений:
Русификатор для редактора JCE и дополнительные плагины устанавливаются только через встроенный инсталлятор компонента JCE:
Компоненты – JCE Administration – Install Add-ons
Для установки русификатора во вкладке Install Add-ons нажимаем на кнопку Browse, выбираем сохраненный архив jce_language_ru-RU_2514 и устанавливаем его, нажав на кнопку Install Package.
После этого переходим во вкладку «Общие настройки редактора», где оставляем все без изменений:
Переходим во вкладку "Профили редактора", выбираем шаблон Default
и нажимаем «Изменить»
В открывшемся окне выбираем «Установки», где можно ничего не менять:
Во вкладке «Особености и макет»
Данные во вкладках «Очистить и вывести», «Типографика» и «Файловая система» оставляем без изменений:
А во вкладке «Расширенные» отмечаем «Да» для позиций: Разрешить Javascript, Разрешить CSS, Разрешить PHP, Встроенные скрипты XHTML.
Теперь переходим в верхнюю вкладку «Параметры плагинов» и отмечаем «птичками» все элементы форматирования:
Наиболее важной я считаю «Буфер обмена», который позволит переносить контент непосредственно из MS Word. Ведь ранее мы не могли это делать напрямую, так как попутно копировалось много лишней информации, приводящей к увеличению размера кода страницы. А это, в свою очередь, приводило к заметному увеличению времени ее загрузки. Такую «служебную» информацию можно увидеть, перейдя в режим HTML при помощи кнопки «Toggle Editor». Вот и копировали мы сначала текст в «Блокнот», а уже из него (без лишнего кода) вставляли в редакторы Joomla.
Теперь же редактор JCE мы настраиваем таким образом, что он автоматически сокращает код страницы из Microsoft Word и оптимизирует его для прямой вставки материала. Выставляем параметры следующим образом:
Теперь можете вставлять материал из Word с помощью кнопки «Paste» панели инструментов или комбинаций клавиш Ctrl-C и Ctrl-V.
После сохранения:
надо включить редактор JCE, войдя в «Параметры» – «Общие настройки». Выставьте «Редактор - JCE» в ячейке «Редактор по умолчанию»:
Теперь в Менеджере материалов мы видим, что основной редактор – JCE:
Внимание!
administrator/components/com_jce/jce.php
после строки
defined("_JEXEC") or die("RESTRICTED");
пропишите строчку
header("Content-type: text/html; charset=utf-8");
На личном опыте я убедился, что наиболее удобный визуальный редактор для Joomla 3.x – это JCE , который обладает максимальными возможностями для оформления контента. Единственной проблемой может стать его правильная установка и настройка, поэтому их мы рассмотрим в данном уроке. Последняя проверка (и скрины) проводилась на Joomla 3.4.8.
Получение исходных файлов
В отличие от стандартных редакторов, JCE является компонентом, что значительно расширяет его функциональность и возможности настройки. Помимо основной программы, разработчики предоставляют множество плагинов для расширения функционала, но кроме плагина MediaBox, все остальные платные.
Последние версии копмонента, русификатора и бесплатного плагина :
Компонент JCE com_jce_2516 Depositfiles
Русификатор jce_language_ru-RU_2514 Depositfiles
Плагин plg_jcemediabox_122_joomla3 Depositfiles
Можете самостоятельно скачать с англоязычного сайта:
Заходим на сайт разработчиков по ссылке: joomlacontenteditor и скачиваем версию редактора, которая является последней на сегодняшний день.
Затем качаем пакет русификации
Установка и настройка редактора JCE для Joomla 3.x
Установка компонента com_jce_2516 и плагина plg_jcemediabox_122_joomla3 происходит обычным способом через Расширения – Менеджер расширений :
Русификатор для редактора JCE и дополнительные плагины устанавливаются только через встроенный инсталлятор компонента JCE :
Компоненты – JCE Administration – Install Add-ons
Для установки русификатора во вкладке Install Add-ons нажимаем на кнопку Browse , выбираем сохраненный архив jce_language_ru-RU_2514 и устанавливаем его, нажав на кнопку Install Package .
Подобным образом устанавливаем и дополнительные плагины:
После этого переходим во вкладку «Общие настройки редактора », где оставляем все без изменений:
Переходим во вкладку "Профили редактора ", выбираем шаблон Default
и нажимаем «Изменить »
В открывшемся окне выбираем «Установки », где можно ничего не менять:
Во вкладке «Особености и макет »
редактируем местонахождение кнопок, путем обычного перетаскивания из области «Доступные кнопки панели» в «Текущий макет». Ненужные перетаскиваем в обратном направлении.
в итоге (с вариациями) получаем:
Данные во вкладках «Очистить и вывести », «Типографика » и «Файловая система » оставляем без изменений:
А во вкладке «Расширенные » отмечаем «Да » для позиций: Разрешить Javascript , Разрешить CSS , Разрешить PHP , Встроенные скрипты XHTML .
Теперь переходим в верхнюю вкладку «Параметры плагинов » и отмечаем «V » все элементы форматирования:
Как видите, слева находится много вкладок, которые можете изучить самостоятельно.
Наиболее важной я считаю «Буфер обмена », который позволит переносить контент непосредственно из MS Word . Ведь ранее мы не могли это делать напрямую, так как попутно копировалось много лишней информации, приводящей к увеличению размера кода страницы. А это, в свою очередь, приводило к заметному увеличению времени ее загрузки. Такую «служебную» информацию можно увидеть, перейдя в режим HTML при помощи кнопки «Toggle Editor ». Вот и копировали мы сначала текст в «Блокнот», а уже из него (без лишнего кода) вставляли в редакторы Joomla.
Теперь же редактор JCE мы настраиваем таким образом, что он автоматически сокращает код страницы из Microsoft Word и оптимизирует его для прямой вставки материала. Выставляем параметры следующим образом:
Теперь можете вставлять материал из Word с помощью кнопки «Paste » панели инструментов или комбинаций клавиш Ctrl-C и Ctrl-V .
После сохранения:
надо включить редактор JCE , войдя в «Параметры » – «Общие настройки ». Выставьте «Редактор - JCE » в ячейке «Редактор по умолчанию »:
Теперь в Менеджере материалов мы видим, что основной редактор – JCE :
Внимание!
Часто бывает, что при попытке вставить изображение, во всплывающем окне появляются «кракозябры». Если вы наблюдаете аналогичное, проделайте следующую процедуру:
В файле
administrator/components/com_jce/jce.php
после строки
defined("_JEXEC") or die("RESTRICTED");
пропишите строчку
header("Content-type: text/html; charset=utf-8");
и все надписи обретут нормальный русскоязычный вид.
Желаю вам успешного написания сайтов!
Плагины для расширения функциональных возможностей редактора JCE, которые значительно расширят функционал сайта и упростят вашу работу с сайтом.
Набор инструментов которые можно смело отнести к категории избранных и перво-устанавливаемых для любого сайта работающего на CMS Joomla.
Читайте новое JCE PRO 2.6.2
Все плагины проверены и прекрасно работают на joomla 3.6
Плагин Emotions
Это плагин для вставки иконок смайликов в редакторе JCE.
После установки видим вот такую новую кнопку со смайликом в панели JCE редактора. При нажатии в всплывающем окне появляется панель смайликов. Удобно если вы часто используете какие либо иконки. По сути, это быстрый доступ и вставка изображений из заданной в настройках плагина папки.
Плагин File Manager - Менеджер файлов
Загрузка, переименование, удаление файлов самых разных форматов, а так же вставка ссылок на файлы с настраивающимся описанием. , которые включают дату файла, размер и значок. После установки плагина в панеле редактора появляется вот такая новая кнопка .
Плагин похож на Менеджер изображений, с той лишь разницей, что показывает и может производить манипуляции со всеми видами файлов, а не только с файлами изображений.
Плагин Image Manager Extended
Это расширенный менеджер изображений. Он наделён не только всеми свойствами стандартного менеджера изображений, но и некоторыми весьма внушительными дополнениями. Меня впечатлило то как он работает в загрузке изображений - можно закачивать сразу много изображений при этом подгоняя их в размере и с созданием миниатюр (эскизов). Так же умеет редактировать изображения: обрезать, изменять размер, поворачивать.
Ещё в функционале данного плагина есть вот такая примочка с наведением мышки на картинку:
После установки плагина в панели редактора появляется новая кнопка: . Родной менеджер изображений, мы в ручную убираем из панели из за его последующей ненадобности.
Плагин jce_caption
Данный плагин создаёт подпись для изображений с настройками её расположения.
Плагин Media Manager
Плагин для работы с медиа файлами через редактор JCE. Пример результата работы плагина можно оценить на странице Red Hot Chili Peppers , которая полностью создана только при помощи редактора JCE.
После установки видим вот такую новую кнопку в панели JCE редактора.
По интерфейсу абсолютно похож на Image и File Manager"ы, что значительно упрощает понимание и работу с данным расширением. Единственная разница в том, что плагин работает исключительно с медиа контентом.
Плагин jce_iframe
Вставка и редактирование встроенных элементов IFrame в контент сайта при помощи редактора JCE. После установки плагина кнопка не добавляется. Её нужно добавлять вручную в настройках профиля редактора во вкладке "Особенности" (нужно перетянуть мышкой в редактор).
Плагин JCE FullPage
Данный плагин позволяет теги МЕТА, HEAD и BODY для любого материала вашего сайта. Кнопка добавляется вручную в настройках профиля редактора.