본문 바로가기

상큼한 이야기。/상큼한 초보블로거。

[웹폰트 적용] 티스토리 웹폰트 적용시키기

네이버 블로그를 이용할 때는 폰트 적용은 그냥 무료로 제공하는
폰트를 담아 쓰기만 하면 되지만,
티스토리는 마음에 드는 폰트가 있으면 직접 웹폰트 적용을 시켜줘야 합니다.

우선, 티스토리에 웹폰트를 적용시키려면 웹폰트가 있어야 하겠죠?
<링크>TTF파일을 EOT파일로 바꾸기

 
<추천 한 번 눌러주세요^^>

웹폰트 적용시키기


1. HTML/CSS에서 파일업로드를 선택해 웹폰트를 업로드 해주세요.


2. HTML/CSS편집>skin.html에 보면 <head>로 시작해서</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>

파란색의 부분을 자신의 웹폰트명으로 바꿔주세요.
폰트파일명은 1번에서 파일업로드한 웹폰트의 파일명과 같아야 합니다. ex)NanumGothic.eot

오른쪽 마우스클릭이 안되기 때문에 밑의 txt 파일을 열기 해주세요^^

 


3. ctrl + f키를 눌러서 ##_article_rep_desc_## 찾기를 합니다.
검색한 후 ##_article_rep_desc_## 바로 위의<div class="article">부분이 있습니다.
<div class="article">이 부분을 txt부분으로 바꿔줍니다.

 



4. style.css부분의 맨 위에 txt부분을 그냥 붙여넣기 합니다.

 


폰트파일명은 파일업로드 한 파일명과 같아야 합니다. ex)NanumGothic.eot