본문 바로가기
티스토리 구글

티스토리 꾸미기 : 블로그 제목 폰트 바꾸기

by #플라타너스 2023. 1. 28.
반응형

 

티스토리 꾸미기 : 블로그 제목 폰트 바꾸기

 

 

티스토리 블로그 제일 위에있는 제목(이름)을 보면 가장 기본적인 폰트로 되어있습니다.

 

다른 예쁜 폰트들을 이용하면 블로그 제목을 예쁘게 꾸밀 수 있어요.

 

이렇게 제목 폰트만 바꿔도 블로그 분위기가 많이 달라집니다.

 

어렵지 않으니 잘 따라오세요!

 

 

 

원하는 폰트 선택하기

무료폰트 사이트를 알고있다면 그걸 사용하시면 되요.

 

저는 '눈누'라는 사이트에서 폰트를 가져올꺼예요.

 

https://noonnu.cc/

 

눈누

상업용 무료한글폰트 사이트

noonnu.cc

 

 

눈누에 들어가서 아래로 내리면서 자신이 원하는 폰트를 하나 골라서 들어갑니다.

 

저는 '코트라 희망체' 로 골라볼께요.

 

 

 

왼쪽에 폰트 미리보기에 자신의 블로그 제목을 적고 크기를 조정하면서 미리 폰트의 느낌을 확인할 수 있어요.

 

그리고 오른쪽에 '웹폰트로 사용' 네모칸이 중요한 핵심 내용이니 기억해 둡시다!

 

네모칸의 오른쪽 위에 작은 네모 버튼을 눌러서 영어글자를 모두 복사 해 줍니다.

 

 

티스토리 관리의 스킨편집에서 html 수정하기

그리고 티스토리 블로그 관리로 들어가서 스킨편집으로 들어갑니다.

 

 

 

오른쪽에 있는 html편집 버튼을 눌러줍니다.

 

 

 

CSS 로 들어간 후 Ctrl + F 를 눌러서 Web Font Load 를 검색해줍니다. 

 

그리고 그림처럼 그 아래에  아까 눈누에서 복사해 두었던 '웹폰트로 사용' 네모칸의 내용을 그대로 복사해 붙여줍니다.

 

 

그리고 다시 Ctrl + F 를 눌러서 이번에는 header h1 을 검색해줍니다.

 

그 아래에 있는 font-family 의 내용을 바꾸어 줄껀데요.

 

아까 눈누 사이트에 '웹폰트로 사용' 네모칸으로 돌아가보면 똑같이 font-family 글자 옆에 폰트이름이 적혀 있는데 저 같은 경우는, 'KOTRAHOPE' ; 이네요. 이걸 복사해서 그림처럼 스킨편집에 붙여넣어 줍니다.

 

※ 만약 티스토리 스킨편집에 font-family 라는 글자자체가 아예 없는 경우에는 '웹폰트로 사용' 네모칸에 있는 font-family: 'KOTRAHOPE' ; 전체 문장을 복사해서 그대로 붙여넣어 주면 됩니다. 

 

font-weight 는 폰트의 두께입니다. 나중에 바뀐 블로그 제목 폰트 두께를 보고  너무 두껍거나 얇으면 이 숫자를 조정해주면 됩니다. 저는 300으로 설정했어요.

 

font-size 는 폰트의 크기예요. 이것도 나중에 확인한 후 원한는 크기로 조정 해 주면 됩니다. 저는 2.5로 설정했습니다.

 

수정을 완료 한 후에는 오른쪽 위에있는 적용버튼을 꼭! 꼭 눌러줘야 합니다!

 

 

그리고 스킨편집 페이지에있는 새로고침 버튼을 눌려보면!

 

짜잔! 이렇게 폰트가 예쁘게 바뀌었습니다!

 

폰트의 두께와 크기를 확인한 후 살짝 바꾸고 싶으면 아까 알려드린 것처럼 스킨편집에있는 font-weight 와 font-size의 값을 적절히 수정하면 됩니다.

 

어려운듯 쉬운듯 살짝 복잡했지만 여기까지 아주 잘 따라 오셨어요!

 

예쁜 폰트로 바뀐 블로그 제목을 보니 뭔가 꾸며진 것 같고 해서 뿌듯하고 기분도 좋아집니다.

 

 

 

 

반응형

댓글