온라인 광고 업체 및 티스토리 위치별 광고 삽입 방법 정리

 

요즘 국내 여러 블로그를 돌아다니다 보면 아티클 상하단 혹은 사이드바에 설치된 광고를 쉽게 접할 수 있습니다. 블로그 유입자가 많아질수록 광고 노출이 많아져 취미로 시작했던 블로그를 수익의 주업으로 삼는 분들도 많은데요. 광고 수입에 너무 연연하다 보면 진정성 있는 포스팅과 점점 거리가 멀어져 글의 퀄리티가 추락할 수도 있는 단점이 있지만 적절히 활용하면 꾸준히 블로그를 유지할 수 있는 모멘텀이 되기도 합니다. 오늘은 국내 온라인 광고 대행업체와 티스토리 위치별 광고 삽입 방법을 정리해볼까 합니다.

 

자주 사용하는 광고 용어

---

• CTR - Click through rate
  클릭율, 광고 노출수 대비 비율을 백분율로 환산한 수치로 비용 지불. CTR = 클릭수/노출수*100
• CPC - Cost Per Click
  가장 많이 사용되는 광고 형식. 방문자가 광고를 클릭할 때마다 비용 지불.
• CPA - Cost Per Action
  광고를 클릭하여 회원가입이 등 소비자가 반응하면 수익이 지불되는 형식.
• CPS - Cost Per Sale
  제품이나 서비스가 판매되었을 때 수익이 지불되는 형식. 최근엔 CPA보다 CPS가 널리 사용됨.
• CPM - Cost Per Mille
  1000회 광고가 노출될 비용 지불. 트래픽이 많은 사이트나 블로그에 유리.

 

대표적인 온라인 광고 대행사

---

• 구글 애드센스 - CPC
  광고 단가가 대체적으로 높은 편이고 맞춤형 광고를 매우 잘 구현해 블로거들이 가장 선호합니다. 텍스트 광고 같은 경우 작성자의 글을 분석해 비슷한 업체의 광고를 띄어주는데 정확도가 꽤 높습니다. 하지만 제재나 제약이 가장 심한 편이고 광고 정책 등을 잘 숙지하지 않거나 부정클릭 등이 발생하면 일방적인 계정 정지 통보를 보내기도 해 일부 블로거의 불만을 사고 있기도 합니다.
• 리얼클릭 - CPC
  국내 온라인 광고 업체 중 상위를 달리고 있습니다. 구글 애드센스에 비해 제재사항이 적고 플로팅 광고 등으로 인기를 얻고 있습니다. 하지만 광고 종류나 단가가 낮은 편입니다. 또한 자사 광고가 일정 시간 송출되는 점도 단점으로 꼽을 수 있습니다.
• OPAP센스 - CPC (운영 종료)
  중앙일보 계열사가 운영하고 있는 온라인 광고 서비스입니다. 아직 많이 알려지지 않았지만 대부분 단가가 50원에서 100원 정도로 리얼센스 광고 단가에 실망한 분들이 대거 이동했다는 소문이 있습니다.(?) 하지만 역시 타케팅 광고나 종류가 구글 애드센스에 비하면 현저히 적다는 것이 단점입니다.
• 애드젯 - CPM, CPC (운영 종료)
  유입량이 많은 블로그나 사이트에 유리한 CPM 광고를 지원합니다. 또 다양한 종류의 광고 배너 위젯을 제공해 블로그 스킨과 어울리는 광고를 구성할 수 있습니다. 단가는 많이 높아 보이진 않네요.
• 올블릿 - CPC (운영 종료)
  블로그 심사가 까다롭지 않고 티스토리 자체 플러그인 제공으로 설치가 편리한 장점이 있습니다. 네이버 블로그에 주로 사용된다고 하네요.
• Kauli - CPC (운영 종료)
  일본의 애드센스로 불리는 서비스입니다. 국내 모바일 광고 솔루션 업체인 카울리와 이름이 혼동될 수 있으니 주의하시길. 광고 단가가 높아 한때 국내에서도 유행했으나 성인 광고만 지나치게 남발하여 사용자가 적어진 뒤로 최근엔 잠잠한 서비스입니다. 일본 회사이다 보니 매칭 된 광고의 종류가 다양하지는 않네요.
• 네오애드 - CPC (운영 종료)
  리얼센스(리얼클릭)와 함께 구글 애드센스의 대항마로 떠오른 온라인 광고 업체입니다. 구글 애드센스보단 적지만 리얼센스보단 훨씬 많은 종류의 광고를 노출합니다. 또한 플로팅이나 토스트 형식의 광고 코드를 자동으로 생성하고 조정할 수 있어 편리합니다. 단가는 애드센스보단 적지만 리얼클릭의 단가나 종류에 실망하셨다면 네오애드를 사용해보시기 바랍니다.
• 링크프라이스 - CPA, CPS
  국내 대표 제휴 마케팅 업체입니다. 머천트 수나 서비스 등에서 압도적으로 많은 수를 자랑합니다. 대체로 블로그에게 유리한 수익 모델을 갖추었고 수익률이나 활동이 활발한 블로거는 전담 직원이 직접 관리한다고 하네요. 특별한 관리까지는 아니고 괜찮은 광고주가 발견되면 이메일을 통해 신속하게 알려준다고 합니다.
• 아이라이크클릭 - CPA, CPS
  링크프라이스와 함께 제휴 마케팅의 양대산맥 중 하나입니다. 광고주가 겹치는 곳이 많지만 잘 찾아보면 링크프라이스에 없는 광고주도 일부 있다고 합니다.
• 스폰서애드 - CPC
  아이라이크클릭에서 CPC 광고 위주로 독립적으로 운영하기 위해 출범한 서비스입니다. 신생 서비스여서 그런지 광고주가 많지 않지만 오버추어 광고주를 필두로 단가가 거의 국내 상위 수준이라는 소문이 돌고 있습니다. 만족스러운 광고 업체를 찾지 못하셨다면 스폰서애드로 테스트해보시는 것도 좋을 듯싶습니다.

 

티스토리 블로그 광고 삽입 방법

---

1. 본문 상단, 하단에 광고 삽입하기

관리자 페이지 - 스킨 편집에서 article_rep_desc 를 검색합니다. article_rep_desc 앞에 광고 코드를 넣으면 본문 상단에, 뒤에 넣으면 본문 하단에 광고가 위치하게 됩니다. 아래 이미지를 참고해주세요.

 

 

광고 코드를 <table> 태그로 감싸면 더 깔끔해집니다. 가운데 정렬하고 싶으면 아래처럼 <center> 태그를 추가하시면 됩니다.

<table>
  <center>광고 코드</center>
</table>

 

광고 상단 혹은 하단에 여백을 두고 싶다면 아래 태그를 추가하면 됩니다.

<div><br /></div>

 

2. 카테고리 글 목록에 광고 삽입하기

스킨 편집에서 list_conform 을 검색합니다. list_conform 위에 광고 코드를 넣으면 카테고리 글 목록 상단에 광고가 표시됩니다. 

 

 

<table>
  <center>광고 코드</center>
</table>
<h3>
  [<span class="searchText">[ ##_list_conform_## ]</span>]에 해당되는 글 ...
</h3>

 

반대로 </s_list> 태그 위에 광고 코드를 넣으면 글 목록 하단에 광고가 표시됩니다. 

<s_list>
  ...
  <table>
    <center>광고 코드</center>
  </table>
</s_list>

 

3. 광고 두 개씩 나란히 가운데 정렬하기 (참고 글)

아래 코드에서 width 속성 값(본문폭)과 광고 코드 부분을 수정하고 붙여넣으시면 됩니다.

<table width="본문폭" border="0">
  <tr>
    <td align="center">광고 코드</td>
    <td align="center">광고 코드</td>
  </tr>
</table>

 

4. 플로팅 광고 삽입하기

먼저 skin.html에서 아래 코드를 복사-붙여넣어 주세요. <ul> 태그 뒤엔 광고 코드를 넣으시면 됩니다. 참고로 구글 애드센스는 플로팅 배너 광고를 금지하고 있습니다. 

<div id="floatdiv">
  <ul>
    광고코드
  </ul>
</div>

 

style.css 에서 아래 코드를 복사 붙여넣은 뒤 right, top 속성 값은 사용자 스킨에 따라 적절히 수정해주세요.

/* 플로팅 배너 (Floating Menu) */
#floatdiv {
  position: fixed;
  _position: absolute;
  _z-index: -1;
  width: 170px;
  overflow: hidden;
  right: 11px; /* 사용자 스킨에 따라 수정 */
  top: 120px; /* 사용자 스킨에 따라 수정 */
  background-color: transparent;
  margin: 0;
  padding: 0;
}

#floatdiv ul {
  list-style: none;
}

#floatdiv li {
  margin-bottom: 2px;
  text-align: center;
}

#floatdiv a {
  color: #5d5d5d;
  border: 0;
  text-decoration: none;
  display: block;
}

#floatdiv a:hover,
#floatdiv .menu {
  background-color: #5d5d5d;
  color: #fff;
}

#floatdiv .menu,
#floatdiv .last {
  margin-bottom: 0px;
}