CK에디터의 매뉴얼에서 제공하는 부분이기에 팁이라고 할 것도 없습니다만... 만약에 툴바를 좀 더 단순화 하길 원하신다면 이 방법을 쓰시면 됩니다. 더 좋은 방법이 있을지도 모르지만 저는 이렇게 사용 중입니다.

 

1.

common/js/plugins/ckeditor/ckeditor에 config.js라는 파일을 만드세요. (config.sample.js를 참고하시면 됩니다.)

해당 파일은 

CKEDITOR.editorConfig = function( config ) {
 적용할 소스들 
}

과 같은 형식이 됩니다.

 

2.

만약 기존의 있는 것에서 몇 가지의 버튼을 제거하고 싶다면 removeButtons이나 removePlugins을 사용합니다. 에디터 컴포넌트를 많이 사용하고 계신다면 차라리 몇 개를 빼는 쪽이 편합니다. (참고로 이미 감추어진 버튼이나 플러그인도 있어서 이를 적용할 때 다시 생겨나기도 하기 때문에, 그때는 그것까지 함께 작성해야 합니다.)

 

ex)

config.removePlugins = 'elementspath,save,font';
config.removeButtons = 'Underline,JustifyCenter';

 

3.

아예 툴바의 플러그인들의 전체적인 구성을 바꾸고 싶으면 http://docs.ckeditor.com/#!/guide/dev_toolbar 이것을 참고해서 작성하시면 됩니다. 저는 에디터 컴포넌트를 사용하지 않아서 이 방식대로 툴바를 구성했습니다.

ex)

CKEDITOR.editorConfig = function( config )
{
config.toolbar =
[
[ 'NewPage','Preview' ],
[ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ],
[ 'Find','Replace','-','SelectAll','-','Scayt' ],
[ 'Image','Flash','Table','HorizontalRule','SpecialChar','PageBreak'],
[ 'Styles','Format' ],
[ 'Bold','Italic','Strike','-','RemoveFormat' ]
];
};

 

※ xe의 컴포넌트를 추가하시기 위해선 'xecomponent' 를 추가하시면 됩니다.

  • ?
    좋은 팁 감사합니다 *_*
  • profile

    CKEDITOR.editorConfig = function (config)
    {
    config.toolbarCanCollapse = false;
    config.toolbarStartupExpanded = false;
    config.enterMode = CKEDITOR.ENTER_BR;
    config.fillEmptyBlocks = false;
    CKEDITOR.dtd.$removeEmpty['i'] = false;
    config.removeButtons = '';
    config.toolbar = [
    ];
    };

    저 같은 경우는 이렇게 설정했습니다.

     

    참조 : http://ankyu.entersoft.kr/lecture/ASP/ckeditor_02.asp