티스토리 블로그에 웹폰트(나눔고딕) 쉽게 적용하기 by Y

웹에서 가독성이 높은 나눔고딕체는 네이버에서 만든 글꼴로 무료로 제공되며, 웹폰트로도 사용할 수 있다.

웹폰트는 서버에서 각 컴퓨터에서 보여주는 방식이기 때문에 내 홈페이지나 블로그를 보는 사용자의 컴퓨터에 폰트가 설치되어 있지 않아도 같은 폰트를 볼 수 있는 서버형 폰트다.

 

초기에 사용하던 굴림이 지겨워져 돋움으로 바꾼 후로 꽤 오랫동안 사용해왔는데 돋움체도 슬슬 지겨워져서 깔끔하고 가독성이 좋기로 유명한 나눔고딕체로 바꾸기로 결심~!!

아래 작업을 하기 전 'style.css' 내용을 미리 복사해놓길 권한다. 왜냐~내 블로그는 소중하니까~!

 

 

 

 

일단 글 본문의 폰트만 나눔고딕으로 바꾸는 건 아주 쉽다~!!

 

 

1. 구글 웹폰트 서비스에 접속한 후 Ctrl+F 를 눌러 'Nanum Gothic'을 찾는다.

'Link' 부분의 '@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);' 부분을 복사한다.

기타 다른 나눔글꼴도 제공하지만, 어짜피 제일 깔끔하고 사람들이 많이 쓰는 글꼴은 나눔고딕이라 블로그에서는 사용할 일이 없을 듯~

 

 

 

 

2. 복사한 내용을 티스토리 관리 페이지의 'HTML/CSS 편집' 메뉴의 'style.css'의 가장 윗부분에 붙여넣는다.

 

 

 

 

3. 블로그의 스킨에 따라 다르긴 하지만 첫 부분에 'style.css'의 'body...' 부분에서 'font-fanmily'의 돋움 앞에 'Nanum Gothic, '를 입력한다.

 

 

***  참고로 아래 코드의 뜻은 블로그를 보고 있는 사용자의 컴퓨터에 있는 폰트를 기준으로 왼쪽 폰트부터 우선순위가 적용된다는 뜻이다. 그러므로 뒤의 폰트를 지울 필요 없이 앞에 'Nanum Gothic'을 추가해준다면 최우선으로 'Nanum Gothic' 폰트를 표시해준다. 게다가 'Nanum Gothic' 폰트는 웹폰트이므로 사용자의 컴퓨터에 폰트가 있든말든 상관없이 표시해주게 된다 ***

 

 

 

 

 

 

 

 

만약 블로그의 모든 폰트를 모두 나눔고딕으로 변경하고 싶다면 아래의 방법을 따라해보자~!!

 

 

4. 'style.css'에서 Ctrl+F를 눌러 'font'라는 단어를 검색한 후 글꼴이 표시되는 부분은 모두 'Nanum Gothic'으로 변경해준다. 위의 3번처럼 기존 폰트가 많은 경우 앞에 추가해줘도 되고, 폰트가 하나인 경우 지우고 변경해도 된다.

'style.css' 파일은 스킨에 따라 매우 다르므로, 귀찮더라도 본인이 일일이 바꾸는 방법밖에 없다.

 

 

 

 

 

 

 

이렇게하면 글꼴이 아래 그림에서처럼 돋움에서 나눔고딕으로 변경되는데, 아무래도 더 깔끔해보이려면 글자 크기가 10포인트보다는 11포인트가 나을 듯하다.