본문 바로가기
IT Tips

티스토리에서 스킨별 맑은고딕 글꼴 적용 방법

by SenseChef 2012. 2. 4.
티스토리에 있는 글꼴 종류를 선호도가 높은 맑은고딕으로 바꾸고자 기존에 올라 있는 여러 글들을 참조 했습니다.

그런데 티스토리에서 제공하는 스킨 종류에 따라 적용 방법이 다 다르더군요 !

저의 경우 최초에 적용한 스킨은 현재 인기도 순으로 가장 높은 Life in Mono(light)였구요, 2번째로는 현재 최신 순으로 가장 상위에 있는 Photo Essay였습니다.

다른 블로거님들이 올린 글을 참조해서 여기저기 바꿨으나 잘 안되어서 제 나름의 방법을 적용했고 이를 이용하면 스킨을 다른 것으로 적용해도 쉽게 바꿀 수 있을 겁니다.

그리고 글꼴을 맑은고딕으로 적용 하더라도 글을 쓸 당시에는 맑은고딕 글꼴이 목록에 나오지 않더군요.

이것도 나오게 하는 방법이 있을텐데 현재 이용하는 방법은 글을 작성할 때는 굴림 글꼴 등으로 작성 하더라도 나중에 읽을 때는 맑은고딕 글꼴이 적용되는 형태입니다.

저도 이 부분 때문에 많이 혼란스러웠는데 다른 분들도 이러한 점을 주지하시면 좋겠습니다.

맑은 고딕으로 적용하기 위해 style.css에서 바꿔야 할 부분을 찾기 위해 저는 블로그의 관리모드로 들어가서 꾸미기>스킨, 아래 그림에 있는 것처럼 우측 하단의 "스킨 위자드" 클릭

 



아래 그림에 있는 것처럼 게시글 탭에서 제목의 폰트를 궁서, 글자색을 바탕으로  변경 적용

이렇게 하는 이유는 Style.css에서 대부분의 폰트들이 굴림 등으로 되어 있고 궁서나 바탕은 잘 사용되지 않기 때문입니다.

 



블로그에 들어가보면 제목의 폰트는 궁서체로, 글은 바탕체로 변경 적용되었습니다.

현재 적용하고 있는 스킨은 Photo Essay입니다.

 



이제는 HTML/CSS 편집 화면에서 Ctrl+F를 눌러 화면 상에서의 문자열 검색을 합니다. 저는 먼저 궁서체가 어디에 적용되는지 확인키 위해 gungsuh를 입력 했습니다. 한글이 아니고 Font 디렉토리에 영문으로 들어가기 때문에 이렇게 검색 합니다.

이렇게 하면 아래에 있는 것처럼 gungsuh가 적용되는 곳이 단 한군데만 나타납니다. 여기가 이 스킨에서의 제목줄의 폰트를 변경하는 곳임을 쉽게 알 수 있습니다.

 



따라서 이를 맑은 고딕으로 바꾸기 위해 gungsuh로 되어 있는 부분을 Malgun Gothic로 화면과 같이 입력합니다.

 



이번에는 본문의 바탕체가 적용되어 있는 곳을 찾아 이를 이번에는 한글로 "맑은 고딕"이라고 입력 했습니다. 영문으로 해도 되나 한글로 입력해 보았구요, 한글로 입력 시에는 따옴표를 반드시 입력해야 합니다. 이후 저장 버튼을 누르면 변경 적용됩니다.

 



이제는 변경 적용된 상태입니다.

그리고 맑은고딕 글꼴은 컴퓨터에 반드시 미리 설치되어 있어야 하지요.

없으신 분은 인터넷에서 Download 받은 후 C:\Windows\fonts 디렉토리에 복사 해 넣으면 됩니다.

블로그에 들어가서 글을 읽어 보면 제목과 본문 모두 맑은고딕 글꼴이 반영 되었네요.

 



그리고 제가 변경 시킨 Photo Essay 스킨에서의 style.css 화일을 첨부 드리오니 Photo Essay 스킨으로 맑은 고딕 글꼴을 적용코자 하는 분은 해당 내용을 Style.css에 변경 적용 시키면 됩니다.

그리고 만약 티에디션을 이용해 스킨을 Customizing 한 경우 상기와 같이 하면 스킨이 Default 상태로 돌아 가오니 미리 글꼴 변경을 해야만 합니다. 주의 ^^ 하세요 ! 


style.css

감사합니다.