[수익형 블로그] 7. 티스토리 북클럽 스킨 본문 타이틀 높이 줄이기: CSS 활용 가이드

티스토리 북클럽 스킨을 사용하시는 분들을 위한 맞춤형 가이드를 준비했습니다. 깔끔하고 심플한 디자인의 북클럽(Book Club) 스킨은 많은 분들에게 사랑받고 있지만, 때로는 본문 타이틀의 높이가 너무 높아 디자인적으로 아쉬움을 느끼실 수 있습니다.

이번 포스팅에서는 CSS 코드를 활용하여 북클럽 스킨의 본문 타이틀 높이를 간편하게 줄이는 방법을 자세히 알려드리겠습니다.

 

 

초보자도 쉽게 따라하는 티스토리 블로그 수익화 가이드

 

 

 

본문 타이틀 높이 줄이는 방법

 

티스토리 관리자 페이지에서 스킨 편집 모드로 들어가 html편집을 들어갑니다.

 

1. 관리자 > 꾸미기 > 스킨 편집 > html편집

티스토리 꾸미기 html편집

 

 

 

 

CSS 코드 찾기 - CSS 코드 수정

 

 

2. Ctrl F를 눌러 post-cover을 검색    
코드를 아래와 같이 핑크색 부분을 변경(삭제) 해주세요

 

코드라인	클래스명	변경 전	변경 후
1046라인	.post-cover	height: 340px;	height: 200px;	PC - 높이조절
1067라인	.post-cover .inner	padding-bottom: 78px;	padding-bottom: 30px;	PC - 여백조절
1079,1080라인	.post-cover h1	font-weight: 300; font-size: 2.125em;	font-weight: 500; font-size: 1.5em;	PC - 폰트조절
3027라인	.post-cover .inner	padding-bottom: 38px;	padding-bottom: 20px;	모바일 - 여백조절
3045라인	.post-cover .meta	margin-top: 33px;	margin-top: 20px;	모바일 - 여백조절
3042라인	.post-cover h1	font-weight: 300;	font-weight: 500;	모바일 - 폰트굵기

 

 

 

 

아래에서 코드라인 과 변경 전 후 화면을 확인하고 적용하세요

본문 타이틀 높이 줄이기 수정코드

 

 

 

 

본문 타이틀 높이 줄이기 수정코드

 

 

 

 

 

 

컴퓨터 본문 타이틀 높이 간격 폰트 굵기 사이즈 변경 전 후 

컴퓨터 본문 타이틀 높이 간격 폰트 굵기 사이즈 변경 전 후

 

 

 

모바일 본문 타이틀 높이 간격 폰트 굵기 사이즈 변경 전 후

모바일(휴대폰) 본문 타이틀 높이 간격 폰트 굵기 사이즈 변경 전 후