티스토리 본문1 · 본문2 · 본문3 글자 크기 각각 변경하는 방법

티스토리 스킨편집 본문 글자 크기 변경

티스토리는 네이버 블로그와 다르게 글자 크기를 따로 바꿀 수 없다. 유일한 방법은 HTML 글쓰기로 직접 수정하거나 스킨 편집에서 본문2의 글자 크기를 바꾸는 방법이 있다.

 

하지만 내가 하고 싶은건 본문1, 본문2, 본문3의 글자 크기를 미리 지정해놔서 강조하고 싶은 문구는 본문1로 지정하고 자세한 해설 등을 표기할 때 작은 크기의 본문3을 쓰고 싶었다. 하지만 다들 본문2의 크기 변경만 주구장창 검색됐다.

 

물론 본문2의 크기를 변경하면 본문1과 3도 일정 비율만큼 커지고 작아지지만, 원하는건 비율이 아니라 본문1과 본문3의 크기를 따로 지정하는 거였다. 결국 삽질을 두시간정도 하고 방법을 발견했다.

반응형

본문1, 본문2, 본문3 글자 크기 각각 지정하기

일단 티스토리에서 이걸 설정하기 위해선 스킨 편집을 활용해야 한다.

1. [블로그 관리 > 스킨편집 > html 편집 > CSS]

[블로그관리>스킨편집>html편집>CSS]

CSS 편집에서 글자 크기를 지정하는 명령어를 찾아야 하는데 본인의 스킨마다 조금씩 검색어가 다르다. 아래 표를 확인해서 본인의 스킨에 따른 검색어로 줄을 검색해야 한다.

 

티스토티 스킨	검색어
북클럽, Poster, Whatever	entry-content
포트폴리오, 오디세이, 레터	article_view
매거진	article_cont
#1, #2 스킨	area_view

• 블로그 관리 ▶ 스킨 편집 ▶ HTML 편집으로 이동
• CSS 선택
• Ctrl + F를 누르고 .entry-content p를 찾기

이렇게 하면 아래와 같은 명령어 줄을 발견할 수 있다. 여기 아래에 다음 명령어를 입력하면 된다.

 

entry-content p

2. 명령어 삽입 후 글자크기 조정

반응형

#tt-body-page p[data-ke-size='size18'], p[data-ke-size='size18'] {
font-size: 1.8em;
} 
#tt-body-page p[data-ke-size='size16'], p[data-ke-size='size16'] { 
font size: 1em;
} 
#tt-body-page p[data-ke-size='size14'], p[data-ke-size='size14'] { 
font size: 0.88em;
}

위의 코드를 사진의 ' } ' 괄호 다음줄에 그대로 복사 붙여넣기하면 완성이다. 첫번째 줄은 본문 1의 크기, 두번째 줄은 본문 2의 크기, 3번째 줄은 본문 3의 크기이다.

 

em은 글자 크기 단위 중 하나인데, 적당히 숫자를 바꿔 미리보기 해가면서 본인의 기호에 맞는 글자 크기를 지정하면 완성이다.

• 코드 복사 후 } 괄호 다음줄에 코드 복사 후 붙여넣기
• font size 변경해서 기호에 맞는 글자 크기 설정하기

본문 1 글자크기

본문 2 글자크기

본문 3 글자크기