웹페이지 운영/티스토리

티스토리 썸네일 2:1 비율로 바꾸는 방법

world class product 2022. 6. 1. 01:17

 

본 페이지에서는 티스토리의 썸네일 크기는 2:1로 변경하는 방법에 대해서 설명드립니다.

 

썸네일 잘림 현상

블로그를 운영하는 많은 분들의 고민이 바로 썸네일일 것입니다. 어떤 블로그는 1:1 비율의 썸네일이 잘 표시되기도 하고, 어떤 소셜 미디어에는 2:1 비율의 썸네일이 잘 표시되기도 합니다. 사실 썸네일만 좀 더 신경써도 더 많은 트레픽을 유발할 수 있습니다. 반면, 썸네일이 잘려서 표시되면 그 만큼 클릭율이 떨어지게 됩니다.

 

왜 썸네일을 2:1로 변경하는게 좋은가?

우선 티스토리의 썸네일 크기를 2:1로 변경하는 방법에 대해서 설명하기에 앞서서 왜 썸네일 크기를 2:1로 변경하는 것이 좋은지에 대해서 설명드리겠습니다. 블로그든 홈페이지든 운영의 목적은 최대한 많은 사람들에게 콘텐츠를 도달하게 하는 것입니다. 더 많은 트래픽은 곧 더 많은 수익을 의미하기 때문입니다. 티스토리 블로그에 업데이트한 글들을 페이스북이나 트위터로 공유할 때 가장 잘 보이는 썸네일 비율이 2:1 비율이기 때문입니다. 이 때문에 티스토리 글을 페이스북이나 트위터로 공유하고자 하시는 분들은 2:1 비율의 썸네일을 사용하시기를 권장드립니다.

 

썸네일 2:1로 변경하는 방법

썸네일을 2:1로 표시하기 위해서는 스킨 편집이 필요합니다. 필자의 경우는 WhatEver 스킨을 기준으로 설명을 드리겠습니다.

 

썸네일 2:1로 변경하는 방법

스킨을 자주 변경하지는 않겠지만 어떻게 변경했는지 이력 관리를 위해서 GitHub와 같은 곳에 저장해서 형상 관리하는 것도 괜찮은 방법입니다. 주로 소프트웨어 개발자분들이 형상 관리를 위해서 GitHub와 같은 형상 관리 툴을 많이 사용하고 있습니다.형상 관리가 귀찮으시다면 그냥 메모장 같은 곳에 잘 기록해두면 됩니다.

서두가 길었네요. 필자의 경우 아래와 같이 스킨의 html과 css를 수정했습니다.

 

html 변경

위와 같이 C276x260 부분은 C400x200으로 변경해줍니다. GitHub를 사용하면 위와 같이 언제 어떻게 변경했는지 쉽게 비교할 수 있고 손쉽게 이력 관리를 할 수 있을 뿐더러, 언제든 특정 시점의 스킨 설정으로 되돌릴 수 있어서 아주 유용합니다.

 

css 변경

css 설정은 위와 같이 변경하였습니다.

 

링크

본 내용은 아래의 페이지에서 인사이트를 얻었습니다.

 

티스토리 썸네일 정사각형 크기 조절하기 (html, CSS)

썸네일을 만들어 포스팅을 하고 나서 보니 정사각형으로 만들어진 썸네일이 잘리더라구요. 가독성 향상을 위해 정사각형인 크기로 설정하는 방법을 알려드리도록 하겠습니다. 참고로 제 블로

dbsgml952.tistory.com