티스토리 폰트 변경, 글꼴 변경하는 방법

티스토리-글꼴바꾸기

티스토리를 작성하다보면, 글꼴을 바꾸고 싶을때가 있다. 가독성을 높히기 위해서 혹은 좀 더 예쁜 블로그를 만들기 위해서 글꼴을 바꿔주면 좋은데, 오늘은 글꼴을 바꾸는 방법에 대해서 간단히 알아보도록 하겠다.

 

---

티스토리 폰트 변경, 글꼴 바꾸는 방법

티스토리에서 글꼴을 바꾸기 위해서 먼저 마음에 드는 폰트를 골라주어야 한다. 평소 알아본 폰트가 있다면 해당 폰트 파일을 찾아서 다운로드 받도록 하자.

폰트를 다운로드 받았다면 다음 순서대로 진행하면 된다.

티스토리 폰트 변경하기 1. 다운로드한 글꼴 이름 영문으로 바꿔주기

티스토리 폰트 변경 - 다운로드한 글꼴 파일

폰트를 다운로드 받게 되면 OTF, TTF 형식의 폰트가 있다. 예시를 들기 위해서 "네이버 한글한글 아름답게"에서 다운로드한 나눔스퀘어네오 폰트를 사용해보도록 하겠다. 폰트를 티스토리에 등록해주기 위해서는 먼저 폰트 파일의 이름을 영문을 설정해줘야한다. (나눔스퀘어의 경우 다운로드시 영문으로 폴더명이 지정돼있다.)

👉네이버 한글한글 아름답게

---

티스토리 폰트 변경하기 2. HTML편집 페이지로 이동

티스토리에 폰트를 적용해주기 위해선 티스토리 [설정]페이지에서 [스킨편집] - [html 편집]으로 이동해준다.

티스토리 폰트 변경 - HTML 페이지로 이동해주기

---

티스토리 폰트 변경하기 3.  폰트 파일 업로드하기

[html 편집] 화면에서 [파일업로드]를 통해서 폰트 파일을 업로드 한다. (이때 파일은 처음 설명했듯이 영문명이어야 한다.) 파일업로드를 해주면 오른쪽 그림과 같이 폰트가 등록된다.

티스토리 폰트 변경 - 파일업로드

---

티스토리 폰트 변경하기 4.  CSS 폰트 등록하기

다음으로 CSS 페이지로 넘어가서 폰트를 등록해주면 된다.

티스토리 폰트 변경 - CSS 등록

위 그림과 같이 @import url 항목 아래에 @fone-face 코드를 입력해주면 된다. 이때 font-family 와 아래에 src 코드에 images 코드에 폰트 영문명을 입력해준다. 폰트 등록 코드는 아래의 파일을 참고하면 된다.

폰트 등록 코드.txt

0.00MB

 

---

티스토리 폰트 변경하기 5. CSS 본문에 폰트 적용하기 

CSS 폰트 등륵이 완료됐으면, 아래에 body 코드 아래에 font-family : 뒤로 '폰트명' , 를 추가해주어 본문 폰트를 변경해주면 된다. 

★ 참고로, body 코드 아래에 font-size 는 폰트의 크기를, color 는 폰트의 색상을 결정해준다.

티스토리 폰트 변경 - CSS 적용

---

티스토리 폰트 변경하기 6. 블로그 타이틀 폰트 적용하기

블로그의 타이틀 폰트를 변경하고 싶다면, Layout Selector 코드의 #header h1 의 font-family 를 수정해주면 된다.

티스토리 폰트 변경 - CSS 적용 블로그 타이틀

---

티스토리 폰트 변경하기 7. 변경된 폰트 확인하기

폰트 변경이 완료되면, 좌측의 [미리보기] 화면을 새로고침해서 변경된 폰트가 잘 적용됐는지 확인할 수 있다. 이후 CSS 화면에서 [적용]을 눌러주면 티스토리 글꼴 변경은 끝이난다. (★ 적용을 안 누르면 말짱 도루묵 )

티스토리 폰트 변경 - 미리보기로 확인하기

---

이렇게 이번 글에서는 폰트를 바꿔보았다. 티스토리의 CSS를 통한 수정은 알아보면 알아볼수록 끝이 없다. 아마 대부분 그 시작을 폰트 변경부터 스타트 하게 된다. 티스토리는 이렇게 폰트 변경 외에도 다양한 방법을 통해서 블로그를 변경, 꾸미기를 할 수 있으니 나만의 블로그를 예쁘게 꾸며보는 시간을 가져보는 것도 나름 재미있는 시간이 될 것 같다.