티스토리 블로그 글꼴을 "렉시새봄" 글꼴로 바꾸어 보자.

블로그를 운영하다보면 제일 신경 쓰이는 것이 글꼴 인 것 같습니다. 레이아웃을 잘 잡아놔도 글꼴이 어울리지 않으면 블로그 자체가 허접하게 보이기 쉽습니다.

블로그를 훌륭하게 잘 운영하시고 계신 백전백승님의 블로그를 보니까 글꼴이 너무 맘에 들어서 저도 그 글꼴을 쓰기로 하고, 제 블로그의 글꼴을 “나눔고딕”에서 “렉시새봄R"로 바꾸었습니다. 혹시 여러분도 “렉시새봄R" 글꼴을 사용하고 싶으시면 아래의 파일을 받아서 사용하시면 될 것 같습니다. 

블로그에서의 글꼴은 웹폰트로 사용해야합니다. 쉽게 설명하자면 웹폰트 파일은 확장자가 “*.eot" 와 ”*.woff" 로 끝나는 파일입니다. 


아래 파일은 “렉시새봄R" 폰트를 압축해 놓았습니다. 웹폰트와 포토샵,파워포인트,엑셀,한글,워드,... 등에서 사용할 수 있는 트루타입 글꼴도 같이 압축되어 있습니다. 참고로 렉시새봄R은 KLDP.net에서 개발된 한글 글꼴로서 GNU GENERAL PUBLIC LICENSE로 제공되는 것으로 무료로 사용할 수 있습니다.


LexiSaebomR.zip



티스토리에서 글꼴을 바꾸기 위해서는 일단 웹폰트 파일인 eot, woff 파일을 일단 블로그에 올려야 합니다.  그리고 그 파일의 링크주소를 알아낸 후에 티스토리의 관리메뉴로 들어가서 “HTML/CSS 편집”으로 간 후에 “CSS" 부분을 바꾸어 줘야 합니다.


바꾸어야 하는 부분은 CSS파일의 상단에 있는 @charset "utf-8"; 바로 밑에다 추가로 코드를 입력해줘야 합니다.


/* 웹폰트 설정 start */

@font-face {

font-family:렉시새봄R;

src: url('http://cfs.tistory.com/custom/blog/105/1057898/skin/images/LexiSaebomR.eot');

src: url('http://cfs.tistory.com/custom/blog/105/1057898/skin/images/LexiSaebomR.eot?#iefix') format('embedded-opentype'), url('http://cfs.tistory.com/custom/blog/105/1057898/skin/images/LexiSaebomR.woff') format('woff');

font-weight: normal;

font-style: normal;

}

/* 웹폰트 설정 end */


상기의 “http://cfs.tistory.com/custom/blog/105/1057898/skin/images/” 이부분을 자신의 티스토리 파일의 링크주소로 바꾸어 줘야 합니다.


아래에 설정과정을 그림으로 붙여 두었으니 관심있으신 분들은 참고 해주세요.


1. 티스토리의 관리메뉴로 들어가서 HTML/CSS 메뉴로 들어간다.


2. 글꼴파일을 업로드 하기 위해 파일업로드 선택한다. 


3. 아래쪽에 있는 "+추가" 메뉴를 선택한 후에 글꼴 파일(LexiSaebomR.eot, LexiSaebomR.woff)을 선택하여 파일을 업로드 한다.


4. LexiSaebomR.eot 파일을 찾아서 오른쪽마우스 키를 눌러서 "링크주소"를 복사한다.


5. 상기 그림처럼 CSS를 눌러서 파일을 연후에 상기와 같이 3군데를 바꾸어 준다. 첫번째 큰박스의 링크주소는 여러분이 아까 복사해둔 eot파일의 링크주소로 대체해 준다. 그리고 body 태그의 font-family에 "렉시새봄R"을 추가해준다. font-size나 line-height는 여러분의 취향에 맞게 수정해준다.


즐거운 하루 되세요.

IT/블로그 다른 글

댓글 8

    • 파일업로드도 했고 css편집도 했는데 글쓰려면 폰트가 안뜨는건 왜 그런걸까요?

    • 원래 편집기에서 폰트가 뜨지는 않습니다. 그냥 기본폰트로 글쓰기를 완료하면 포스팅된 내용이 렉시글꼴로 바뀌어져 보이게 됩니다.

    • 그럼 글쓰기할 때 본문 고딕 10pt 이런식으로 있는데 고딕으로 해서 쓰더라도 글 다 쓰고 발행하면 렉시글꼴이 된다는 말씀인가요?

    • 네 설정만 정확히 했다면 그렇습니다.
      제 포스팅글도 편집기에서는 전부 고딕으로 썼던겁니다.

    • 안녕하세요 저는 CCZ-CROSS스킨 사용하는데요 이 글자체가 너무 예뻐서 바꾸려고해보니..
      저 위에 있는 것처럼 소스가 동일하지 않더라구요
      혹시 제가 사용하는 스킨에서 글자체 적용할 수 있는 방법없을까요 ㅠㅠ
      외계언어라 힘들지만...화면보고 따라하는건 잘하고 있습니당 ㅠㅠ

    • 네 스킨마다 css 소스가 다릅니다.
      하지만 티스토리 블로그라면 이 글꼴은 모두 사용할 수 있습니다.
      티스토리 블로그를 연습용으로 하나 더 만들어서 해당스킨을 적용한 후에 이글꼴을 테스트로 적용해 보는 것을 추천합니다.

*

*