팁/튜토리얼

ck에디터 사용시에 "글꼴"란에 특정 폰트 추가하기

2015.11.10 13:04
2,380
1

공홈에 올렸던 자료인데 댓글도 없고 아무도 안 읽는거 같더군요.

 

그래서 그냥 여기에도 올립니다.

 

common/js/plugins/ckeditor/ckeditor/ckeditor.js 파일을 열고, CKEDITOR.config.font_names 라고 검색하면 항목이 나옵니다.

 

그 이하에 "폰트명/폰트명" 식으로 등록해주면 됩니다.

 

예: 나눔고딕: "나눔고딕/나눔고딕, NanumGothic, sans-serif;"

 

(에디터에서 나눔고딕을 사용하려면 사용자 PC에 나눔고딕이 설치되어 있거나 웹폰트로 나눔고딕을 사용해야 함.)

 

 

 

# 보너스: 스케치북 게시판 사용시에 "이탤릭체"가 제대로 나오지 않는 문제 해결

 

스케치북 게시판에서는 em 태그를 자체적인 용도로 사용해서 문제가 발생합니다.

 

이 경우 ck에디터의 이탤릭체 설정 부분에서 em 태그를 cite 태그로 바꿔주면 해결됩니다.

 

위와 같은 파일을 열고, CKEDITOR.config.coreStyles_italic={element:"em",overrides:"i"} 이 부분을 찾아서

 

em을 cite로 바꾸면 됩니다.

 

(보너스로 올리면 누가 보러 오냐고 할 수 있는데... 아마 검색하면 나올겁니다)

 

 

 

## 보너스2: 이 방법들에는 문제가 하나 있습니다.

 

뭐냐면, 코어 업데이트시에 종종 ckeditor.js 파일도 변경되는 경우가 많은데, 그때마다 일일히 수정해줘야 한다는 겁니다.

 

이를 해결하는 방법은 config.js 파일을 생성하여 설정을 따로 해주는 방법입니다.

 

그런데, 저는 config.js 파일을 사용하니까 제대로 적용되지 않고 버그가 생기는 등의 문제가 발생하더군요.

 

그래서 일부러 불편함을 무릅쓰고 ckeditor.js 파일을 매번 직접 수정하고 있습니다.

 

혹시 문제가 발생하지 않는 분들은, ckeditor의 config.js 설정방법을 검색해서 해당 방법을 사용해보세요.

댓글 9

  • 2015.11.10 14:35 #73396
    em 을 i 로 바꾸면.. 의미가 달라지는데... 이런 ㅠㅠ
    em 은 강조하는 의미가 있는 요소에요 ^^
    스케치북 스킨에서 수정해주면 좋을 것 같은데.. 안해주려나요 ㅎㅎ
  • 2015.11.10 14:45 #73410
    네, 그래서 저번에도 xe타운에 올렸는데 스케치북에 저걸 수정하려고 하니까 고쳐야 할 부분이 진짜 한두군데가 아니라서 어쩔 수 없이 cite 같은 거라도 쓰라는 결론이 나왔네요. 스케치북 개발자님은 i 태그를 쓰라고 말씀하시는데 이게 또 xe 1.8로 오면서 아이콘 웹폰트를 불러오는 태그로 바껴버려서... ㅠㅠ
  • 2015.11.10 14:50 #73414
    http://xe.sketchbooks.co.kr/84023#comment_84509
    https://xetown.com/lakepark/14117
  • 2015.11.10 15:10 #73462
    스케치북에서도 알고 있는거군요 ㅠㅠ 너무하시네..
  • 2015.11.11 06:06 #74265

    웹폰트가 문제군요.. 으음.

    배포용으로 나온 한글웹폰트가 몇 없어서 문제지. 흑, 영문과 달리 아쉬운 부분..

  • 2017.04.04 09:43 #553359
    감사합니당!
  • 2017.04.04 09:56 #553376
    이거 말고 config.js 파일 수정하는 방법 쓰시는게 낫습니다.
  • 2017.04.04 12:30 #553557
    아 제가요 다른 에디터 tinymce 를 쓰고있거든요 구래서 이 글을 보고 에디터 폴더 폴더로 글어가서 비슷한 파일을 찾아 이태릭 = em 이라고 써진 부분을 cite 라고 바꿔주니까 이태릭체가 제대로 나오더라고요. 이건 코어 업데이트에 반영안될거같은데 비추천허는 방식인가요 ㅠ
  • 2017.04.04 15:02 #553741
    뭐 큰 상관은 없습니다. config.js를 쓰면 (ckeditor 한정으로) 커스터마이즈 부분 관리가 편해져서 그런거구요. 혹시 수정한 파일이 업데이트 되더라도 신경써서 올리시면 별 문제는 없을겁니다.