티스토리 대표이미지 동일하게 비율설정하기 (썸네일 크기 고정)
티스토리를 운영하다보면 여러가지를 자체적으로 수정해야할 사항들이 꽤나 많은데요. 그중에서도 썸네일이미지가 뒤죽박죽 크기로 업로드되어 정돈된 느낌이 들지 않을 때 티스토리 목록 썸네일 이미지크기비율을 동일하게 설정하는 방법을 알려드릴게요~! 모든 스킨에 적용가능한 방법이니 참고해보셨으면 좋겠습니다.
01. 개발자 도구에서 썸네일 CSS 위치찾기
STEP1 개발자 도구에서 썸네일 CSS위치찾기 [티스토리설정]-[스킨편집]에 들어간 후 썸네일 오른쪽마우스 클릭에서 [검사]를 선택 후 개발자 도구로 들어가주세요.
STEP2 선택된 개발자 도구에서 썸네일만 선택되도록 코드를 선택해줍니다.
STEP3 CSS에서 선택된 .article-type-resize , thumbnail {를 복사해주세요.
02. 티스토리 CSS에서 크기 변경해주기
STEP1 티스토리 CSS편집창으로 넘어와서 Ctrl + F 찾기 누른 후 붙여넣기를 해주세요.
STEP2 .article-type-resize , thumbnail { 에서 height 값이 auto;로 되어있는 곳을 확인합니다. 가로사이즈width값은 100%로 지정이 되어있기 때문에 크기가 변동이 없지만 세로사이즈 height값은 자동으로 지정이되어 있었기 때문에 대표이미지(썸네일)이 크기 그대로 목록에 보여지고 있었기 때문에 이부분을 변경해줄게요.
STEP3 height값을 300px;로 변경해주세요.
03. 최종변경된 썸네일 확인
변경 전과 변경 후 비교해보니 잘 조정이 되었죠? 앞으로는 대표이미지 사이즈가 아무리 크더라도 그대로 노출되지 않고 이렇게 일정하게 비율이 맞춰져서 보여질거에요. 딱봤을때 보기 좋게 변경하는 건 중요한 항목이니 꼭 짚고 넘어가보면 좋을 것 같습니다. 오늘도 빠이팅이에요!
[유용한 관련글 보기]
'크리에이터 초보여도 괜찮아 > 티스토리 블로그 마스터하기' 카테고리의 다른 글
티스토리 애드센스 빠르게 통과하는 법 글쓰기 전략 (0) | 2023.01.19 |
---|---|
티스토리 블로그 네이버 서치어드바이저 간단히 등록하는 방법 (0) | 2022.09.15 |
티스토리 네이버 검색로봇이 사이트 서버에 접근할 수 없습니다 해결방법 총정리 (0) | 2022.09.05 |
네이버 서치어드바이저 robots.txt 수업오류 해결하는 방법 (0) | 2022.09.02 |