2013-02-19 4 views
0

Я тестирую добавление пользовательских stylesSet. Так что в моем коде я добавить следующее (за instructions в)CKEditor custom stylesSet переопределяет значение по умолчанию

CKEDITOR.stylesSet.add('custom_style', [ 
    { name: 'No UL Bullets', element: 'ul', styles: { 'list-style-type': 'none' } }, 
    { name: 'My Custom Inline', element: 'span', attributes: { 'class': 'mine' } } 
]); 

oEditor.config.stylesSet = 'custom_style'; 

Проблема заключается в том, что она перекрывает остальные стили по умолчанию, который поставляется с CKEditor. Я не могу понять, как просто добавить мои новые стили с существующим однажды. Есть идеи?

ответ

1

Вам не нужно менять параметр config.stylesSet, чтобы добавить стили к стандартным. Вы можете редактировать файл styles.js, добавляя и удаляя из него стили. Это файл конфигурации, такой как config.js.

Update: Вы можете установить config.stylesSet напрямую, чтобы избежать нагрузки styles.js:

CKEDITOR.replace('editor1', { 
    stylesSet: [ 
     { name: 'Big',    element: 'big' }, 
     { name: 'Small',   element: 'small' }, 
     { name: 'Typewriter',  element: 'tt' } 
    ] 
}); 
+0

Спасибо, сначала я делал это так, но причину, почему я переехал его и добавить его в мою инициализации коды, потому что каждый раз, когда я обновил код CKEditor я забывал об этих изменениях и в конечном итоге над написанием кода. Я в порядке с перемещением этого кода из styles.js в мой код. Я просто хотел посмотреть, есть ли альтернатива этому. – adviner

+0

Вы можете переместить этот код в свои файлы. 'config.stylesSet' можно установить напрямую. Я уточню свой ответ. – Reinmar

0

Вот пример того, как заменить и создавать новые стили и классы в CKEditor 4. Это все содержимое файла styles.js:

CKEDITOR.stylesSet.add ('default', [ 
/* My Block Styles */ 
{ name: 'My Div Class', element: 'div', attributes: {'class': 'my-div-class-name'} }, 
{ name: 'My Div Style', element: 'div', styles: {'padding': '10px 20px', 'background': '#f2f2f2', 'border': '1px solid #ccc'} }, 

/* My Inline Styles */ 
{ name: 'My Span Class', element: 'span', attributes: {'class': 'my-span-class-name'} }, 
{ name: 'My Span Style', element: 'span', styles: {'font-weight': 'bold', 'font-style': 'italic'} } 

]); 

Edit бар:

enter image description here

Смежные вопросы