워드프레스를 처음 접하는 분들이 제일 적응 못하는 부분이 에디터에서 한글 폰트가 제대로 나오지 않아서 글 작성할 때와 실제로 발행했을 때의 괴리감이라고 생각합니다. 발행되는 화면 그대로 에디터에서 보여줄 수 있다면 좀 더 친근하게 포스팅을 할 수 있을거라 생각합니다. 여기서는 워드프레스 에디터 플러그인으로 많이 사용하는 TinyMCE Advanced를 기준으로 에디터 내에 기본 폰트 변경하는 방법을 알려드립니다. 고전 에디터를 사용하시는 분들에게 해당되는 사항입니다.

TinyMCE Advanced 기본 폰트 변경하기

기본적으로 아무것도 적용하지 않은 상태입니다. 기본 폰트는 ‘Georgia’로 되어 있습니다. 에디터 폰트 리스트에 한글 폰트 자체가 없어서 이렇게 보입니다. 이제 기본 폰트를 변경해보겠습니다.

/wp-includes/js/tinymce/skins/wordpress/wp-content.css

위 경로에 있는 ‘wp-contents.css‘를 수정해주면 됩니다. TinyMCE이 아니라 다른 플러그인을 사용하시더라도 비슷한 경로에 css 파일을 수정하면 됩니다.

wp-contents.css 파일의 12번 째 줄, 위와 같이 font-family가 Georgia로 되어 있는 것이 보입니다.

저는 발행된 화면에서 적용되는 ‘Open Sans’ 폰트로 수정했습니다.

font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;

나눔고딕 등의 한글 폰트를 사용하시는 분은 아래와 같이 입력하시면 됩니다.

font-family: "Nanumgothic", "Nanum gothic" sans-serif;

실제 발행된 화면과 동일한 폰트로 적용된 것을 확인할 수 있습니다. 이제 좀 더 편안한 마음으로 포스팅 할 수 있게 되었습니다.