티스토리 뷰
나눔고딕은 네이버에서 개발해 무료로 배포하는 폰트로 많은 웹에서 사용합니다. 네이버 공식 배포 페이지를 가면 TTF형식과 OTF형식으로 배포되지만 웹용은 없어서 별도로 웹 폰트(eot, woff, woff2)로 변환해야 합니다. 하지만 구글에서 Early Access로 서비스되고 있어서 링크만 연결하면 바로 사용할 수 있습니다. 이 글에서는 구글 링크를 바로 연결해서 사용하는 방법과 티스토리에 설치해서 사용하는 방법 2가지를 설명하겠습니다.
링크해서 사용하기 (구글 CDN 방식)
구글 폰트 Early Access는 구글에 정식 폰트가 되기 전에 일종의 베타형식으로 서비스되는 방식입니다. 이곳에는 나눔고딕 뿐만 아니라 많은 폰트들이 서비스 되고 있습니다.
티스토리 - 관리페이지 - HTML/CSS편집 - CSS탭 상단에 아래의 코드를 붙여넣기 합니다.
CSS
@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);
바로 같은 CSS탭에서 Ctrl + F를 누르고 font-family를 찾으신 후 위 처럼 폰트이름 'Nanum Gothic'을 추가하세요.
폰트 이름에 공백이 있기때문에 반드시 작은 따옴표로 감싸야 합니다.
font-family는 바로 뒤에 추가된 폰트 이름 순서대로 적용이 되기때문에 제일 앞에 추가해야 적용됩니다.
티스토리 스킨에 따라 font-family위치가 다를 수 있으니 확인 하신 후 추가하세요.
다운 및 설치해서 사용하기
다운로드 한 파일을 압축풀어줍니다.
티스토리 같은 경우는 압축푼 파일 모두 바로 관리페이지 - HTML/CSS - 파일업로드탭에서 업로드 합니다.
티스토리가 아닌경우는 nanumgothic.css파일을 메모장으로 열어서 경로명을 본인의 블로그 경로에 맞게 수정하신 후 업로드 하면 됩니다.
참고로 나눔고딕 Regular와 Bold폰트만 포함되었습니다.
티스토리 - 관리페이지 - HTML/CSS편집 - CSS탭 상단에 아래의 코드를 붙여넣기 합니다.
CSS
@import url(./images/nanumgothic.css);
바로 같은 CSS탭에서 Ctrl + F를 누르고 font-family를 찾으신 후 위 처럼 폰트이름 'Nanum Gothic'을 추가하세요.
폰트 이름에 공백이 있기때문에 반드시 작은 따옴표로 감싸야 합니다.
font-family는 바로 뒤에 추가된 폰트 이름 순서대로 적용이 되기때문에 제일 앞에 추가해야 적용됩니다.
티스토리 스킨에 따라 font-family위치가 다를 수 있으니 확인 하신 후 추가하세요.
무단전재 및 재배포 금지
Copyright 2017. zypper.tistory.com all rights reserved.
'Etc,웹' 카테고리의 다른 글
| 무료도메인에 이메일(다음스마트워크, ese.kr) 연결하는 방법 (2) | 2017.10.10 |
|---|---|
| 무료 도메인(내도메인.한국)을 블로그에 연결하는 방법 (1) | 2017.10.04 |
| 임시 이메일 에쎄(ESE) 소개 및 장단점 (0) | 2017.09.30 |
| 개편된 티스토리 살펴보기 (2) | 2017.08.31 |
| 티스토리에 스포카 한 산스(Spoqa Han Sans)웹폰트 적용 및 설치하기 (3) | 2017.08.11 |