오늘은 Fastboot스킨 포스팅 영역과 사이드바 영역의 가로폭을 조정하는 방법에 대해 알려드리겠습니다. 블로그를 운영하다보면 글을 쓰거나, 글 중간에 광고를 삽입했을 때 본문 가로 길이가 마음에 들지 않다거나, 광고가 너무 길어서 삐져나오는 경우가 있습니다. 다른 블로그 스킨의 경우 티스토리 관리화면 글 설정 기능에서 글쓰기 환경 안에 있는 가로폭 부분을 수정해주면 본문 너비가 조정되는 경우가 있어서 편리합니다. 하지만, Fastboot의 경우에는 이 기능이 전혀 듣지를 않습니다.

이럴 경우에는 어떻게 하면 좋을까요? 패스트부트 스킨에서 가로폭을 변경하는 방법, 지금부터 알아보도록 합시다. 전혀 어렵지 않으니, 천천히 설명을 따라와주신다면 그 누구라도 하실 수 있습니다.

 블로그 가로폭 수정하는 방법

먼저, 블로그 메인화면에서 q키를 눌러서 티스토리 관리화면으로 진입합니다. 왼쪽 사이드에 보면 꾸미기가 있는데 그 아래에 있는 HTML/CSS 편집을 누릅니다.

HTML 화면에서 오른쪽에 있는 하얀 부분을 아무 곳이나 한번 클릭한 후 Ctrl키와 F키를 눌러서 검색창을 뜨게 합니다. 그후, id="leftContent" 라고 입력을 하고 엔터를 칩니다. 그러면 위와 같이 <div id="leftContent" class="col-md-9"> 라는 부분이 보이실 겁니다. 여기서 화살표가 가리키는 부분을 8 또는 7로 수정을 합니다. 

이 부분이 어떤 부분인지 궁금하시다구요? 여기는 포스팅 영역에 해당하는 부분이고, 아래에서 설명해드릴 사이드바 영역에는 각각 숫자가 있습니다. 이 숫자들을 더해서 총 12를 이루도록 되어 있습니다. 아마 기본적으로 포스팅 영역은 9로 되어 있고, 사이드바 부분은 3으로 되어 있을 것입니다. 숫자가 작아질수록 포스팅 글쓰기를 하는 부분의 영역 줄이기를 하실 수가 있습니다. 

너무 폭이 좁아지면 보기에 좋지 않을 수 있으니 8이나 9로 하는 것이 좋겠습니다. 글쓰기 부분을 수정했으니 이제 사이드바 영역을 수정하러 가봅시다.

아까와 마찬가지로 Ctrl키와 F키를 동시에 눌러서 검색창을 뜨게 한 후, 이번에는 sidebar col-md 라고 입력을 하고 엔터를 칩니다. <aside><div id="sidebar" class="sidebar col-md-3"> 이라는 부분이 보이실 겁니다. 여기서도 화살표가 가리키는 숫자부분을 수정해주시면 사이드바 영역의 가로폭을 수정하실 수가 있습니다. 모두 완료가 되었다면 오른쪽 위에 있는 저장버튼을 누르시면 됩니다.

▼ 9:3 비율의 Fastboot 스킨 가로폭

포스팅 부분 대 사이드바 부분이 9:3인 경우입니다. 왼쪽 영역이 넓고, 오른쪽 사이드바 영역은 좁게 되어 있습니다. 본문 포스팅을 널찍하게 보여지기를 원하고, 동시에 사이드바 부분은 최소화하고 싶으신 분에게 추천하고 싶은 비율입니다.

▼ 8:4 비율의 Fastboot 스킨 가로폭

이것은 포스팅 영역 대 사이드바 영역을 8:4로 수정했을 때의 화면입니다. 아까에 비해서 왼쪽 영역이 감소하고, 오른쪽 영역이 넓어진 것을 확인하실 수 있습니다. 이렇게 HTML 소스 코드 부분을 손을 봐주면 가로폭을 손쉽게 수정하실 수가 있습니다. 혹시 Fastboot 스킨을 이용하고 계신 분들 중에 사이드바 영역을 좀더 넓게 해서 구글 애드센스 광고를 넓게 보여지게 하고 싶으신 분이나 모바일 화면에 친숙하도록 왼쪽 글쓰기 화면을 축소시키고 싶으신 분이 계시다면, 적극 활용 및 응용해보시기 바라겠습니다.

구글 블로그 애드센스 광고 글 사이(중간)에 넣기 방법

티스토리 블로그 타이틀 마우스오버 색상(색깔, 컬러) 변경하기 방법

티스토리 블로그 타이틀에 홈화면(홈으로) 링크 효과주기 방법

티스토리 블로그 줄간격 변경 방법

포토스케이프로 블로그 썸네일 및 카드뉴스 제작 만들기

도움이 되셨다면, 로그인 없이 가능한

아래 하트♥ 공감버튼 을 꾸~욱!