ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 티스토리 글꼴 변경하기(원하는 부분만 바꾸는 법!)
    INFORMATION 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
    반응형
Designed by Tistory.