Drupal 7 как подключить плагин ckeditor

Визуальный редактор для сайта под Drupal 7. Модуль CKEDITOR

Как вы понимаете из названия статьи, сегодня мы займёмся установкой визуального редактора для сайта. Такие редакторы пользуются популярностью среди заказчиков, которые как вы понимаете далеки от HTML, ну а разработчикам он не особо нужен. Самый популярный среди данных редакторов является CKEDITOR, скачать модуль для Drupal 7, можно вот отсюда. Итак приступим, вы скачали модуль и активировали, после чего в разделе «Конфигурация», у вас появится системное сообщение об ошибке:

Не нужно пугаться, так и должно быть, давайте посмотрим, что написано в нашем сообщении, переходим в «Отчёты->Отчёт о состоянии» или можно кликнуть по ссылке в сообщении выше «Странице статуса»

И видим, что Drupal нам сообщил, что не найдена библиотека CKE по заданному пути. Давайте это исправим, для начала нам необходимо скачать саму библиотеку (необходимо скачать именно библиотеку CKeditor). Теперь необходимо распаковать наш пакет и переименовать папку в ckeditor. И теперь нам необходимо перенести данную папку, на хостинг ваше сайта по пути

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

Теперь обновляем страницу с отчетами, и видим, что библиотека найдена.

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

Переходим в него. Видим, что нам доступны 2 профиля, которые идут из коробки Drupal, вы так же можете создать свои профили, их число не ограничено. Для примера я выберу профиль Full

Кликаем – «Изменить». Перед нами открывается масса настроек, такие как:

В данном разделе с настройками вы можете поиграться сами, ничего сложно в них нет. Теперь можно посмотреть, каким образом теперь выглядит редактор на нашем сайте

Как мы видим, всё у нас работает. В дальнейших уроках мы продолжим изучение данного редактора, и я покажу каким образом можно увеличить его возможности.

READ  Можно ли подключить услугу везде как дома мтс в другом регионе

Источник

Устанавливаем плагин Uppod для редактора Ckeditor

Сегодня продолжаем знакомство с визуальным редактором для сайта Ckeditor, а именно я продемонстрирую, как устанавливать дополнительные плагины для данного редактора. В качестве примера будем использовать довольно популярный плагин, который позволяет вставлять изображения, аудио и видео файлы, плагин – UPPOD. Приступим, как вы понимаете для начала нам необходимо скачать сам плагин, скачать можно вот отсюда, но кроме самого плагина нам понадобится плеер для этого плагина, скачать его можно вот отсюда, для скачивания вам понадобится регистрация на сайте, в этом нет ничего страшного. Итак, мы обзавелись всеми необходимыми файлами, так же нам нужен установленный и настроенный модуль Ckeditor, как это делается читаем вот здесь. Для начала давайте перенесём наш плеер на сайт, для этого в корне сайта я создам отдельную папку «player» и скопируем туда файл плеера – uppod.swf, т.е. конечный путь до плеера у вас должен выглядеть вот так:

Теперь подключаем сам плагин для нашего редактора. Для этого переходим по пути

И копируем туда папку с нашим плагином

Теперь произведём необходимые настройки для редактора, а именно нам необходимо прописать подключение плагина в редактор, и прописать вывод иконки плагина в тулбары редактора. Для этого открываем файл:

Который находится по пути

И пишем вот такую конструкцию:

Теперь выведем кнопку uppod в тулбар редактора, для этого достаточно в списке кнопок тулбара, через запятую, дописать наш плагин, должно выглядеть вот так:

Вы можете выбрать сами в какие тулбары добавлять кнопку, я для примера вписал ее для всех тулбаров. С подключением плагина закончили, теперь нам лишь осталось подключить плеер для плагина uppod, для этого открываем файл

Который находится по пути:

И вписываем путь до нашего плеера, который мы определили в начале статьи, напомню вам что плеер находится в папке player, конструкция выглядит вот так:

Не забываем сохранять изменённые вами файлы. Теперь нам необходимо настроить форматы вывода для профилей вашего сайта, для этого переходим на наш сайт, идём по пути «Конфигурация->Ckeditor» и кликаем изменить для необходимого вам профиля, я выберу в качестве примера «Full»

READ  Как подключить интернет на магнитоле через телефон по usb

И переходим в раздел «Внешний вид редактора». В пункте «Плагины», вы теперь видите ваш новый плагин «Plugin file: uppod»

Ставим галочку напротив него, что бы его активировать и перенесём кнопку плагина в используемые кнопки для тулбара

И кликаем «Сохранить». Давайте посмотрим, что у нас получилось на сайте

Видим, что нам теперь доступна новая кнопка, по клику по которой у нас открывается модальное окно, с возможностью загрузки файла (из списка необходимо выбрать чем является файл, аудио, видео или изображение)

давайте посмотрим, как это всё работает на примере аудио файла, для этого я создал отдельную папку на сервере нашего сайта под названием «music» и скопировал туда аудио файл, в модальное окно пишем следующее

И сохраняем. Видим, что у нас появился плеер для проигрования загруженного файла

С добавлением видео и изображения, настройки аналогичные. Замечу, что изменение размера для видео, аудио и изображений, а так так-же произвести изменение стилей и цвета фона плеера, можно в файле

Данного плагина, который находится по пути:

На этом с подключением данного плагина можно закончить.

Источник

Установка и настройка CKEditor в Drupal 7

Настраиваем CKEditor, чтобы редакторы не пачкали разметку.

В Drupal ниже 8 версии (которая скоро выйдет в бету), по-умолчанию нету никаких WYSIWYG редакторов, что как бы заставляет новичка впасть в недоумение. Разумеется народ ищет модули с редакторами, и почему-то, чаще всего попадают на модуль wysiwyg, но он уныл, реально, ввиду того что он поддерживает 100500 редакторов, он работает черт пойми как. Сколько я его пробовал, никак не могу с ним ничего толкового сделать. Да и куда вам 100500 редакторов текста?

В итоге я для себя уже давненько решил, что для задачи нужен один конкретный редактор который бы покрывал все мои необходимости. После долгих переборок я остановился на CKEditor. Он самый приятный на вид, хорошо кастомизируемый, а теперь еще в ядре Drupal 8.

Установка CKEditor

Настраиваем CKEditor для Filtered HTML

Для фула я не буду писать, по сути тоже самое, только очевидные изменения будут в пункте №3.

Там куча, уйма настроек: цвет редактора, оформление (замена css) и многое-многое другое. Я же остановлюсь на очень любопытной опции про HTML.

READ  Супер 3д ноль оптом как подключить

Настройка CKEditor для контент-менеджера

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

Контент-менеджер — головная боль для разработчиков, и “вирус” для сайта.

В общем ад начинается когда неопытные контент-менеджеры начинают копировать текст из документа и в тупую вставлять в редактор, а затем сейв, они то думают так: “Вроде как и в ворде”.

А то что там идет целый букет таких вот вещей:

Инлайн стили, классы, обертки, шрифты намертво прописаны. А гнать то будут на разработчиков, как обычно… Тип а что у нас шрифты во всех статьях разные, а что эти шрифты у меня работают а у друга нет (когда в ворде заюзали нестандартный для систем шрифт) и т.д., я думаю многие это ощутили на себе.

В общем я считаю что нормальный контент-менеджер должен эту грязь вычищать самолично и руками, отлично знать HTML и тогда всё будет в порядке, но такие — настоящая находка, поэтому я сейчас расскажу как рубил руки идиотам.

Для подобных неучей я создаю отдельный формат ввода, поэтому давайте и мы его создадим:

Всё, дальше бремя мы скинем на CKEditor.

В результате копипаста взамен того что было уже получаем чистенький код.

Я и сам пользуюсь таким редактором, ведь это удобно. Просто для себя я еще выношу кнопочку “Источник” чтобы я мог напрямую править html, по необходимости.

Для особо одаренных ¶

Бывают такие что и в таком варианте умудряются запоганить, поэтому в настройках CKEditor в разделе “Advanced options” включим “Force pasting as plain text” — т.е. что бы вы не вставляли в данный редактор, он его перегонит в обычный текст. Весь CSS, теги, вообще всё вырубается на корню. Пусть контент-менеджер поработает и поправит руками, зато код будет чистый. А там править то смехота.

Источник

Поделиться с друзьями
Как подключить и установить...
Adblock
detector