본문 바로가기
IT정보/블로그운영정보

티스토리 북클럽 뉴북 썸네일 이미지 크기 정사각형으로 변경 하기

by 괭스 2023. 2. 11.

 

썸네일 이미지 크기

 

티스토리 북클럽 뉴북 스타일을 많이 사용할 텐데요.

뉴북 스타일은 썸네일과 제목 내용의 일부가 나오는

방식의 스타일입니다.

 

여기서 썸네일의 크기가 직사각형으로 표시가 되는데

아무래도 시인성이 떨어지고 썸네일 만들기도 어려운

만큼 정사각형으로 바꾸는 게 보기도 더 좋은데요.

 

이번 글에서는 티스토리 북클럽 뉴북 스타일의 썸네일

이미지 크기를 바꾸는 방법을 알아보겠습니다.

 

문제점

 

 

이렇게 썸네일이 세로로 표시 돼서 보기도 어렵고

이미지가 잘리게 됩니다.

 

방법

 

 

블로그 관리를 선택합니다.

 

 

스킨 편집을 들어갑니다.

 

 

html 편집항목을 선택해 주세요.

 

CSS 편집

 

 

list-type-thumbnail .post-item .thum img

항목을 편집합니다 width 와 height 항목이

있는데 같은 숫자로 바꾸면 정사각형이 됩니다.

 

크기를 키우면 홈페이지에서 보이는 썸네일

사이즈가 커집니다. 개인적으로 150px정도가

적합하더군요.

 

html 편집

 

 

css편집이 됐으면 html편집도 진행합니다.

s_article_rep_thumbnail 항목을 검색 후

수정합니다.

 

C숫자 x 숫자 부분을 똑같은 숫자로 맞춰

주세요. 썸네일의 해상도입니다.

전 썸네일을 300x300 해상도로 만들어서

300x300으로 바꿨습니다. 썸네일 해상도는

개인의 취향이지만 해상도를 너무 높게

잡으면 페이지 로딩 속도가 떨어지게 되니

적당한 수준으로 잡는 게 좋습니다.

 

결과

 

 

이제 직사각형이 아닌 정사각형으로

표시되는 걸 확인할 수 있습니다.

 

댓글