본문 바로가기

스프링노트/티스토리 & 구글Adsense

티스토리 글꼴 바꾸기 '나눔고딕' 폰트로 바꾸는 방법

 

티스토리에 나눔고딕 웹폰트를 적용하는 방법

 

블로그에 폰트를 변경해서 사용할 수 있는 방법은 무료부터 유료까지 다양하다.

크게 두가지로 나눈다면

외부제공 폰트를 사용하는 방법 (구글 웹폰트, 타이포링크)

그리고 자체 서버에 폰트를 업로드 해서 사용하는 방법이 있다.

 

보통을 후자를 선택한다.

구글 웹폰트를 사용하면 로드 시간이 더 오래 걸리고 블로그 로딩 속도가 아무래도 느려진다.

그건 또 바로 구글애드센스 수입(?)과도 직결 된다고 본다 ^^;;

 

폰트를 티스토리 서버에 업로드 해서 사용하는 방법이다.

이방법은 나눔고딕체 뿐 아니라 다양한 폰트를 적용할 수있다.

(당연히 저작권 문제가 없는 파일이어야 한다. )

 

1. 나눔고딕 글꼴 다운로드 하기

nanum-gothic-v9-korean_latin.zip  다운받는다.

파일이 의심스럽다면https://www.google.com/fonts/earlyaccess  사이트에서 다운로드가 가능한다.

압축을 열면 4개의 파일이 있다.

티스토리 설정 - 꾸미기 - 스킨편집 - HTML편집 - 파일 업로드에 업로드한다.

 

 

2. CSS 코드 추가하기

티스토리 설정 - 꾸미기 - 스킨편집 - HTML편집 - CSS 코드 추가하기

 

@font-face {
 font-family: "Nanum Gothic";
 font-style: normal;
 font-weight: 400;
 src: url( "./images/nanum-gothic-v9-korean_latin-regular.woff2" ) format( "woff2" ), url( "./images/nanum-gothic-v9-korean_latin-regular.woff" ) format( "woff" );
}
@font-face {
 font-family: "Nanum Gothic";
 font-style: normal;
 font-weight: 700;
 src: url( "./images/nanum-gothic-v9-korean_latin-700.woff2" ) format( "woff2" ), url( "./images/nanum-gothic-v9-korean_latin-700.woff" ) format( "woff" );
}

 

코드에 font-family : Nanum Gothic 으로 전부 바꿔준다.