본문 바로가기
BLOG

티스토리 북클럽 스킨(HTML, CSS) 수정사항 (2024 최신 스킨)

by blogshareinfo 2024. 7. 1.

티스토리의 북클럽 스킨은 많은 블로거들이 사용하는 스킨입니다. 북클럽 스킨의 HTML 및 CSS 파일을 약간 수정하면 더욱 깔끔하고 SEO에 도움 된다고 합니다. 오늘은 북클럽 스킨의 h1 태그 문제, 본문 글씨 크기 키우는 방법, 포스팅 제목 내 배경그림 삭제 방법에 대해 알아보도록 하겠습니다. 

 

티스토리-북클럽-스킨-수정방법-썸네일
티스토리 북클럽 스킨 수정방법

 

 

 

티스토리 북클럽 스킨

티스토리 북클럽 스킨은 티스토리 이용자들이 가장 많이 사용하는 스킨 중 하나가 아닐까 생각이 듭니다. 개인적인 취향 차이가 있겠지만 제가 보기에는 여러 스킨 중 가장 깔끔한 스킨이 아닌가 생각합니다. 특히 많은 수익형 블로그들이 처음 시작할 때 북클럽 스킨을 가지고 시작합니다.

 

 

티스토리 북클럽 스킨 수정 이유

티스토리 북클럽 스킨이 좋기는 하지만 몇몇 사이트에서는 SEO 관련 문제를 지적하기도 합니다. (가장 많이 지적되는 부분이 바로 h1 태그 문제입니다.) 또한, 블로그페이지의 속도를 중시하는 구글에 유리하게 어필하게 하기 위해서는 속도 측면에서 최적화가 필요한데 이러한 부분을 보완할 필요도 있습니다. 그리고 북클럽 스킨의 텍스트 크기가 작은 경향이 있어 연세가 있으신 분들이 보시기에는 조금 어려움이 있습니다. 또한 글씨 크기를 크게 할 경우 페이지 체류시간이 높아지는 장점이 있어 글씨 크기를 수정하는 것도 좋습니다.

 

 

티스토리 북클럽 스킨 수정 방법

티스토리 북클럽의 스킨 수정 내용은 h1 태그 문제, 글자크기 키우기, 포스팅 제목 배경 그림 삭제와 관련된 내용입니다. 해당 내용에 대해 순서대로 문제점 및 해결방법에 대해 이야기해 보도록 하겠습니다.

h1 태그 문제

h1 태그에 관련된 문제점 및 수정사항은 다음과 같습니다.

문제점

 페이지에 h1 태그가 2개 존재하여 구글 SEO 에서 좋은 점수를 받지 못하는 문제가 있습니다.

 

해결방법

  • 수정이 필요한 파일: HTML, CSS 파일
  • 수정 요소: h1 태그를 ". blog-header"의 스타일로 변경하여 해결 (아래 그림 참조)

 

h1 태그문제 해결 방법

 

글자크기 키우기

문제점

페이지 텍스트의 크기가 너무 작아 연세가 있으신 분들이 보기에는 부적절한 요소가 있습니다.

 

해결 방법

  • 수정이 필요한 파일: CSS
  • 수정 요소: 해당 문제의 해결방법은 CSS 파일에서 본문 문단에 해당되는 태그인 p 태그 스타일을 수정하면 됩니다. 아래 그림과 같이 font-size를 정의해서 문제를 해결할 수 있습니다. 여기서 1.2 대신 더 큰 값을 하면 글씨는 더 커집니다.

 

글자크기 키우는 방법
글자크기 키우는 방법

 

포스팅 제목 배경그림 삭제

문제점

포스팅 제목을 표시하는 부분에 배경그림으로 포스팅 내 그림 일부분이 들어갑니다. 해당 부분은 불필요한 그림이 들어감에 따라 포스트의 로딩 시간을 늘리는 원인이 되기도 합니다. 또한 일부 색상에 따라 제목과 매칭이 되지 않아 제목이 안 보이는 역효과를 낳기도 합니다.

 

해결 방법

  • 수정이 필요한 파일: HTML
  • 수정 요소: 아래 그림과 같이 HTML 파일을 수정합니다. 아래 그림 중 <!-- 으로 시작하는 부분이 원래 있는 부분인데 이 부분을 주석으로 처리하였습니다. "sytyle="background-image:none"" 으로 수정하면 배경그림이 삭제됩니다.

 

포스팅 제목 배경그림 삭제
포스팅 제목 배경그림 삭제

 

 


오늘은 많은 사람들이 이용하는 스킨 중 하나인 북클럽 스킨을 이용하기 위해 개선할 사항에 대해 이야기해 보았습니다.

 

 

함께 읽으면 좋은 글:

 

 

티스토리 네임칩(namecheap) 연결방법 총정리(2차 도메인)

티스토리를 2차 도메인에 연결할 경우 애드고시를 한 번만 승인받으면 되는 장점이 있습니다. 오늘은 네임칩이라는 곳에서 구입한 도메인을 티스토리와 연결해 보는 방법에 대해 알아보도록 하

blog.shareinfoz.com

 

 

티스토리 블로그 하위도메인 연결방법 총정리(네임칩 이용)

티스토리 블로그를 네임칩에서 구매한 도메인(2차 도메인)과 연결하는 방법에 대해서는 지난 시간에 이야기하였습니다. 이번에는 티스토리블로그를 네임칩에서 생성한 하위도메인과 연결하는

blog.shareinfoz.com