티스토리 북클럽 스킨 썸네일 크기 변경하기

티스토리 북클럽 스킨 썸네일 크기 변경하기

 

안녕하세요 사람사물상황입니다.

 

1. 서론

이번엔 포스트 썸네일 크기가 가로폭이 좁아 마치 책을 보듯해서 북클럽인 썸네일 크기를 변경하려고 합니다.

이 부분이 아마 대부분 맘에 안드실 것 같습니다. 마치 손에 박힌 가시처럼 계속 신경이 쓰이는 부분입니다. 정사각형으로 있지 않으면 뭔가 이상해 보이는 그런 느낌. 

아무튼 저도 그래서 사실 이 부분을 제일 먼저 예전에 고쳐봤었습니다. 마찬가지로 알고보면 간단한데요. 고쳐야되는 위치나 그런건 잘몰랐었거든요. 원리는 썸네일을 정사각형으로 만들고 그에 따른 안의 사진의 비율도 정사각형으로 조정하는 것이였습니다. 

2. 본론

 

방법

 

가. css에서 썸네일 이미지 크기를 조정한다.

 

나. html에서 썸네일 안의 사진 비율을 조정한다.

 

 

 

 

 

 

가. css에서 썸네일 이미지 크기를 조정한다.

css 2260행 즈음이거나 .list-type-thumbnail .post-item .thum img {  를 검색합니다. 거기에 

 

width: 150px;
height: 150px;

 

로 변경 하고 적용을 누릅니다.

 

이렇게만하면 썸네일 크기는 정사각형이 되었지만, 아직 안의 사진 비율이 안맞아보이네요.

 

 

 

 

 

 

나. html에서 썸네일 안의 사진 비율을 조정한다.

html 361행 즈음 이거나 C230x300 검색 하여 썸네일 안의 사진 비율을 

 

C200x200으로 조절하고 적용을 누릅니다.

 

 

 

 

 

 

 

3. 결론

그럼 완성이 되었습니다. 이게 근데 예전에 알아본바로는 C200x200 과 R200x200 등 또 다른 것들이 있었는데, 제 기억으로는 C200x200이 사진의 정가운데부터 조절해서 보여주는것으로 R200은 사진 전체를 조절하는것으로서 R은 우리가 정사각형으로 고정해 놓은 이상 사진이 작거나 비율이 틀어지는 경우가 많아서, 그냥 C200으로 했던 기억이 있습니다. 북클럽 스킨이 나름 책에 대한 컨셉으로 비율을 이렇게 해놓은것인데, 티스토리에서 만든 스킨중 이것만 그런걸로 알고있습니다. 다른건 원래 정사각형을 기본으로 해놓기 때문에 이런 문제가 없었거든요. 

아무튼 정사각형으로 만드니 기분이 편안하네요. 

그럼 20000