티스토리 구글 애드센스 가로로 광고 2개 다는 방법(2단 광고)

티스토리 구글 애드센스 가로로 나열하는 방법

CSS 코드를 조금 안다면 더 자유롭게 수정이 가능하고 테이블 코드를 Div로 감싸서 중앙정렬이나 위 아래 마진값을 주는 방법으로 훨씬 깔끔하게 배치가 가능하다.

물론, 나의 경우에는 수익형 블로그의 경우 광고로 거의 도배하다시피 하지만, 그래도 최대한 깔끔하게 배치하는 것이 광고효율을 높일 수 있는 방법이라고 할 수 있다. 광고를 할거라도 컨텐츠처럼 활용될 수 있게 꾸미는 것이 바로 구글 애드센스 광고의 묘미라고 할 수 있겠다.

 

 

<!--
<table border=0 width=100% cellspacing=0 cellpadding=0>
<tr>
<td width=50%>

</td>
<td width=50%>

</td>
<tr>
</table>
-->

 

보통은 위의 방법으로 구현하고 광고 위치에 따라서 조금 달라질 수 있다. 테이블코드로 가로로 광고를 2개 달 수 있는데, cellspacing(Cell Spacing)속성은 말 그대로 셀과 셀 사이의 여백을 조절할 수 있다. 그래서 가로로 나열하되, 광고가 서로 너무 붙는 것 같다고 생각되면 위의 속성값을 변경해주면 된다.

테이블을 작성할 때, 테이블 내부의 선의 두께를 정의하는 속성은 Cellpadding인데, 주로 셀을 강조할 때 사용할 수 있다. 즉, 여백공간으로도 사용할 수 있는데, 어차피 그럴거라면 div로 감싸서 여백을 주거나 좌우 패딩을 주는 것이 훨씬 깔끔하게 구현할 수 있다. 가로로 광고를 달 때, 이왕이면 cellspacing속성만 수정해주는 것이 깔끔하다.

 

td값을 조절해서 여러개의 광고코드를 더 배치할 수가 있다. 애드센스 코드를 반응형으로 가져오면 %값에 따라서 사이즈가 알아서 조절이 되기 때문에 가로로 나열할 때, 2개 또는 3개, 4개 등 여러개를 배치할 수 있다. 그래서 여러개의 광고를 배치하고 싶다고 한다면 3개일 경우에는 33.3%으로 4개일 경우에는 25%로 각 요소마다 동일하게 분할해주면 된다.

Div 블럭으로 감쌀 때는 적당히 클래스나 ID를 설정해서 <div class="adlayout"> 정도로 코드를 작성하고 언제든지 CSS를 변경할 수 있도록 미리 설정해준다면 다른 블로그도 동시에 운영할 때, 각 사이트나 스킨의 특징에 따라서 쉽게 디자인 부분을 개선시킬 수 있다.

 

※ 구글애드센스 사이트에서 광고단위를 형성할 때, 취향에 따라서 광고단위를 만들지만 개인적으로 가로 2단 광고배너의 경우에는 별도로 광고단위를 만들어서 설정하는 것이 광고 트래픽을 쉽게 분석하기도 편하기 때문에, 나의 경우에는 구분해서 광고단위를 배치시켰다.

하나의 광고코드로 해도 되지만, 느낌상 서로 다른 광고단위가 서로 다르게 광고로 노출이 되는 경우가 더 많은 것 같은 느낌이 들었다.

※ 테이블로 구글애드센스 광고배너를 가로 2단으로 나열했다고 하더라도 가끔 광고 배너 한개만 넓게 배치되는 경우가 있다. 새로고침을 해보면 대략적으로 빈도에 따라서 노출되는 방식이 조금씩 다르다는 것을 확인할 수 있을 것이다.