티스토리 블로그 기본 폰트 변경 (CSS 편집)

티스토리의 기본서체는 스킨에 따라 정해져 있습니다.

예를 들면 '북클럽' 스킨을 사용하는 경우에는 기본서체가 '본고딕' 입니다.

 

만약 '기본서체' 외의 다른 폰트로 글을 쓰려면, 쓸 때마다 매번 위의 방법으로 폰트를 변경해줘야 합니다. 이 포스트에서는 아예 '기본서체' 자체를 다른 폰트로 변경하는 방법에 대해 알아보겠습니다.

 

 

1. 눈누 사이트에서 폰트 찾기

눈누

 

눈누는 다양한 상업용 무료폰트를 소개해주는 사이트입니다. 사이트에 접속해서 원하는 폰트를 찾아봅시다.

 

 

2. 웹폰트로 복사

저는 나눔고딕체를 찾아서, 해당 페이지로 이동했습니다.

오른쪽에 보면 '웹폰트로 사용' 박스에 "@import" 로 시작하는 코드가 보이는데, 이걸 전부 복사합니다.

@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);

.nanumgothic * {
 font-family: 'Nanum Gothic', sans-serif;
}

 

 

3. 티스토리 스킨편집 창 이동

- 티스토리 관리 페이지 -> 스킨 편집 -> html 편집 -> CSS

 

 

4. 복사한 코드 붙여넣기

Ctrl+F 키를 눌러서 "@import"를 입력합니다.

@import로 시작하는 코드가 보입니다.

이는 스킨에 따라 1줄일 수도 있고, 2줄일 수도 있으니 꼭 사진과 동일할 필요는 없습니다.

 

바로 아래 부분에, 아까 복사했던 웹폰트 코드 중 @import 행을 붙여넣습니다.

 

 

5. 기본 폰트 변경

Ctrl+F 키를 눌러서 "font-family"를 입력하고 body 부분을 찾습니다.

북클럽 스킨의 경우 body의 font-family 행은 이렇게 생겼습니다.

이 부분 역시 스킨에 따라 다를 수 있습니다.

 

기존에 있던 font-familly 앞에 // 를 붙여서 주석처리(무효처리) 해줍니다.

// 를 입력하면 해당 행이 녹색으로 바뀌며, 이 행은 자동적으로 무시됩니다.

 

바로 아래 부분에, 아까 복사했던 웹폰트 코드 중 font-family 행을 붙여넣습니다.

여기까지 하고 적용을 누릅니다.

이제 내 블로그로 돌아가서 아무 포스트를 열어서 확인해봅니다.

 

이 방법을 통해 티스토리에서 제공하지 않는 폰트도 내 블로그에 적용할 수 있습니다.