티스토리 북클럽스킨 썸네일 정사각으로 수정하기 PC

많이들 사용하시는 티스토리 블로그 북클럽스킨을 사용하면서

글발행을 하고 확인해 볼 때 분명히 이미지를 사각으로 넣었는데

화면에는 직사각형으로 나오는 경우를 겪으셨을 겁니다 

 

원래 그런가 보다고 마음에만 안 들어하셨나요?

이제 그러실필요 없어요~

 

간단하게 바꿔주기만 하면 됩니다

 

원래 북클럽스킨이름이 책이니까

그래서 책모양의 직사각형 형태로 보이는 건데

내가 등록한 대표 정사각형이미지가

원하지 않게 잘려서 등록되어 속상하셨던 분들을 위해서 

 

썸네일 대표이미지를 정사각형으로

변경하고 적용하는 방법을 알려드리려고 합니다

 

사진이 잘려서나오는 경우

 

 

 

 

티스토리 북클럽스킨 썸네일 PC이미지 변경

 

먼저 블로그  관리 > 꾸미기 > 스킨편집으로 이동해 줍니다

 

아래로 스크롤해 주시면 리스트라는 항목이 나오게 되는데

북클럽스킨은 기본으로 북리뷰 가 설정되어 있습니다

 

세 번째 항목인 뉴북으로 변경해 주세요

이후 적용버튼 꼭 눌러주셔야 합니다

 

리스트변경 예시

 

뉴북으로 변경하셨다면 스크롤을 올려 스킨편집으로 이동합니다

 

이미지크기를 변경해 줘야 하겠죠?

 

html 편집

html편집창을 클릭하여 화면 나오면

ctrl+F 단축키를 눌러

thumbnail로 검색해 줍니다

 

대략 400번대에 위치한 thumbnail 코드 위치에 C230x300으로 작성되었을 텐데

 

이 숫자를 200x200  혹은 300x300으로 변경해 줍니다

둘 다 크게 차이는 없으니 걱정 마세요

 

그리고 위에 적용버튼 꼭 눌러주신 후 바로 옆창에

새로고침버튼을 누르고 미리 보기 해주세요 

확인하셨나요?

 

참 쉽죠?

 

이제 직사각형이었던  썸네일이

정사각형으로 변경된 모습을 보실 수 있습니다

 

300으로 변경

 

 

썸네일 사이즈 좀 더 크게 변경하는 법

 

잘 바꾸어 주셨는데

혹시 작은 것 같다고 느끼시는 분들은

간단한 설정으로 변경하실 수도 있습니다

 

크기를 키우는 방법도 말씀드릴께요~

 

아까 html스킨편집 누르시면

코드가 나왔을 텐데 바로 옆에

CSS부분 누르시고 ctrl + F를 누른 후

126으로 검색해 줍니다

 

2259쯤에 126 보이시면

이 부분을 150 정도로 수정해 주세요

 

이후 적용버튼 반드시 눌러주시고 옆에 새로고침

눌러보시면 좀 더 큰 크기로

변경된 모습을 확인하실 수 있습니다

 

css변경화면

 

관련글 썸네일 사이즈 수정

 

추가로 관련글의 썸네일도

변경하시고 싶으시면

html로 가셔서 아까처럼 thumbnail로  검색 후

 

450번대 찾아주고

크기를 150x150으로 수정해 주시면

깔끔하게 정사각형으로

변경된 것을 확인하실 수 있습니다

 

수정화면

정사각형으로 변경된 모습을 보니 어떠신가요?

 

코드가 복잡할 것 같지만

생각보다 간단하셨을 겁니다

 

여기저기 썸네일 크기를 변경하고 싶으시다면

아까와 같은 방법으로

썸네일 검색하셔서 크기변경 후 테스트 해보시길 바랍니다 

 

여러분의 깔끔한 블로그운영을 위한

방법을 적용해 보시길 바랍니다