티스토리 북클럽 스킨의 경우 본문의 대표 이미지를 자동으로 가져와 상단에 노출되게 하는데 PC나 모바일에서 볼 때 사진이 너무 커서 이를 줄이는 방법과 제목의 글자 두께를 키우는 방법에 대해 알려 드리겠습니다.
단계별로 수정 후에는 꼭 적용과 새로고침을 해서 변경 내용을 확인해 보시기 바랍니다.
상단 이미지 크기 줄이는 방법
스킨편집-CSS로 들어가셔서 1046번 height를 찾아서 기존값 340에서 240으로 줄여 보시기 바랍니다. 수정 후에 적용과 새로 고침을 누르시고, 블로그 글을 확인해 보시면 아래처럼 세로폭이 줄어든 것이 보입니다.
상단 이미지와 본문의 간격 줄이기
위에서 상단 이미지 크기 수정하게 되면 본문과 간격이 커지게 됩니다. 이에 아래와 같이 수정하셔 간격을 줄이시기 바랍니다. CSS로 들어가셔서 440번 padding-top 339px를 220px로 수정합니다.
상단 이미지 제목 위치 조정하기
상단 이미지 폭을 줄이게 되면 글의 제목이 이미지의 상단 쪽에 위치하게 되는데 아래 CSS로 들어가셔서 1067번 padding-bottom 항목을 찾아 78px에서 40px로 수정해 보시기 바랍니다.
상단 이미지 제목 두께 조절하기
이미지도 줄였고, 본문과의 간격도 줄였는데 제목 글자를 좀 더 크게 하고 싶으시면 아래와 같이 CSS 1079번의 font-weight를 300에서 500으로 한 번 수정해 보시기 바랍니다.
상단 이미지 수정 완성된 이미지
북클럽 스킨의 초기 설정 때보다는 상단 이미지의 크기도 줄었고, 제목의 글자도 두꺼워져서 가독성이 더 나아 보이는 결과물을 얻게 되었습니다.
이상 마치며, 이 글이 도움이 되었으면 합니다.
다음 포스팅에서는 상단 이미지를 다른 고정이미지로 바꾸는 방법에 대해 알려 드리도록 하겠습니다.