티스토리 북클럽 스킨 홈에서 썸네일 크기 조정하기

 
최근 블로그를 새로 꾸미다가 한 가지 거슬리는 점을 발견하게 되었다.

홈에서 갤러리 게시물 파트를 봤을 때 썸네일이 너무 직사각형인 점...
북클럽 스킨이라서 책모양에 최적화되었기 때문에 이렇게 보이게 되었다.
좀 더 갤러리라는 주제에 어울리게 썸네일의 크기를 정사각형으로 바꿔 볼까 한다.

 

---

 

관리 - 스킨 편집 - html 편집 - HTML 탭에서 '일상의 갤러리'에 해당하는 부분을 찾는다. 태그상으로는 cover-thumbnail-3에 해당한다. 그중에서도 사진의 크기에 해당하는 thumb/C126 부분을 찾는다.

 

 

사진처럼 사진 크기를 1대 1 비율로 고쳐 주면 반은 완료한 셈이다. 150X150도 괜찮긴 한데

나는 원래 가로 크기가 126이길래 126X126으로 고쳤다.
 

 

---

그러면 새로고침을 했을 때 이렇게 보이게 된다. 사진의 크기를 줄이는 바람에 회색으로 채워진 남는 공간이 보이게 된 것인데, 이 문제는 쉽게 해결할 수 있다. CSS 탭으로 넘어가서 썸네일 사진과 회색 공간까지 포함하는 태그인 .cover-thumbnail-3 ul li figure를 찾는다.

 

 

 

margin-bottom을 -18px; background-color를 #ffffff; (화이트)로 바꾸어 준다.

 

 

 

화이트는 회색 부분이 안 보이게 해야 하기 때문에

필수지만, 마진값은 새로고침해 가면서

원하는 간격으로 맞춰 주어도 된다.

 

적용하면 이렇게 썸네일이 정사각형으로 보이고,
사진 제목도 남는 부분 없이 예쁘게 올라와 있는 모습을 볼 수 있다.