개발자의 끄적끄적

[javasript/jquery] ckeditor4 add style example / ckeditor4 css 추가하는 방법 본문

개발/javascript & jquery

[javasript/jquery] ckeditor4 add style example / ckeditor4 css 추가하는 방법

효벨 2022. 1. 31. 01:00
728x90
반응형

[javasript/jquery] ckeditor4 add style example / ckeditor4 css 추가하는 방법

 

 

html 텍스트 에디터를 사용하다 보면

 

ckeditor 를 사용하는 경우가 많이 있습니다.

 

그중에서

 

ckeditor 가 로드된 후에

 

특정 css 설정이 적용되도록 작업해야 하는 경우가 있는데요.

 

그럴때는 아래와 같이 on : instanceReady 를 이용하여

 

스타일을 추가하시면 됩니다!

 

CKEDITOR.replace("content",{
    height:"300"
    ,toolbar:
        [
            { name: 'document',    items : [ 'Source' ] },
            { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript' ] },
            { name: 'paragraph',   items : [ 'NumberedList','BulletedList','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock' ] },
            { name: 'links',       items : [ 'Link','Unlink' ] },
            { name: 'insert',      items : [ 'Image','Table' ] },
            '/',
            { name: 'styles',          items : [ 'Font', 'FontSize' ] },
            { name: 'colors',          items : [ 'TextColor', 'BGColor' ] }
        ]
    ,on : {
        instanceReady: function(){
            this.document.appendStyleSheet('/assets/css/ckeditor.css');
        }
    }
});

 

참고들 하세요!

반응형
Comments