본 블로그는 제휴 마케팅을 포함한 광고를 활용하며, 그에 대한 수익을 얻을 수 있습니다.

티스토리 북클럽스킨 제목 배경 없애기

티스토리 북클럽 스킨은 제목 줄이 너무 크고, 대표이미지에 따라 너무 너저분해 보이는 단점이 있습니다. 여태까지 모든 설정을 다 적용한 스킨이라, 이제와서 바꾸기는 힘든데 제목줄이 계속 거슬려서 제목줄을 다이어트 시켜봤습니다. 배경을 없애고 심플하게 글씨만 나오도록 변경했습니다. 

변경하고 나니 깔끔하고, 제목줄 크기 때문에 부담스러웠던 광고 삽입도 조금은 편안한 마음으로 할 수 있게 됐습니다. 아래 방법을 따라하시면 됩니다. 

1. 배경에서 사진 삭제

html 편집 모드에서 아래 코드 검색

[##_article_rep_thumbnail_raw_url_##]

이 전문 일치하는것 확인하고, 다른곳에 똑같은 구문 있는지 확인하고(없을 것입니다. 그래도 확인) 'none'으로 대체합니다.



2. 쓸데 없이 두꺼운 제목 줄 높이 줄이기


저는 230px을 100px로 줄였습니다. 130px이 감소했습니다.

3. 새로 생긴 공백 없애기

제목 줄이 얇아진 높이 130px 만큼 공백이 생깁니다

CSS 편집창에서 아래 코드를 검색합니다.
'#tt-body-page #container'

그리고 그 속에 있는 'padding-top' 수치를 변경합니다.

위에서 줄어든 크기=늘어난공백크기=130px. 그래서 250px을 130px만큼 줄여서 120으로 변경했습니다. 공백이 사라집니다.

4. 제목 배경색, 글씨색상 변경



제목 위 카테고리와, 제목, 제목 아랫줄 메타정보(날짜, 글쓴이) 모두 흰색으로 되어있습니다. 저는 이전에 이미 카테고리와 날짜, 글쓴이를 숨겼기 때문에 이 설정을 바꾸지는 않았습니다만, 북클럽 스킨 사용자 대부분은 이 글씨 색상도 같이 바꾸셔야 할 것입니다. 저는 제목을 검정색으로 바꿨습니다.


배경색상도 사진 참고하여 변경해줍니다. 사진처럼 background-color 두가지를 모두 원하는 색상으로 변경합니다. 저는 흰색으로 바꿨습니다. 'background-color' 줄 자체를 통째로 없애버리면, 본문과 사이드바 사이에 있는 옅은 회색 선이 제목줄을 침범해서 글씨를 가로지르게 됩니다. 그냥 흰색으로 바꾸시는 것을 권장합니다.

5. 메타정보 공간 없애기

날짜와 메타정보가 있는 공간(제 블로그에는 비어있는 공간)을 없애겠습니다. 제목 아래 공간은 '.post0cover .inner {'를 검색해 찾아줍니다. 'padding-bottom:' 부분의 숫자를 원하는 만큼의 두께로 변경합니다. 저는 0px로 입력했습니다.



6. 완성


티스토리 제목줄을 정리하여 가독성을 높였습니다. 광고 배너만큼이나 두꺼워서 거슬렸던 제목줄을 정리하니 가독성이 조금 나아진 것 같습니다. 글 읽으신 분께 도움이 되었기를 바랍니다.