티스토리 제재를 피하는 플로팅배너, 떠다니는 배너 다는 법 - 리얼센스

최근 블로그에 광고를 넣는 분들 중에서 떠다니는 배너(플로팅 배너, 고정형 배너)를 사용하시는 분들이 많이 있습니다.

플로팅배너가 광고클릭율이 높기때문에 수익이 많거든요.

특히, 애드센스와 달리 리얼센스에서는 플로팅배너를 허용해서 플로팅배너를 사용하시는 분들이 많이 있습니다.링크프라이스같은 제휴마케팅 광고를 플로팅 배너로 이용하시는 분들도 있고요.

그런데, 티스토리, 플로팅배너, 스크롤배너 제대로 알고 있나요? - 블로그 꾸미기에 따르면 본문을 가리는 광고는 제재대상이라고 합니다.

[★] 이부분은 담담 부서에 직원과 이야기 한부분이어서 정확한 내용이 되겠습니다.

어떠한 형태(어떠한 해상도) 에서도 본문영역을 가리게 되면 제재 대상입니다.

하지만 대부분의 플로팅배너는 해상도에 따라서 본문을 가리게됩니다. 아마 소스를 공개하신 분이 이 내용을 모른체 소스를 만드셨던 모양입니다.

그래서 해상도가 바뀌어도 본문을 가리지않고 플로팅배너를 만드는 법을 알려드립니다.

HTML과 CSS로 간단히 만들 거라서 움직임이 없는 그냥 고정된 형태입니다.

보통은 배너 광고의 위치를 브라우저 화면의 왼쪽 최상단을 기준점으로 해서 왼쪽으로 얼마, 아래쪽으로 얼마 떨어진 위치에 광고를 표시하기 해상도에 따라서 광고가 본문 일부를 가리게되는 겁니다.

하지만 제가 소개해드릴 방법은 본문 최상단을 기준점으로 사용합니다. 기준점에서 광고의 너비만큼을 왼쪽으로 이동시킨 곳에 광고를 표시할 것입니다.

위에서는 그냥 left, top 설정을 이용했다면 여기서는 margin-top과 margin-left를 이용할 겁니다. 이 값을 음수로 하면 되거든요.

꼭 알아야할 필수 CSS 첫번째 - border, margin, padding에 margin에 대한 설명이 있습니다.

다만, 주의할 점은 이 방식은 본문을 가리지는 않지만 해상도에 따라 광고자체가 잘릴 수도 있습니다. 하지만, 리얼센스에서는 해상도에 따라 광고 일부가 잘려도 제재 대상은 아니니까 걱정안하셔도 됩니다.

플로팅 배너(떠다니는 배너) 소스

Skin 편집의 html 부분에 아래 소스를 넣으세요. 3번째 줄을 보면 스킨의 content 영역에 넣게 되어있는데요. content영역에 넣어야 배너의 아래부분이 짤리지 않게됩니다. 광고를 클릭할 수 있는 부분이 넓어야 좋겠죠.

또, contents에 광고를 넣으면 글목록이나 방명록 등에도 광고가 표시되서 노출수가 증가합니다.

content에 넣지 않으실 분들은 [샵샵_article_rep_desc_샵샵] 바로 위에 넣으셔도 됩니다.

  <!-- #### Header End #### -->
  <!-- #### Main Start #### -->
  <div id="content">
<!-- 블로그 세로형 배너 (120x600) - 왼쪽 사이드바 시작 -->
<div class="float_banner">
<script type="text/javascript" src="http://rsense-ad.realclick.co.kr/rsense/rsense_ad.js?rid=49165233632&amp;stamp=1313599926" charset="euc-kr"></script>
</div>
<!-- 블로그 세로형 배너 (120x600) - 왼쪽 사이드바 끝 -->
 

아래는 css 내용입니다.

css 내용 중에 6, 7번째 줄에 있는 margin-left와 margin-top 설정을 본인의 블로그에 맞게 바꾸세요. 위에서 설명했지만, margin-left는 꼭 음수이어야합니다.

.float_banner	{
	position:fixed;
	border:1px solid #cecece;
	height:600px;
	width:120px;
	margin-left:-132px;
	margin-top:-11px;
	padding:0	}

이제는 해상도에 상관없이 광고의 위치는 꼭 정해진 자리에 표시가 됩니다. 어떤 해상도에서 보더라도 같은 화면을 보게되는 것이죠.

플로팅 배너를 사용하시는 분들은 티스토리 측의 제재을 받지 않도록 미리 광고 표시 소스를 바꾸시기 바랍니다.

기존에 많은 분들이 사용하는 javascript를 이용한 배너 소스도 left나 top대신에 광고 삽입위치와 margin을 조절하면 해상도에 상관없이 본문을 가리지않는 배너를 만들 수 있습니다.

다만, 한가지 본문을 가리지않는 플로팅배너는 클릭율이 매우 낮습니다. 결국 본문을 가리는 배너를 달아야 수익이 높은데, 이는 티스토리의 제재를 받기때문에 사용할 수 없지요. 제재를 피하는 방법으로 사용할 수 있는 플로팅 배너는 클릭율이 낮아 수익은 도움이 되지 않지만 스킨을 망치는 애물단지가 되기 쉽습니다. 제가 플로팅배너늘 사용하지 않는 이유입니다.

여러분들도 플로팅 배너를 사용할 때 잘 고려하시기 바랍니다.

관련글

꼭 알아야할 필수 CSS 첫번째 - border, margin, padding
blockquote - 인용문 배경 예쁘게 꾸미는 html 태그와 css
background, background-image, backgroun-color
[블로그 꾸미기] 댓글 입력창 꾸미기
[블로그 스킨 만들기] 블로그 속도를 빠르게 - css tidy
애드센스 수익 향상시키기 - 애드센스 단가 올리는 법