Каталог статей
Поиск по базе статей  
Статья на тему Интернет » Интересное в сети » Настраиваем FCKEditor самостоятельно

 

Настраиваем FCKEditor самостоятельно

 

 

FCKEditor logo

Достоинства FCKEditor — открытый код, поддержка и постоянные обновления от компании-разработчика, наличие активного сообщества и мультиплатформенность — вывели его в ряд лидеров среди аналогичных систем. FCKEditor не является CMS-инструментом в привычном смысле этого термина. Скорее это удобный конструктор, ориентированный в первую очередь на создание удобной и функциональной клиентской части редактора сайта. Основные возможности FCKEditor описаны в предыдущей статье. Все они доступны по умолчанию.

загрузка...

 

 

Достаточно загрузить архив текущей версии и установить его на свой компьютер. Но, как и большинство решений с открытым кодом, FCKEditor можно модифицировать в соответствии со своими требованиями.

Настройка редактора

Редактор FCKEditor построен по многозвенной объектной модели. Рабочие файлы размещены в папке /edit/ и называются fckeditor.расширение. Например, файл, реализующий редактор полностью на стороне клиента, называется fckeditor.js; ASP — fckeditor.asp; PHP — fckeditor.php и так далее. Файл содержит класс, который создает экземпляр объекта редактора (FCKeditor), и набор служебных функций. Так, FCKeditor_IsCompatibleBrowser определяет тип браузера на клиенте и вызывает соответствующий класс для реализации скриптов. FCKeditor.prototype._HTMLEncode производит замену недопустимых символов (угловых скобок, кавычек), причем список автозамены может пополняться разработчиком. Аналогичная функция в ASP-версии называется ReplaceText. Основное отличие версий для PHP, ASP, CFM от базовой версии для Javascript состоит в реализации функциональности не на клиенте, а на сервере. Сам же состав функциональных возможностей неизменен.

Объектная модель FCKEditor реализована в виде набора javascript-файлов. Их перечень и пути к ним задаются в файле fckpackager.xml. Если вы создадите свой класс в отдельном файле, не забудьте включить путь к нему таким образом: <File path="editor/_source/fckconstants.js" />. Обратите внимание, что для различных типов браузеров формируется собственная объектная модель. Настройка базовых параметров редактора, включая состав панели меню, производится в файле fckconfig.js. Одна из групп включает параметры настройки внешнего вида редактора: отображение границ, всплывающих окон, подсказок. Свойство ToolbarSets устанавливает состав элементов панели меню редактора:

FCKConfig.ToolbarSets["Default"] = [
 ["Source", "DocProps", "-", "Save", "NewPage", "Preview", "-", "Templates"],
 ["Cut", "Copy", "Paste", "PasteText", "PasteWord", "-", "Print", "SpellCheck"],
 ["Undo", "Redo", "-", "Find", "Replace", "-", "SelectAll", "RemoveFormat"],
 ["Form", "Checkbox", "Radio", "TextField", "Textarea", "Select", "Button", "ImageButton", "HiddenField"],
 "/",
 ["Bold", "Italic", "Underline", "StrikeThrough", "-", "Subscript", "Superscript"],
 ["OrderedList", "UnorderedList", "-", "Outdent", "Indent"],
 ["JustifyLeft", "JustifyCenter", "JustifyRight", "JustifyFull"],
 ["Link", "Unlink", "Anchor"],
 ["Image", "Flash", "Table", "Rule", "Smiley", "SpecialChar", "PageBreak"],
 "/",
 ["Style", "FontFormat", "FontName", "FontSize"],
 ["TextColor", "BGColor"],
 ["FitWindow", "-", "About"]
]

Рис. 1. Состав меню по умолчанию

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

Настройка собственных стилей оформления

Описания стилей панели меню (рис. 1) вынесены в файл fckstyles.xml. Фрагменты описания различных стилей оформления текста приведены ниже.

<style name="Custom Bold" element="span">
 <attribute name="style" value="font-weight: bold;" />
</style>

Приведенный фрагмент задает полужирный шрифт, который применяется при выборе bold из выпадающего списка «Тип шрифта» в панели меню. Базовые настройки содержат полужирный, курсив и подчеркнутый. Создав аналогичный узел, можно задать любое другое оформление шрифта: зачеркнутый, индекс, подчеркнутый и прочее. Точно так же создаются узлы для оформления других панелей в меню редактора: графических изображений, размера шрифта, заголовков.

Файл fcktemplates.xml содержит шаблоны структур веб-страниц. В документе по умолчанию содержится три шаблона: «Заголовок с картинкой», «Странный шаблон», содержащий заголовок в левом и основной текст в правом поле, и «Табличное оформление страницы». Шаблон формируется в CDATA, как показано для шаблона «Заголовок с картинкой»:

<Template title="Image and Title" image="template1.gif">
 <Description>One main image with a title and text that surround the image.</Description>
 <Html>
 <![CDATA[
 <img style="margin-right: 10px" height="100" alt="" width="100" align="left"/>
 <h3>Type the title here</h3>
 Type the text here
 ]]>
 </Html>
</Template>

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

Рис. 2. Загрузка файла

Управление загрузкой файлов на сервер

Вставка изображений, флеш-роликов, других файлов возможна только после их загрузки на сервер (рис. 2). В папке editor\filemanager\upload\ содержится набор папок по каждой используемой технологии: ASP, ASP.NET, PHP, CFM. В каждой папке содержится набор файлов, обеспечивающих настройку и проведение загрузки на сервер. Так, для ASP настройка проводится в файле config.asp, а класс загрузки определен в class_upload.asp; для ASP.NET — в файле upload.asp; PHP — config.php и upload.php соответственно. Для возможности загрузки устанавливаем параметр ConfigIsEnabled = True. Параметр ConfigUserFilesPath = "/userfiles/" определяет папку, в которую по умолчанию будут загружаться файлы. Методы ConfigAllowedExtensions и ConfigDeniedExtensions задают соответственно разрешенные и запрещенные для загрузки типы файлов.

Работу редактора FCKEditor можно существенно оптимизировать, загружая только те скрипты, которые реально используются в веб-приложении. Загрузка объектов и их состав определяются в файле fckscriptloader.js. Найдите в нем такой комментарий:

/* ### Scripts Definition List */

Он обозначает начало списка загружаемых объектов. Добавление объекта производится методом AddScript("имя объекта", параметры объекта). Например, таким образом:

FCKScriptLoader.AddScript("FCKConstants");

Более опытные разработчики могут также воспользоваться API-интерфейсом к редактору FCKEditor, который описан в файле fckeditorapi.js.

В статье мы рассмотрели некоторые наиболее часто востребованные возможности и функции настройки FCKEditor. Многозвенная модель, основанная на открытом коде и файлах настроек и конфигурации, позволит разработчику настроить или доработать представленный редактор для своих целей, интегрировать его в CMS-систему. Недаром FCKEditor сейчас стал одним из самых популярных веб редакторов и в мире, и у нас, в России.

Ссылки по теме




Статья получена: hostinfo.ru
загрузка...

 

 

Наверх


Постоянная ссылка на статью "Настраиваем FCKEditor самостоятельно":


Рассказать другу

Оценка: 4.0 (голосов: 16)

Ваша оценка:

Ваш комментарий

Имя:
Сообщение:
Защитный код: включите графику
 
 



Поиск по базе статей:





Темы статей






Новые статьи

Противовирусные препараты: за и против Добро пожаловать в Армению. Знакомство с Арменией Крыша из сэндвич панелей для индивидуального строительства Возможно ли отменить договор купли-продажи квартиры, если он был уже подписан Как выбрать блеск для губ Чего боятся мужчины Как побороть страх перед неизвестностью Газон на участке своими руками Как правильно стирать шторы Как просто бросить курить

Вместе с этой статьей обычно читают:

Детский конструктор «Собери сайт самостоятельно»

На страницах нашего издания уже говорилось о системе Parser, которая является простым и мощным языком программирования. С ее помощью можно создавать различные модули сайта, используя базы данных, таблицы, переменные и функции. Эта система предназначена, в первую очередь, для продвинутых пользователей, которые уже знают, что такое HTML, пользовались другими языками программирования и хотят облегчить свою работу.

» Интересное в сети - 2525 - читать


Настраиваем Интернет в&nb p;офисе

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

» Интересное в сети - 2341 - читать


Настраиваем таргетинг

Баннеры* — самый старый инструмент интернет-маркетинга. Тем не менее они и сегодня остаются наиболее распространенным средством рекламы в глобальной Cети. Вот только эффективность баннеров в последнее время очень невелика.

» Интересное в сети - 2908 - читать


Статистику получаем самостоятельно

Получение и обработка статистических данных о посетителях сайта может быть востребована по разным причинам. Реализация статистического анализа возможна несколькими путями. Можно поставить внешний бесплатный или коммерческий счетчик.

» Интересное в сети - 1818 - читать


Текстовый веб-редактор FCKEditor

Рис. 1. Текстовый веб-редактор FCKEditor Начать статью, по всей видимости, придется с банального утверждения: "Веб-ресурсы прочно заняли свою нишу на информационном и рекламном рынках, а интернет-офисы теперь не менее важны для работы с клиентами, чем обычные".

» Интересное в сети - 2516 - читать



Статья на тему Интернет » Интересное в сети » Настраиваем FCKEditor самостоятельно

Все статьи | Разделы | Поиск | Добавить статью | Контакты

© RusAdvice.Org, 2006-2014, при копировании материалов, прямая индексируемая ссылка на сайт обязательна.

Энциклопедия RusAdvice.Org