티스토리 블로그 기본 폰트, 글꼴 바꾸기(변경) 방법

티스토리 블로그는 기본적으로 고딕, 굴림, 바탕, 돋움, 궁서체의 5가지 기본 폰트를 제공하고 있습니다. 하지만, 적용해보면 그다지 예쁘지도 않고, 가독성도 다소 떨어진다는 치명적인 단점이 있습니다. 아무리 블로그의 정보가 유익하다고 해도 읽기 싫어지는 글씨체가 적용되어 있거나 글씨 크기가 너무 작다면, 다 읽고 싶어도 도중에 나가버리고 싶은 충동이 생기게 마련입니다. 딱 봤을 때 한 눈에 들어오고 오래 읽어도 질리지 않는 폰트는 생각보다 많지 않은 듯 합니다. 

사람에 따라서 취향이 다르겠지만, 개인적으로는 나눔고딕, 나눔바른고딕, 나눔바른펜 폰트가 보기에 편하고, 가독성도 좋지 않나 생각합니다. 이런 의미에서 오늘은 내가 원하는 포트를 이용해서 티스토리 블로그의 기본 폰트, 글씨체 글꼴을 변경하는 방법에 대해서 소개해드리겠습니다.

본인이 원하는 폰트라면 어느 것이라도 적용하는 방법은 동일하니, 

천천히 차근차근 따라해주시기 바랍니다. 

저는 무료로 이용할 수 있고 보기에도 편한 나눔 시리즈 중, 

나눔바른고딕 폰트를 예를 들어 설명해드리겠습니다.

 폰트, 글꼴 다운로드 하기

먼저 구글, 다음, 네이버 등에 자신이 원하는 폰트의 이름을 검색해서 폰트 ttf 파일을 받습니다.

나눔바른고딕을 원하시는 분이라면

http://software.naver.com/software/summary.nhn?softwareId=GWS_000240

나눔바른펜을 원하신다면

http://software.naver.com/software/summary.nhn?softwareId=GWS_000687 

나눔고딕을 원하신다면

http://software.naver.com/software/summary.nhn?softwareId=MFS_107630

으로 들어가 주시기 바랍니다.

해당 링크로 들어갔다면, 오른쪽 위에 나와 있는 

다운로드 버튼을 눌러 받고, 실행해주어 설치를 진행합니다.

설치를 마치기 전에는 네이버 툴바와 네이버 기본 홈페이지 설정이 싫으시다면 

반드시 두 항목을 체크해제해주신 후 마침 버튼을 눌러주시기 바랍니다.

폰트는 제어판의 글꼴 폴더에 자동적으로 저장이 됩니다.

윈도우 시작 버튼을 누르고 제어판에 가서 글꼴 폴더로 들어갑니다.

스크롤을 쭉 내려서 나눔바른고딕 폰트를 찾고 복사한 후, 

바탕화면이나 본인이 찾기 쉬운 폴더에 붙여넣기 해줍시다.

 글꼴 TTF 파일을 EOT 파일로 바꾸기

우리가 받은 글꼴 폰트 파일은 TTF 파일로 용량이 4MB 정도로 상당히 큽니다. 이 파일을 그대로 인터넷 상에 올린다면 꽤 과부하가 걸릴 수도 있기 때문에 반드시 인터넷에 최적화 된 웹사이트용 폰트인 EOT 파일로 변환시켜주셔야 합니다.

TTF 파일을 EOT 파일로 손쉽게 바꾸기 해줄 수 있는 아래 사이트로 들어갑니다.

http://eotfast.com/

EOTFAST 사이트의 메인화면 모습입니다.

오른쪽 가운데에 있는 Free Download 버튼을 눌러 

무료로 변환 프로그램을 받습니다.

eotfast-2-22-10이라는 압축파일이 받아지면, 

마우스 오른쪽 버튼을 눌러 압축을 풀어줍시다.

이제 아까 받아 놓은 폰트 ttf 파일을 마우스로 드래그 해서 

EOTFAST-1.EXE 실행파일에 끌어 넣어줍니다.

그러면 파일 변환중이라는 검은 창이 잠시 떴다가 사라집니다.

검은 창이 사라지면 위와 같이 eot 글꼴 파일로 변환이 됩니다.

이제 이 eot 글꼴 파일을 이용해 

티스토리 블로그에 내가 원하는 폰트를 적용하러 가봅시다.

 티스토리 블로그 폰트 바꾸기

자신의 블로그로 들어와 q 버튼을 눌러 관리 화면으로 들어갑니다.

HTML/CSS 편집 항목을 클릭합니다.

화면 상단 오른쪽에 있는 파일업로드를 누릅니다.

그리고 아래 부분에 있는 추가 버튼을 누른 후, 

아까 변환한 eot글꼴 파일을 선택한 후 열기 버튼을 누릅니다.

그리고 꼭 오른쪽 위에 있는 저장 버튼을 누릅시다.

이번에는 CSS 항목을 클릭합니다.

오른쪽 하얀 곳 아무곳이나 한번 클릭해 준 후,

Ctrl키와 F키를 동시에 눌러 검색창을 뜨게합니다.

검색창에 font-family라고 입력하고 엔터를 칩니다.

엔터를 치면, 화면 오른쪽에 스크롤바 부분에 주황색으로

font-family라는 글씨가 적힌 해당 장소가 모두 표시가 됩니다.

이 부분들을 모두 찾아 우리가 올렸던 폰트 이름을 입력해주어야 합니다.

소문자와 대문자에 주의하여 반드시 똑같이 써주시기 바랍니다.

그리고 위 사진의 두번째 빨간 박스처럼

.eot라고 되어 있는 부분도 반드시 원하는 폰트이름으로 바꿔주셔야 합니다.

나눔바른고딕 글꼴이라면

@font-face 부분은 

font-family: 'NanumGothic';

으로 바꿔주시고, 나머지 부분은

font-family:NanumBarunGothic

위 화면과 같이 모두 변경해줍니다.

하지만, font-family가 써 있는 곳이라 하더라도 옆에 

*Don't Change Font-family (Icon)이라는 표시가 되어 있는 부분은 

절대로 바꿔주시면 안 됩니다. 

만약 이곳까지 우리가 원하는 글꼴로 바꿔버리면 

티스토리 블로그에 있는 fontawesome 폰트가 적용된 아이콘 모양들이 

모두 엑스박스로 표시되거나 아예 표시가 되지 않을 수 있기 때문입니다.

이 부분만 제외하고 모두 바꿔주시기 바랍니다.

저는 나눔바른고딕 폰트로 예를 들어 설명드렸지만,

자신이 원하는 다른 글꼴이 있다면 제가 설명드린 방법을 응용해서

본인이 원하는 폰트를 티스토리 블로그에 적용해봅시다.

티스토리 블로그 티에디션(T-edition)에 애드센스 광고 달기 방법

티스토리 블로그 글 제목 디자인 변경하기(수정, 바꾸기) 방법

티스토리 블로그 티에디션(T-edition) 설정하기 방법 fastboot스킨

티스토리 블로그 스킨 변경 등록 방법 및 반응형 스킨 추천

티스토리 블로그에 유튜브 동영상 쉽게 넣는 방법

티스토리 블로그 글꼴 변경에 성공하셨다면, 아래 하트 버튼을 눌러주세요.