웹폰트 티스토리(tistory)에 적용하기
1. 무료웹폰트를 직접올리기를 해서 올립니다.
2. 스킨 편집에 들어가셔서 위쪽창(skin.htm)있는곳에서 <head>와 </head>사이에 다음의 문장을 넣어줍니다.
<style type="text/css">
<!--
@font-face {font-family: 폰트이름; src:url(./images/폰트파일명.확장자);}
a:link {font-family: 폰트이름;font-size: 10pt;}
a:visited {font-family: 폰트이름;font-size: 10pt;}
a:hover {font-family: 폰트이름;font-size: 10pt;}
a:acvite {font-family: 폰트이름;font-size: 10pt;}
body,div,table,tr,td,p,span {font-family: 폰트이름;font-size: 10pt;}
-->
</style>
<!--
@font-face {font-family: 폰트이름; src:url(./images/폰트파일명.확장자);}
a:link {font-family: 폰트이름;font-size: 10pt;}
a:visited {font-family: 폰트이름;font-size: 10pt;}
a:hover {font-family: 폰트이름;font-size: 10pt;}
a:acvite {font-family: 폰트이름;font-size: 10pt;}
body,div,table,tr,td,p,span {font-family: 폰트이름;font-size: 10pt;}
-->
</style>
폰트이름은 원하시는 이름을 쓰시면 되겠고 폰트 사이즈는 선택한 웹폰트의 크기를 적어주시면 되겠습니다. 화이트데이체같은 경우에는 10pt이고 보통 9~12정도로 되어있습니다.
이부분 까지만 해도 적용되는 스킨도 있으니 이 부분만 하시고 제대로 나오면 아래는 안하셔도 됩니다.
3. skin.htm에서 ctrl+f키를 눌러서 검색창을 연후 article_rep_desc_##]이라고 검색한후 이 부분 앞에 보시면
<div class="article"> 이라고 되어있는 부분 뒤에 style="font:10pt/150% 폰트이름;"을 넣어줍니다. 넣어주고 나면
<div class="article" style="font:10pt/150% 폰트이름;"> 이런 식으로 되어있겠죠?
그리고 난후 저장을 눌러주시면 웹폰트가 적용된 블로그를 보실수 있을겁니다.^^
적용이 안되어 보이면 새로고침을 하시면 됩니다..^^
그외 기타 자잘한 수정이 안된부분은 직접 찾아서 수정해주시면 되요^^
*** 파이어폭스에서는 웹폰트 안보입니다. IE 기반에서만 제대로 보여요.
*** eot 파일이라도 원래 유료폰트면 사용하실 수 없습니다.
이글의 원문 - http://watersky.tistory.com/37
'웹노하우&다운로드' 카테고리의 다른 글
130여종 무료 폰트 (0) | 2009.01.22 |
---|---|
한글도메인 안될때, 대처 방법 (0) | 2008.10.19 |
웹 폰트가 싫으세요? 그럼 나는 안보이기를~ 하세요. (2) | 2008.10.17 |
정식 폰트 다운 공식홈페이지 (0) | 2008.10.10 |
5day(오데이) 인기 font(폰트) 정리 이미지 모음 (0) | 2008.09.24 |