[블로그팁] 티스토리 사이드바 크기변경 (사이드바 사이즈 변경)

티스토리에서 제공해주는 스킨을 적용했을 경우 사이드바를 더 키워야 할 경우가 있죠.

저같은 경우 사이드 바에 구글 애드센스(300px 짜리) 를 넣어서 쓰는데 티스토리 블로그 스킨에서 제공해주는 사이드바 사이즈의 경우 200px 여서 애드센스 광고가 잘려서 보이더군요

뭐 물론 잘려도 상관없지만 뭔가 미관상 보기 안좋길래 사이즈바를 키웠습니다.

그런데 다른 블로그나 카페에서 제공해 주는 방법으로 "#sidebar" 에서 수치를 변경 후 사이드바가 밀리는것을 방지하기위해

"#container" 의 수치를 변경해 줘야 하는데 제 HTLM/CSS 코드에서는 #container 항목이 없어서 다른방법으로 해결했습니다.

저처럼 #container 항목이 없으신 분들은 다음과 같이 수정하시면 될것 같네요~


< 티스토리 사이드바 크기 변경하기 >

(혹시 모를 사태에 대비해서 아래에서 수정할 내용의 원본 백업 또는 수치를 꼭 적어 놓으시기 바랍니다)


1. 관리자 화면에서 [스킨 -> HTML/CSS 편집] 으로 들어갑니다.
2. Ctrl + F 를 눌러서 "#sidebar {" 를 치면 위 그림처럼 항목이 검색됩니다.
3. "#sidebar" 의 아래보면 width 수치가 이죠 저 수치를 원하는 수치로 변경합니다.
     (저같은경우 300px 로 변경해서 300px 로 되어있죠)


수치를 줄인경우는 관계 없지만 수치를 늘린경우 하단의 "미리보기" 를 해보시면 사이드바가 본문 아래로 내려가 있는게 보이실 겁니다. 전체 설정된 크기에 [본문]과 [사이드바] 가 같이 있는데 사이드 바의 크기를 늘려 버렸더니 전체 크기에 한번에 안들어가 아래로 밀려 버린겁니다. 자 해결해 봅시다!


4. 위 그림을 보시면 빨간색으로 표시된 #body 항목에 1040px 로 되어 있는 게 보이시죠 이 수치를 #sidebar 에서 변경한 만큼 추가해서 바꿔 주시면 됩니다.
      (저같은경우 최초 940 이었으나 #sidebar 의 항목을 100 추가 했으므로 940에서 100 추가한 1040px 로 잡아 주었습니다.)

자, 이제 끝이 났고 적용하기전에 하단의 "미리보기" 를 꼭! 해보세요
혹시라도 잘못 수정하고나서 미리보기 없이 적용을 해버렸을 경우 경우 위에서 말해놓은대로 원본 코드나 수치등으로 수정해서 돌아가시면 됩니다.