[iNove] 스킨 본문 폭 조정하기

iNove 스킨을 사용하면서 참고해야 할 포스팅을 모으고 있습니다.

 

♠ 본문 폭 조정하기

 

Inove 스킨의 기본 본문 넓이는 605px 정도 입니다.

블로그를 꾸미는데 전혀 지장이 없는 넓이이지만, 에드센스 광고를 달려고 하니 본문 폭이 최소 720px 정도는 되어야 되겠더군요. 그렇지 않으면 광고가 잘려서 나오는 경우가 있습니다.

 

그래서 애드센스 광고 720 X 90 사이즈를 설치할 수 있도록 본문 폭으로 조정해 주어야 합니다.

 

1. 관리자 -> HTML/CSS 편집을 선택하시고 Ctrl + F를 누르시면 브라우저 창에 "찾기"창이 생깁니다.

 

 

2. "찾기" 창에 /* main START */ 을 입력하면 style.css 란에 한개 나옵니다. width:605px;를 width:725px;로 수정합니다.

 

▲ 그리고 블로그 화면을 보시면 본문 폭이 늘어난것을 확인하실수 있습니다. 근데 오른쪽을 보시면 사이드바가 안보이지요. 본문폭이 늘어난 만큼 전체 레이아웃도 커져야 하는데 레이아웃 크기는 안커졌으니 사이드바가 자리를 못 잡고 하단으로 밀리는 현상이 생겼습니다.

 

3. 전체 레이아웃 크기도 키워야 겠지요. 찾기에 #container { 를 입력하세요.

 

 

4. width:936px;를 width:1056px;으로 수정하시면 전체 레이아웃이 수정됩니다. 저장하시고 블로그를 접속하시거나 접속되 있다면 새로고침을 눌러보시면 본문과 사이드바가 정리된것을 확인하실수 있습니다.

 

▲ 본문과 사이드바는 제자리를 잡았지만 이미지를 사용한 부분은 어긋나 있는것을 보실수 있습니다. 일단 이부분은 무시하시고 소스 수정을 계속 진행 하겠습니다.

 

5. 방명록 글쓰기 폼,댓글 쓰기 폼을 확인해 보세요.

 

▲ 위 이미지처럼 빈 공간이 생겼을 겁니다. 글쓰기 폼도 넓혀줘야 하겠지요.

 

6. 찾기에 #comment {을 입력 하세요. width:601px;를 width:721px;로 수정하세요. 저장후 방명록 글쓰기 폼,댓글 쓰기 폼을 확인해 보시면 본문폭과 같은 사이즈로 보여줄것입니다.

 

 

 

☞ 이것으로 본문 폭을 넓히는 소스 수정은 끝 났습니다.

 

그런데...

 

 

블로그 화면을 보시면 오른쪽 레이아웃이 이상하지요.. 이 부분은 이미지들이라 그렇습니다.

 

이미지 파일은 light.gif, footer.jpg, header.jpg을 수정하시면 됩니다.

 

이 글대로 본문을 120px 늘이셨다면 수정한 이미지를 첨부하니 사용하시면 됩니다.

 

light.gif, footer.jpg, header.jpg, box.gif 수정한 이미지 파일:   img.zip.zip

 

 

[출처 http://pastimelife.com/386]