북클럽 스킨 썸네일 사이즈 변경 방법

 

 

 

북클럽 스킨 썸네일 사이즈 변경 방법

 

제가 사용하고 있는 블로그 스킨은 북클럽(Book Club) 입니다. 

 

현재 북클럽에서 제공하는 썸네일의 형태를 보면, 스킨 이름과 같이 책 표지처럼 직사각형으로 보여지고 있습니다.

썸네일 사이즈에 대해 알아 보던중, 일부 유저들은 포스팅 썸네일 이미지 누락 또는 일부 잘리거나  사라짐등을 경험한것으로 보입니다. 그래서 직사각형의 썸네일에서 정사각형의 형태로 변경하여 사용하고 있습니다.

 

직사각형의 썸네일도 좋지만, 저또한 더 나은 블로그의 최적화를 위해 썸네일 사이즈를 변경하게 되었습니다.

이미 티스토리에 글을 작성하고, 스킨을 설정했다면 완벽하게는 우리가 알수 없지만 HTML 이라는것을 보았을 것입니다.

썸네일 사이즈 변경을 위해선 HTML을 수정해줘야 하는데 저와 같은 타입(리스트 : 뉴북)을 선택하신 분들은 참고하시면 좋을 것 같습니다.

 

 

썸네일 사이즈 변경  (LIST 뉴북)  - HTML 편집

 

아래와 같이 블로그 관리 홈 오른쪽 상단 스킨편집의 html 편집 버튼을 눌러주세요.

 

 

 

 

HTML 편집 버튼 후 상단에 'HTML / CSS / 파일업로드' 가 보여지는데 

 

HTML 편집을 먼저 해주겠습니다.

 

 

•  ctrl+f > post-item 검색
• 390-400줄 사이 사이즈를 표기해놓은 숫자가 보이면 가로x세로 사이즈를 동일하게 수정 변경후 저장

- 기존 C230x300으로 표기 되있던 사이즈를 C230x230으로 변경하여 위와같이 보여짐

- 시도해본 결과 200~250 사이즈 까지 보여지는데 크게 지장이 없음

- 사이즈 변경시 위와같이 첫 사이즈 표기시 C 무조건 표기.

 

 

 

 

썸네일 사이즈 변경 (LIST 뉴북)  - CSS 편집

 

 

HTML 편집 버튼 후 상단에 'HTML / CSS / 파일업로드'  중 CSS 편집으로 넘어가 줍니다.

 

 

 

 

•  ctrl+f >  .list-type-vertical.post-item.thum 검색  또는 post-item 검색
• 2218~2221줄 사이 .list-type-vertical.post-item.thum 내용 아래 padding-bottom 값을 100% 로 변경후 저장

 

 

 

저장 완료후 새로고침하여, 페이지를 확인하면 위아와 같이 정사각형으로 변경된 모습을 확인할 수 있습니다.