티스토리 블로그 썸네일, 정사각으로 변경하기 안내입니다.
아주 오랜만에, 네이버 블로그가 아닌 티스토리 블로그에 글을 올리고 보니 썸네일이 네이버 블로그처럼 정사각이 아니고 내용이 위아래가 가려진 직사각 모양이더군요.
티스토리 블로그는 스킨에 따라서 썸네일 모양이 다르게 적용되는 경우가 많은데 저희가 사용하는 "북클럽' 스킨은 정사각 썸네일을 제공하지 않습니다. 그래서, 후다닥 변경해 보았습니다.
처음에는 기존 티스토리 썸네일 사이즈인 230*140으로 썸네일을 바꿀까 생각하다가, 그거보다는 티스토리 썸네일 모양을 아예 정사각형으로 바꾸는 편이 훨씬 낫겠다는 생각이 들더군요.
할 때마다 바꾸는 것이 아니고, 딱 한 번만 세팅을 바꿔주면 되기 때문에 생각보다 어렵거나 번거롭지 않습니다. 티스토리는 네이버 블로그와 달리 세팅을 바꿀 때 html 편집을 해야 해서 어렵게 느끼시는 분들도 계시는데요.
'html 편집' 에서 숫자와 auto 글자만 바꿔주면 되기 때문에 복잡하거나 어렵지 않습니다. 생각보다 간단하게 바꿀 수 있습니다. 자, 그럼 시작해 볼까요?
티스토리 북클럽 스킨 확인 및 정사각 썸네일 변경
먼저, 저희가 이번 시간에 바꾸려는 티스토리 썸네일은 북클럽 스킨 중에 리스트를 '뉴북'으로 설정한 썸네일에 해당됩니다. 티스토리 블로그 스킨이 '북클럽'이신 분이라면 먼저 리스트가 '뉴북'으로 되어있는지 확인해 보세요.
*북클럽 스킨 및 뉴북 리스트 확인 방법
티스토리 블로그 관리로 들어가서, 스킨편집을 클릭하시고 마우스 스크롤을 쭉~ 밑으로 내리시면 오른편에 리스트가 나타납니다. 리스트를 북리뷰에서 뉴북으로 바꿔주세요.
리스트를 뉴북으로 변경하셨다면, 이제 본격적으로 썸네일을 정사각 모양으로 바꿔 보겠습니다.
리스트를 변경하셨던 스킨 편집에서, 오른쪽 상단을 보시면 "html 편집"이 보이실 거예요. 그 'html 편집'을 클릭해 들어가 주시면 됩니다.
'html 편집'이라하면 저 같은 코딩 문맹들은 겁부터 내고 웬만하면 건들지 않으려고 하는데요. 앞서, 말한 것처럼 생각보다 복잡하지 않습니다. 그리고, 딱 필요한 부분만 체크해서 바꿔주면 되기 때문에 어렵지도 않습니다.
'html 편집'을 클릭하고 들어갔으면 "ctrl+F"를 눌러 's+article_rep_thumbnail' 검색해 아래와 같은 부분을 찾아주세요.
제가, 노란색으로 색칠해 놓은 'C230x300'을 'C230x230'으로 바꿔주세요. 그런 다음, 상단에 있는 "적용" 버튼을 클릭해 주세요. 그러면, 일단 썸네일은 정사각 사이즈로 바뀌게 됩니다.
티스토리 썸네일 크기 변경
여기까지 왔다면 90%는 다 되었습니다. 이제, 마지막으로 변경한 티스토리 정사각 썸네일 사이즈를 조금만 크게 바꿔볼까요, 나는 굳이 크게 안 바꿔도 괜찮다 하시는 분들은 여기에서 멈추셔도 괜찮습니다. 사실, 썸네일 사이즈가 드라마틱하게 커지는 건 아닙니다.
이번에는, HTML옆에 있는 CSS를 변경해 주시면 됩니다. CSS가 어디에 있냐구요? "스킨편집 "에서 "html 편집"을 누르고 들어오면 상단에 "HYML | CSS | 파일업로드" 이렇게 세 부분으로 구분되어 있는 걸 확인하실 수 있으실 거예요.
"CSS" 클릭하고 "ctrl+F"를 눌러 "list_type_thumbnail"을 찾아주세요.
그런 다음, "width:126px; height:auto; " 이 부분을 height부분만 166px로 바꾸어 주세요. 밑에 부분은, width:160px로, height는 auto로 바꾸어 주시면 됩니다. 마지막으로 상단에 '적용' 버튼 누르는 것을 잊지 말아 주세요. 적용 버튼을 누르지 않으면 변경이 되지 않습니다.
자, 티스토리 북클럽 스킨 썸네일 정사각으로 변경이 다 끝났습니다. 아래에서 변경 전과 변경 후의 모습을 확인해 보세요.
↓↓↓↓↓
어떠신 가요? 여러분도 썸네일이 정사각으로 잘 변경되셨나요? 그렇다면, 굳이 왜 이 불편함을 겪으면서 북클럽 스킨으로 하는 걸까요? 그 이유도 천천히 전해 드리겠습니다.
브랜드컴퍼니협동조합은 8년 연속 관공서 블로그와 유튜브, 페이스북 광고 등을 운영하고 있는 전문 업체입니다. 브랜드와 마케팅, 콘텐츠 만드는 이야기를 이 블로그에서 차곡차곡 전달해 드리려고 합니다.
'소셜 마케팅' 카테고리의 다른 글
SNS 퍼포먼스 마케팅이란? (0) | 2023.06.15 |
---|---|
인스타그램 팔로워 늘리기, 가장 중요한 두가지! (1) | 2023.06.14 |
2023 인스타그램 사이즈(프로필, 피드, 스토리) 설정 방법! (0) | 2023.06.13 |
블로그 수익화를 위해 꼭 필요한 티스토리 최적화 설정 7가지! (0) | 2023.06.08 |
블로그 수익화, '티스토리 블로그 VS 네이버 블로그 비교 분석' (1) | 2023.06.06 |
댓글