티스토리(Tistory)에서 자신이 원하는 웹 폰트 적용 하기.
- 사용하는 웹 브라우저에 따라 웹 폰트를 인식하는 방식이 다릅니다.
※ 웹 브라우저 지원 폰트
- eot: 인터넷 익스플로러(IE) 4~ IE8 까지 인식. (타 브라우저에서는 지원되지 않습니다.)
- woff: 인터넷 익스플로러(IE) 9 이상 / 크롬 / 파이어폭스 / 사파리 / 오페라
웹 폰트 적용하기
- 문제가 생길 경우를 대비해 'HTML/CSS 편집'을 하기전 기존 CSS 파일을 백업 받아 놓은 후 수정하세요.
How to..
1. 관리자 페이지 접속 후 '꾸미기 - HTML/CSS 편집' 클릭.
2. 상단 우측에 보이는 '파일 업로드' 링크 클릭 후 사용할 웹 폰트 업로드 한다.
3. 상단 중앙에 보이는 'CSS' 링크 클릭.
4. 스타일 시트(style.css) 상단에 보이는 font-face 부분을 아래와 같이 수정해 준다.(그림①)
- 아래 하이라이트 된 부분에 자신이 업로드하고 사용할 폰트 이름을 넣어 주면 됩니다.
- @font-face {font-family: nanum; src:url(images/nanum.eot);
src:local("nanum"), url(images/nanum.woff) format("woff");}
이제, 자신이 올린 웹 폰트를 사용할 수 있는 준비가 되었으니 다음은 본문에 웹 폰트를 적용하는 과정 입니다.
5. 본문에 사용된 기본 폰트를 검색(Ctrl+F)으로 찾아 자신이 올린 웹 폰트로 수정해 줍니다.
- article: 본문 내용.(그림②)
- title: 본문 제목.(그림③)
- 기타 사이드 메뉴, 방명록, 댓글 등 원하는 여러 부분을 수정해 주면 됩니다.
6. 모든 수정 완료 후 상단 우측에 보이는 '저장' 버턴 클릭.
