티스토리 사이드바 사이즈 넓히기
▣ 티스토리 [사이드바] 사이즈 넓히기 |
■ 지금 제 블로그 같은 경우는 사이드 바에 애드센스 좀 큰걸 넣기 위해서 가로폭을 넓혀놓은 상태인데요. sidebar의 가로폭을 넓힐때는 웹 페이지의 "전체 넓이"와 "본문의 넓이" "사이드바의 넓이" 를 고려해서 넓혀 줘야 합니다. 그렇지 않으면 사이드바가 본문 오른쪽 아래로 내려오게 됩니다. 전체넓이와 본문의 넓이를 고려해서 조금 여유를 두고 설정하는게 좋습니다.
간단하게 숫자 두개만 고치면 되니까 한번 해보세요.
■ 현재 제 블로그의 스킨 사이즈 인데요. 보시는것과 같이 웹페이지 전체를 1100으로 하고, 본문 사이즈는 700, sidebar에는 가로 300 짜리 애드센스를 넣기 위해서 310으로 설정을 했습니다. 90정도의 여유를 두고 설정을 한 상태입니다. 애드센스 옆에 보면 약간의 공간이 남는게 확인이 되네요.
■ 먼저 본문 사이즈를 700으로 설정을 하겠습니다. 관리자 모드로 들어가서 [스킨 ▶ 스킨위자드]선택합니다.
■ 다음과 같이 스킨위자드 창이 나타나면 [게시글] 탭을 선택하면 글영역 넓이를 설정할 수 있습니다. 직접 숫자를 입력하셔도 되고, '바'를 잡고 드래그 하셔도 됩니다. 전 700으로 설정했습니다.
■ 다음은 웹 페이지의 전체 넓이를 설정하겠습니다.
[관리자모드] ▶ [HTML/CSS편집]을 선택하고 찾기[Ctrl+F]를 눌러서 그림과 같이 "container"을 입력해서 찾습니다. 아래쪽의 style.css에 container가 보이실 겁니다.
■ 확대해서 보도록 하겠습니다. 1100px 라고 설정된 부분이 전체 화면의 가로폭입니다. 저부분을 원하는 사이즈로 설정해주시면 됩니다.
■ 이제 사이드바의 가로폭을 설정하도록 하겠습니다. 같은 방법으로 Ctrl+F를 눌러서 "sidebar"를 입력해서 찾습니다.
■ width : 310px 부분이 sidebar의 가로폭입니다. 서두에서 말했듯이 저같은 경우는 애드센스 가로폭 300짜리를 달기 위해서 좀 더 여유를 두고 310px로 설정을 하였습니다.
■ 설정을 해보니까요. 딱 맞아 떨어지게 설정하는 것보다 조금 여유를 두고 설정하는게 좋을거 같아요. 예를들어 전체 사이즈 1000, 본문 700, 사이드바 300으로 하면 이론상으론 딱 맞아 떨어져야 하는데 그렇지가 않더라구요. 사이드바가 아래쪽으로 내려와버리더군요. 저같이 약간의 여유를 두고 숫자를 조절해 가면서 맞추는게 좋을것 같습니다.