| 3. 티스토리 블로그에 적용 |
이제 생성된 소스코드를 사용하여 티스토리 블로그에 적용하겠습니다.
1) 웹폰트 파일 업로드
블로그 관리자 페이지로 접속하신 후 스킨-HTML/CSS편집에 들어갑니다.
파일업로드 탭을 선택하신 후 우측의 파일업로드를 클릭하여 줍니다. 그 후 원래 설정파
일의압축을 풀어주신 폴더에 들어가시면 (저의경우 D:\web-fint\ 이경로에 압출해제)
"DBFNT0.eot" 이 웹폰트 파일을 보실 수 있습니다. 그 후 열기를 누르셔서 웹폰트를 업
로드 해주세요.
2) HTML/CSS설정
이제 마지막으로 블로그에 소스를 삽입만 하시면 됩니다. style.css설정에가시면
@charset "utf-8"; 이부분이 존재합니다. 이 위에 아래의 소스를 넣어줍니다. *최상위
빨간색으로 설정된 부분은 웹폰트의 경로를 결정하는 경로로 업로드하신 웹폰트 이름을
DBFNTO.eot 이부분에 적용해주시면 됩니다. 파란색부분에는 위에서 기억하셨던 나눔
고딕을 적어주시면 됩니다.
| @font-face{font-family:나눔고딕; src:url(./images/DBFNTO.eot)} |
3) <Head>와 </head>사이에 아래 소스를 집어넣습니다.
| <style type="text/css"> @font-face {font-family: 나눔고딕; src:url(./images/DBFNTO.eot);} 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> |
4) HTML설정에서 Ctrl+F로 <div class="article"> 이부분을 찾으신 후에 아래의 소스로 변
경하여 줍니다. *<div class="article">이 소스가 두군데이신 분들은 꼭 두군데를
다 바꾸셔야만 정상적으로 적용되오니 확인하시기 바랍니다!
| <div class="article" style="font:12pt/150% 나눔고딕;"> |
| <소스파일 등록해드립니다. 파일을 여신 후 복사해서 사용하세요.> |
* 소스를 제대로 적지 않으실 경우에는 적용이 잘 되지 않습니다. 필히 소스들을 잘 체크하시길 부탁드리며, 강조된 팁들을 잘체크하여 주시면 블로그에 소스가 잘 적용될 것 입니다. 문제사항이나 안되는 점 있으시면 댓글 달아주시면 해결해드리겠습니다.
티스토리 블로그 웹폰트로 가독성을 올리자 - 첫번째 바로가기
이 글이 마음에 드시면 추천부탁드립니다.
'돈되는 블로그 > 블로그 관리' 카테고리의 다른 글
| 이제는 블로그 수익을 위해 어디로가야할까? (39) | 2011.08.01 |
|---|---|
| 티스토리 블로그 웹폰트로 가독성을 올리자 - 첫번째 (6) | 2011.07.29 |
| 소규모 블로거 기적의 트래픽을 경험하다! (15) | 2011.02.22 |
| 블로거 어떤 목적으로 블로그를 운영하는가? (36) | 2011.02.18 |
| 외길바라기 야속한 다음뷰 구독의 눈물 (24) | 2011.02.17 |
