Установка CKEditor на Codeigniter и настройка загрузки изображений

Устанавливаем CKEditor на Codeigniter и настраиваем загрузку изображений
При работе над очередным сайтов появилась необходимость установить хороший визуальный редактор с поддержкой быстрой загрузки изображений. Выбор пал на CKEditor, так как заявленная функциональность вполне устроила, да и прежнюю версию под именем «FCKeditor» я как то ставил уже в одном из своих работ. После поисков в интернете и изучения различных инструкций всё-таки удалось внедрить этот визивик на сайт. В этом посте расскажу как установить визуальный редактор CKEditor при использовании фреймворка Codeigniter.

На момент написания этого поста
версия Codeigniter 2.0.2 (скачать можно тут http://codeigniter.com/)
версия CKEditor 3.6.2 (скачать можно тут http://ckeditor.com/)

 

Процесс установки:

1. Скачиваем архив CKEditor c http://ckeditor.com/download распаковываем и кидаем в корневую папку где установлен Codeigniter. У меня получилось вот такой листинг:

/application/
/ckeditor/
/images/
/system/
/.htaccess
/index.php

2. Затем создаем библиотеку с названием ckeditor.php в папке фреймфорка application/libraries
Получится application/libraries/ckeditor.php
В файл application/libraries/ckeditor.php копируем содержимое файла ckeditor/ckeditor_php5.php
Содержимое этого файла это готовый класс CKEditor, изменения в который можно не вносить — он уже рабочий.

3. Чтобы загрузить созданную библиотеку в контроллере (controllers) приложения, пишем стандартный код

4. Чтобы вызвать редактор в файле отображения (views) вместо тега textarea вставляем

Данный php код вставит в html код нечто вроде

и появится визуальный редактор.

5. Чтобы путь к папке /ckeditor/ не перехватывался фреймфорком нужно поправить файл .htaccess и внести в него правило для этой папки. У меня этот файл выглядит вот так:

AddDefaultCharset UTF-8
RewriteEngine on
RewriteCond $1 !^(index\.php|images|ckeditor|robots\.txt)
RewriteRule ^(.*)$ ./index.php/$1 [L]

это значит всё кроме указанных правил обрабатывается через index.php и передает фреймворку.

Загрузка изображений (файлов) в CKEditor:

По умолчанию этот визуальный редактор не загружает изображения и в нем эта возможность скрыта. Однако заставить его загружать изображения непосредственно в браузере не сложно. Для этого нужно сделать несложные действия:

1. Идем в папку /ckeditor/plugins/image/dialogs/image.js, находим строчку id:'Upload',hidden:true и меняем ее на id:'Upload',hidden:false
После этого сохраняем файл и смотрим в диалогов окне вставки изображения появится новая вкладка «Загрузить». Но файл загрузить нам еще не удастся, так как нужно позаботиться о скрипте, который это сделает.

2. В контроллере вашего приложения создаем функцию (метод) ckupload(). У меня контроллер назывался Adminka в нем я создал функцию ckupload вот с таким содержимым:

3. Чтобы редактор при загрузке изображения обращался к этой функции, открываем файл /ckeditor/config.js и добавляем в него одну строчку с настройкой config.filebrowserUploadUrl
После изменения этот файл должен быть похож на что-то вроде:

Так как у меня контроллер имеет название adminka и функция ckupload, значение config.filebrowserUploadUrl будет равно /adminka/ckupload/
Это настройка зависит от того, как у Вас будет называться контроллер и метод.

Вот и всё. Думаю не сложно. Но если появятся вопросы — пишите комментарии к посту. Постараюсь помочь.


На правах рекламы: любите азартные игры? тогда посетите игровой клуб — огромный выбор игр и развлечений на любой кошелек — всё доступно через интернет в режиме онлайн!


Если Вам интересны темы, про которые я пишу в своем блоге, то Вы можете Подписаться на обновления. Подписываться на новости и обновления можно по емайл или через популярные сервисы yandex и google!

Эта запись была опубликована в рубрике PHP кусочки, Полезное для w мастеров и отмечена метками , . Добавить в закладки ссылку.

22 в ответ на Установка CKEditor на Codeigniter и настройка загрузки изображений:

Добавить комментарий