CKEditor 에 커스텀 CSS ( Custom CSS ) 집어 넣기

 CKEditor 를 사용할시 기본적으로 정의되어져 있는 몇가지 스타일이 있는대요. 이 부분이 사용자에 따라 약간 불편할 수도 있습니다. 또한 글을 작성하는 동안 페이지에 커스텀으로 적용되는 CSS 의 경우 보지 못하는대요. 이런 부분을 해결할 수 있는 방법이 CKEditor 자체에 페이지에서 사용될 커스텀 CSS를 넣는 방법입니다.

ps. 제 경우 CKEditor 의 p 테그에 margin 이 너무 넓게 들어 가서 적용한 경우 입니다. 아래를 보시면 기본 CKEditor 를 적용했을때 p 테그에 기본적으로 적용 되어 있는 margin 의 크기 입니다.

 CKEditor 자체에 CSS 파일을 적용하고 싶으시다면 CKEDITOR 를 정의 하실때 config.contentsCss 를 정의해주시기 바랍니다.

CKEDITOR.config.contentsCss = '/_src/css/_ckeditor_overwrite.css';

이제 확인해보시면 아래와 같이 CSS 가 적용된 것을 확인하실 수 있습니다.

즐거운 개발 되시기 바랍니다.