티스토리 View 애드박스 사이드바로 옮기기

View 애드박스 서비스는 어쩌면 계륵과도 같은 존재일지 모릅니다.

수익은 상위 블로거들에게 집중되어 있는데

가장 광고 효과가 높은 본문 상단 오른쪽에 딱 차지하고 있으니 말이죠

옮기고 싶어도 HTML/CSS에 익숙하지 않은 블로거분들은

원래 위치대로 사용하고 계시거나 비활성화 하신 분들도 많으실텐데요

그동안 저도 귀차니즘으로 놔두고 있다가 사이드바로 옮기는 작업을 감행했습니다.

이쁘게 잘 옮겨져서 방법을 소개드려볼까 합니다.

▼ 사이드바로 옮긴 View 애드박스

View 애드박스 활성화

View 애드박스 위치때문에 비활성화 해놓으셨다면 우선 플러그인 설정에서

View 애드박스를 다시 활성화 합니다.

사이드바에 해당 블로그 View 애드박스 추가하기

활성화 하면 View 애드박스가 본문 상단 오른쪽에 떡하니 위치하게 되는데

본문에서 없애기 전에 사이드바로 이동을 시켜줍니다.

본문에서 소스보기를 해서 아래와 같은 소스를 찾으시면 됩니다.

ad250으로 검색하시면 금방 찾으실 수 있습니다.

<div class="ad250_outter" style="float: right; margin: 0 0 20px 10px; position: relative; width: 250px;">



<div class="ad250" style="background: transparent url(http://i1.daumcdn.net/img-media/media3/common/ad250_bar_r2.gif) 

     no-repeat scroll 0 0; width: 250px; height: 250px; padding: 18px 0 0; position: relative; width: 250px">
  <iframe width="250" height="250" border="0" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" 

          src="http://amsv2.daum.net/ad/adview?secid=00659&mkvid=1&blogid=465466"></iframe>		

</div>
 
</div>

해당 소스를 복사해서

사이드바 -> HTML배너출력 으로 하나 추가한다음 소스를 추가하고

이름은 간단하게 View 애드박스로 해서 사이드바에 추가합니다.

좌우 여백이 일정하도록 <center></center>로 싸줍니다.

<center>

<div class="ad250" style="background: transparent url(http://i1.daumcdn.net/img-media/media3/common/ad250_bar_r2.gif) no-repeat scroll 0 0; width: 250px; height: 250px; padding: 18px 0 0; position: relative; width: 250px">
            <iframe width="250" height="250" border="0" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://amsv2.daum.net/ad/adview?secid=00659&mkvid=1&blogid=465466"></iframe>        </div>
</center>

지금까지 하시면 View 애드박스가 본문에 하나 있고 사이드 바에 하나 있게됩니다.

이제 본문의 애드박스를 없애보겠습니다.

본문 View 애드박스 없애기

없애는 방법은 생각보다 간단한데

티스토리 관리 -> 꾸미기 -> HTML/CSS편집에서 Style.css 에서 다음과 같은 소스를 찾습니다.

.ad250_outter {margin: 6px 18px 6px 9px !important;}

해당 DIV를 안보이게 하기위해서 아래처럼 display:none 스타일을 추가해줍니다.

.ad250_outter {display:none; margin: 6px 18px 6px 9px}

혹시 모르니 원래 소스는 주석처리 하는게 좋겠지요?

그래서 저는 아래와 같이 수정해놨습니다.

/*.ad250_outter {margin: 6px 18px 6px 9px !important;}*/
.ad250_outter {display:none; margin: 6px 18px 6px 9px}

이렇게 수정하시고 적용하시면 본문의 View 애드박스가 사라지고

사이드바에만 활성화되어 보이게 됩니다.

생각보다 간단하지요?

응용하시면 원하시는 위치로 View 애드박스 위치를 변경하실 수 있을 것 같네요

비록 지금까지 최대 수익금이 만원인 애드박스지만

다시 한번 활성화해서 언젠가는 상위권 랭크를 기대해 봅니다. ^^

이상 티스토리 View 애드박스 사이드바로 옮기는 방법이었습니다.