티스토리 수익형 블로그 기본 설정 세팅하기 7탄(블로그 글씨체 변경)
시작하기에 앞서 티스토리 블로그를 처음 하시는분들께서는 아래 기존 포스팅을 처음부터 참고하셔서 오신다면 기본적인 세팅하시는데 있어서 큰 도움이 될꺼라고 생각합니다.
2022.12.29 - [티스토리 시작하기 자료] - 티스토리 수익형 블로그 기본 설정 세팅하기 6탄(글 서식 모음)
2022.12.25 - [티스토리 시작하기 자료] - 티스토리 수익형 블로그 기본 설정 세팅하기 5탄(드래그 방지)
2022.12.24 - [티스토리 시작하기 자료] - 티스토리 수익형 블로그 기본 설정 세팅하기 4탄(Rss,Sitemap)
2022.11.22 - [티스토리 시작하기 자료] - 티스토리 수익형 블로그 기본 설정 세팅하기 3탄(구글서치 콘솔)
2022.11.19 - [티스토리 시작하기 자료] - [플러그인]티스토리 수익형 블로그 기본 설정 세팅하기 2탄
안녕하세요! 골드쿠입니다.
오늘은 티스토리 제목 및 글씨체 변경하는법에 대해서 알아보고자합니다.
꾸미기를 좋아하시는 분들이시라면 알아두시면 매우 유용한 정보라고 생각합니다.
차근차근 설명해드리도록 하겠습니다. 가시죠!
알아보기에 앞서, 아래 사진에서 표시한것과 같이 글씨체는 제목부분(아래그림 빨간네모) 내용부분(아래그림 파란네모)로 나누어서 변경할 수 있습니다.
1. 제목 부분 글씨체 변경하는 방법
1) 마음에 드는 글씨체 찾기
먼저 글씨체를 적용할려면 본인에게 마음에 드는 글씨체를 찾아야겠지요?
제가 주로 이용하는 사이트 하나 링크 걸어두었습니다.
Browse Fonts - Google Fonts (구글폰트)
Google Fonts
Making the web more beautiful, fast, and open through great typography
fonts.google.com
CF)한글 폰트만 보려면 Languages -> Korean 으로 설정해주면 된다.
원하는 폰트를 고르는 후 Select this style 클릭
그럼 아래와 같은 창이 나옵니다. 여기서 오른쪽에 있는 스크롤를 내리다보면 <Style>로 시작하는 부분이 보입니다.
빨간색 네모 박스만 복사하기를 합니다!
<Style> 있는 부분에 붙여넣기합니다. 아래 CSS rules ~ 부분도 사용할 것이니 창은 아직 종료하지 마세요!
2)스킨 편집
티스토리 설정으로 들어가서, 스킨편집 화면으로 이동한다.
HTML 화면이 실행되면 CSS 클릭 (글씨체 변경은 HTML,CSS 둘다 가능하지만 이번시간은 CSS에서)
Cf) 참고 사항
<link>는 HTML에서 <head>와 <head>안에 넣어서 사용하는 방법
<style>로 시작하는거는 CSS에서 사용하는 방식입니다
기존의 @import를 지우고 붙여넣기 해도 상관없으나, 혹시 모르는 상황을 대비해 그냥 붙여넣기 하시는 걸 추천드립니다.
3)제목 변경
이제 제목 부분을 찾아야 한다. CSS 창 상태에서 Control + F 를 누른다. 여기에 "header h1" 을 검색합니
* 제 티스토리 들어오셨을때 맨처음에 보이는 골드쿠의 리뷰 이야기의 글씨체를 변경하는거입니다
정상적으로 찾았다면, 제목부분인 빨간색 네모칸 부분이 나옵니다.
이제 이부분에서 "font-family" 부분을 수정해야합니다.
다시 Google Fonts 로 돌아가, 아래 그림의 CSS rules ~ 부분을 복사합니다.
그리고 "font-family" 줄 부분을 복사한것으로 교체합니다. 해당 줄을 드래그하고 붙여넣기하면 깔끔하게 완료됩니다.
이제 다 왔습니다!
편집창 우측 상단의 "적용" 을 누르고, 왼쪽 미리보기에 "새로고침" 을 누르면 변경사항을 확인 할 수 있습니다.
혹시나 새로고침해도 변경이 안되었다면 직접 홈으로 돌아가보면 변경이 되어있다는걸 알 수 있습니다.
2. 내용 부분 변경 하는 방법
내용 부분은 "font-family" 를 갈아 끼우는 부분만 다르고 모두 동일합니다.
우선 본인이 희망하는 글씨체를 찾은 후 폰트 사이트에서 "CSS rules .." 부분을 복사합니다.
import 바로밑의 body { 를 찾는다. ( Ctrl + F 기능을 사용해서 찾아도 됩니다)
그리고 동일하게 font-family: 뒤 쪽 부분만 복사해서 바꿔준 후 적용클릭 후 새로 고침 하면 폰트가 적용 된걸 알 수 있습니다.
오늘은 티스토리 블로그 스킨 꾸미기 중 하나인 글씨체 변경하는 방법에 대해서 알아보았습니다.
처음엔 어려웠을지도 몰라도 하나하나 따라서 하시다보면 어렵지 않게 해내 실 수 있으거라고 생각합니다
하시는데 있어서 막히는 부분이 있으시거나 질문이 있으면 언제든지 댓글 달아주시면 성심성의것 답변해드리겠습니다.
다음 포스팅도 유익한 주제를 가지고 돌아오겠습니다. 2022년 얼마 남지 않았지만 즐거운 연말되세요
지금까지 긴글 읽어주셔서 감사합니다!
좋아요 댓글은 저에게 큰 힘이 됩니다
'티스토리 시작하기 자료' 카테고리의 다른 글
| 티스토리 수익형 블로그 기본 설정 세팅하기 9탄(댓글 안내문구 변경) (21) | 2023.01.16 |
|---|---|
| 티스토리 수익형 블로그 세팅하기 8탄 번외편 (쿠팡파트너스 배너) (32) | 2023.01.05 |
| 티스토리 수익형 블로그 기본 설정 세팅하기 6탄(글 서식 모음) (22) | 2022.12.29 |
| 티스토리 수익형 블로그 기본 설정 세팅하기 5탄(드래그 방지) (18) | 2022.12.25 |
| 티스토리 수익형 블로그 기본 설정 세팅하기 4탄(Rss,Sitemap) (27) | 2022.12.24 |
댓글