티스토리에 웹폰트 적용하기!
2010. 12. 6. 09:00
1. 아래 파일을 받습니다.
2. 스킨 -> HTML/CSS 편집 -> 파일 업로드로 이동, "파일업로드" 버튼을 누르고 위 파일을 업로드합니다. 그리고 HTML/CSS 편집으로 돌아와 style.css 부분 맨 위에 아래 문구를 삽입합니다.
NanumGothic.eot @font-face {font-family:NanumGothic; src:url(images/NanumGothic.eot);}
그림1. 클릭하면 큰 이미지로 보입니다
3. style.css 부분에서 하단 부분에 보면 그림2. 와 같은 부분이 있습니다. font-family.... 이 부분을 아래와 같이 고쳐줍니다. 형식이 스킨마다 조금씩 다를 수 있는데 보통 아래와 같이 삽입해 두면 적용이 됩니다.
font-family: NanumGothic, Verdana, Arial, 굴림;
4. 찾기가 번거로운 사람은 style.css 의 맨 위에 보이는 그림3. 의 부분을 고쳐줘도 적용이 됩니다.
그림3.
5. 웹폰트의 경우 익스플로러 7.0 이상의 브라우저 환경에서만 적용이 됩니다. 파이어폭스, 크롬 등의 브라우저에서는 적용이 안됩니다. 또한 일반적인 폰트에 비해 크기가 작기 때문에 그림2. 에서 보는 바와 같이 폰트 크기를 13px 이상으로 적용해주는 게 좋고, 라인 간격(line-height) 부분도 1.7 이상으로 설정해주는 게 좋습니다.