This shows you the differences between two versions of the page.
Both sides previous revision Previous revision Next revision | Previous revision | ||
ru:how_to:editor_configuration_custom_files [2013/10/17 09:14] Arkady |
ru:how_to:editor_configuration_custom_files [2013/10/17 09:21] Arkady |
||
---|---|---|---|
Line 151: | Line 151: | ||
* добавьте новый файл стиля в параметр GSEDITOROPTIONS файла gsconfig.php\\ | * добавьте новый файл стиля в параметр GSEDITOROPTIONS файла gsconfig.php\\ | ||
- | <code>define('GSEDITOROPTIONS',"stylesSet: 'default:http://www.yourdomain.de/getsimple-root/themes/ckeditorstyles.js'");</code> | ||
- | |||
- | |||
- | Now with more details: | ||
- | * you need the advanced editor-toolbar to use the styles-combo-box. If you have not done yet, activate that toolbar.\\ <code>define('GSEDITORTOOL', 'advanced');</code> | ||
- | * add the stylesheet-definition to the Editor-Options:\\ | ||
<code>define('GSEDITOROPTIONS',"stylesSet: 'default:http://www.yourdomain.de/getsimple-root/themes/ckeditorstyles.js'");</code> | <code>define('GSEDITOROPTIONS',"stylesSet: 'default:http://www.yourdomain.de/getsimple-root/themes/ckeditorstyles.js'");</code> | ||
Line 162: | Line 156: | ||
Таблица стилей CKEditor содержит следующие стилевые правила: | Таблица стилей CKEditor содержит следующие стилевые правила: | ||
- | * Block-Styles (already defined, but can be overwritten) | + | * Стили блочных элементов (уже определены, но могут быть изменены) |
- | * Inline-Styles | + | * Стили строчных элементов |
- | * Object-Styles | + | * Стили объектов |
- | Define the category for the element you want to add here and edit the file at the relevant place. | + | Определите категорию для элемента, который вы хотите добавить, и отредактируйте файл в соответствующем месте. |
- | The syntax: | + | |
+ | Синтаксис: | ||
<code> { name : 'Computer Code', element : 'code' },</code> | <code> { name : 'Computer Code', element : 'code' },</code> | ||
- | or | + | или |
<code>{ name : 'Marker: Yellow', element : 'span', styles : { 'background-color' : 'Yellow' } },</code> | <code>{ name : 'Marker: Yellow', element : 'span', styles : { 'background-color' : 'Yellow' } },</code> | ||
- | or even | + | или так |
<code>{ | <code>{ | ||
name : 'Image on Left', | name : 'Image on Left', | ||
Line 185: | Line 180: | ||
},</code> | },</code> | ||
- | One definition must contain at least 2 parameters: ''name'' and ''element''. | + | Определение должно содержать как минимум два параметра: ''name'' (наименование) и ''element'' (элемент). Наименование (name) может быть абсолютно любым, но лучше – значимым. Element служит для указания HTML-тэга, подлежащего вставке в редактируемую разметку при выделении в окне редактора любого текста и активации этого стиля. |
- | You are free to set the ''name'' to whatever you want. ''element'' stands for the HTML-element which will be added to the HTML-Output, when you mark some text in the editor and activate this style. | + | |
- | So with these definitions you can add often used formats with an explanatory name to the dropdown-list (and you can delete those which only annoy and are never used). | + | Таким образом, у вас есть возможность дать часто используемому формату значимое имя, под которым он будет выведен в выпадающий список стилей (можно также удалить неиспользуемые форматы, которые зачастую только раздражают пользователя). |
+ | Если есть необходимость добавить к элементам **HTML-атрибуты**, потребуется третий параметр ''attributes'', например: | ||
- | If you want to add **HTML-attributes** to the elements in the style-combo, you need the third parameter ''attributs'' | ||
- | e.g. | ||
<code>{ name : 'Tablecell top', element : 'td', attributes : { 'valign' : 'top' } },</code> | <code>{ name : 'Tablecell top', element : 'td', attributes : { 'valign' : 'top' } },</code> | ||
- | for **CSS-styles**, you use the parameter ''styles''. E.g. | + | Для **CSS-стилей** применяется параметр ''styles'', например: |
<code>{ name : 'Red table', element : 'table', styles : { 'background-color':'red' } },</code> | <code>{ name : 'Red table', element : 'table', styles : { 'background-color':'red' } },</code> | ||
\\ | \\ | ||
- | ===== HTML or XHTML output ? ===== | + | ===== HTML или XHTML? ===== |
- | CKEditor by default wraps the content using XHTML tags (every tag has to be enclosed), and in such way formats it. \\ | + | По умолчанию CKEditor проставляет закрывающие тэги, следуя стандартам XHTML (каждый тэг должен быть закрыт), и соответствующим образом форматирует код. |
- | To get rid of / in closing tags (to achieve for example **'' <br> ''** [HTML] instead of **'' <br /> ''** [XHTML]) upon saving page , \\ | + | |
- | you need to edit CKE's '' config.js '' file located in '' admin/template/js/ckeditor/ '' , and add below code: | + | Для того, чтобы переключить поведение редактора на HTML-стандарт и не использовать косую черту в закрывающих тэгах (например, оставлять в документе тэг **<br>** (HTML) вместо **<br/>** (XHTML) при сохранении страницы), необходимо отредактировать файл конфигурации редактора ''config.js'', расположенный в папке ''admin/template/js/ckeditor/'', добавив следующий код: |
<code> | <code> |