정보

티스토리 글꼴 변경하기(원하는 부분만 바꾸는 법!)

nimoes._. 2024. 5. 24. 14:00
728x90
반응형

안냐세요

오늘은 티스토리 글꼴 바꾸는 법을

알려드리겠습니다

레츠기릿


↓ 일단 먼저 눈누라는 무료 폰트 사이트에 들어갑니다 ↓

https://noonnu.cc/

 

눈누

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

noonnu.cc

둘러보면서 마음에 드는 글꼴을 찾으시구요

(마음에 드는 게 너무 많아서 문제;)

마음에 드는 폰트를 찾으셨다면 폰트를 누르고 들어가서

---> 웹폰트로 사용 <---

부분 코드를 복사해 주세여

저는 나눔바른펜 사용 중입니다ㅎㅎ

(ㄴ 안물;)

아 그리고 무작정 막 가져오시는 게 아니라

스크롤을 좀 내리면 라이선스 요약표라는 게 있는데

여기서 웹사이트 허용여부를 꼭 확인해 주시고 가져와주세요~

 

그리고 이제 티스토리 블로그 관리로 들어갑니다

사이드 바에서

꾸미기- 스킨 편집으로 들어가 줍니다

오른쪽에 스킨 편집이라는 화면이 뜨면

거기서 html 편집을 눌러줍니당

 

HTML / CSS / 파일업로드가 있는데

CSS를 누르고

아까 복붙한 코드 있죠?

그거를 제가 넣은 저 부분에 넣어주세요

@font-face 부분!

(여러 개 가져와도 상관없음요) 

그다음에

body 부분 font-family에 가져온 글꼴 이름!을 제일 앞에 붙여주세요

(Ctrl + F 누르고 font-family를 치면 쉽게 찾을 수 있어요)

그리고 미리 보기를 누르시면 페이지의 글꼴이 바뀌는 걸 확인하실 수 있답니다 :)


근데 body 부분에 글꼴을 바꾸면 안 바뀌는 부분도 있고

원하는 부분만 다른 글꼴로 하고 싶을 때가 있자나여??

예를 들어 블로그 제목 폰트만 다른 걸로 바꾸고 싶다던가 뭐 어쩌고,, 네네

그럴 때는 어떻게 하냐면요

원래 저 관련글 박스 안에 있는 글 제목은 body 글꼴 바꾼다고 바뀌는 부분이 아니거든요?

근데 저는 글꼴을 통일시켜 줄게요

(사진은 이미 바꾸고 난 후 임다..)

 

Ctrl + F 눌러서 font-famaily 치면

CSS안에 font-family가 한 15개? 정도 있는데

저 관련글 부분의 이름을 찾아주시면 됩니다

이름은 어떻게 찾냐면요 ㅋㅋ

창을 하나 더 켠 후에 자기 블로그 들어가서(스킨 편집 X)

f12 누르면 개발자 도구가 열리는데

① 부분을 누르고

② 글꼴 바꾸고 싶은 부분에 마우스를 갖다 대면 파란색 박스가 생겨요

③ 파란색 박스 위에 생기는 이름을 확인하면 됩니다

(div. 다음이 이름이에용

관련글 부분의 이름은 related_type.related_type_view 네요)

한 번 더 이름 확인하시고

스킨편집에 다시 와서

Ctrl + F 누르고 font-family 쳐서

우리가 찾은 이름을 찾는 거예요!

그러고 거기 폰트를 원하는 글꼴로 바꾸면 끝!

 

이해가 잘 안 된다면 댓글 남겨주세용~

 

728x90
반응형