다음 애드핏(adfit)으로 블로그 수익창출하기 2탄

블로그에 애드핏광고로 최대수익을 내는 위치 및 방법

지난 시간에는 "다음 애드핏" 으로 수익을 창출할 수 있는 배너를 생성하는 방법과

실제 생성된 광고를 모바일에 게재하는 방법을 배웠는데요,

오늘은 배너를 pc상에 보여지도록,

즉, 데스크탑pc 화면에 보여질 수 있도록 게재하는 방법을 가르쳐 드릴게요.

이전 시간에 배웠던 다음(Daum) 애드핏(adfit)가입과 광고생성방법 및 모바일에

배너달기편 이 궁금하신분들은 아래 링크를 참조해주세요.

관련포스팅 : 다음 애드핏(adfit)으로 블로그 수익창출하기 1탄

1탄에서는 다음 애드핏의 장점과 단점을 간단히 설명해 드렸는데요, 또 하나의 장점은 다음 애드핏(adfit)은 우리나라의 3위

(2위였지만 구글에게 밀려났음 ㅠ) 포털사이트인 다음에서 운영하다보니 광고주가 상당히 많습니다.

고로, 광고가 끊길 일이 없고 기타 배너사이트처럼 먹튀의 위험도 없습니다.

최근에는 카카오와 합병까지 하여 점점 더 영역을 넓히는 추세입니다.

하지만 모바일에서 전면광고가 중단이 되다보니 수익성이 떨어지는 부분이 생겼는데요,

수익성을 높이기위해서 데스크탑상에도 광고를 달아볼겁니다.

상단, 상단고정, 하단, 하단고정, 본문중간 위치에 배너를 달아볼건데 pc상에서 볼때도 전면형광고를 띄울 수는 있으나

티스토리규제상 자신의콘텐츠(포스팅)를 가리는 광고를 게재할 수가 없기 때문에 pc상에서도 전면형광고는 불가합니다.

우선 상단에 광고를 배치시키는 방법입니다.

다음 애드핏(adfit)으로 접속해서 띠배너 50 광고단위를 만들고 스크립트발급을 누릅니다.

발급된 자신의 스크립트를 복사해주세요.

client 부분만 빼고 아래스크립트와 동일할겁니다. client 는 자신의 다음애드핏 아이디라고 생각하시면됩니다.

여기서 position 부분은 'TOP'으로 되어있을건데 지금은 상단에 광고를 달거니 그대로 두시면됩니다.

<script type="text/javascript">

var daum_adam_vars = {

client : 'DAN-u7u2rdu2lbhe',

position : 'TOP' // TOP (화면상단) | BOTTOM (화면 하단) | MIDDLE (화면 중간 삽입. bannerDivId 지정 필요)

// bannerDivId : 'MobileadAreaDiv' // position : 'MIDDLE' 인 경우, 광고를 삽입할 DIV 태그의 ID 값.

};

</script>

<script type="text/javascript" src="http://m1.daumcdn.net/adtc/js/mobilead.js"></script>

본인블로그 HTML/CSS 편집으로 들어와 HTML수정에서 아래사진과 같이 맨하단 </body> 바로위에 붙여넣어주세요.

자 확인을 해볼까요?

<광고를 붙여넣기 전 사진>

<광고를 붙여넣은 후 사진>

보시다시피 상단에 광고가 생겼습니다.

누군가 저 광고를 클릭하면 저는 캐쉬가 적립되는거죠. ☜+_+☞

다음은 상단에 있는 광고를 고정시켜보도록 하겠습니다.

스크롤바를 내려도 광고도 같이 내려오는 효과가 있어 사용자에게 계속 노출이되죠.

아래에 있는 스크립트는 상단고정스크립트이니 복사해주세요. 제 블로그는 복사가 안되니 첨부파일로 소스올리겠습니다.

상하단 고정코드.txt

div[data-adam-elem="container"] {

position: fixed;

top: 0;

}

body {padding-top:50px}

위 스크립트를 CSS 편집에서 맨 하단에 붙여넣으시면 됩니다.

이제 하단에 광고를 달아보도록 하겠습니다.

아까 가져온 광고스크립트에서 position 을 아래처럼 'BOTTOM' 으로 수정을 합니다.

<script type="text/javascript">

var daum_adam_vars = {

client : 'DAN-u7u2rdu2lbhe',

position : 'BOTTOM' // TOP (화면상단) | BOTTOM (화면 하단) | MIDDLE (화면 중간 삽입. bannerDivId 지정 필요)

// bannerDivId : 'MobileadAreaDiv' // position : 'MIDDLE' 인 경우, 광고를 삽입할 DIV 태그의 ID 값.

};

</script>

<script type="text/javascript" src="http://m1.daumcdn.net/adtc/js/mobilead.js"></script>

수정한 스크립트를 똑같이 HTML 편집에서 </body> 윗부분에 붙여넣습니다.

아래사진처럼 블로그하단에 배너가 달렸습니다.

하단고정광고도 상단고정광고와 똑같습니다. top 이라고 적힌 부분을 bottom 으로 변경해주시면 됩니다.

위 첨부파일에 상단고정 하단고정 스크립트 다 적어놨습니다.

div[data-adam-elem="container"] {

position: fixed;

bottom: 0;

}

body {padding-bottom:50px}

하단고정스크립트를 CSS 편집에서 맨 아래에 붙여놓으면 하단고정광고도 끝~

TEST 목적으로라도 클릭하면 안되는거 아시죠?

그리고 광고에 마우스를 갖다댔는데 URL 이 설정이 안되있을 수 있다면 HTML에 붙였던 스크립트를 지우고 다시 붙여보시면

마우스가 손가락모양으로 변하면서 URL 설정이 되있을겁니다.

상단고정보다는 하단고정광고가 클릭율이 더 높을 겁니다. 하지만 상단이나 하단고정광고는 광고가 따라 붙어다니니 내 포스팅을

읽으러 온 분들한테는 상당히 거슬릴 수가 있습니다. 여러분들이 적절히 판단하세요.

저는 미관상의 이유로 고정이 아니라 상단에 그냥 달아놨습니다.

그리고 상단이나 하단고정광고는 다음 애드핏 규정에 어긋나지 않음으로 배너를 달아도 상관없으나 다음애드핏 규정이

바뀔수도 있으니 한번쯤 다음애드핏에 문의하시는게 좋겠죠 ^^;;?

휴,,,힘들다;;;;;;;;;;;;;

마지막으로 본문 중간에 광고를 달아보도록 하겠습니다. 상단, 하단과 달리 중간광고는 띠배너 100만 허용하고 있습니다.

다음 adfit 에서 띠배너 100을 만들어 봅시다.

스크립트 발급을눌러 스크립트 생성후 복사합니다.

<!-- 광고를 보여줄 영역 -->

<div id="MobileadAreaDiv"></div>

<script type="text/javascript"

src="http://m1.daumcdn.net/adtc/js/mobilead.js"></script>

<!-- 광고 스크립트 환경 설정 -->

<script type="text/javascript">

    new AdamLargeMobileBanner({

        client: 'DAN-qdvhlcj5fk1c',

        bannerDivId: 'MobileadAreaDiv'

    }).init();

</script>

상하단 광고와는 스크립트가 조금 다르죠? 중간노출을 위해서는 광고를 보여줄곳에 div영역을 필수로 지정을 해야합니다.

div태그는 경계를 분할 또는 영역을 나누는 기능을 가지고 있어 광고를 보여줄영역에 배너를 집어넣는겁니다.

HTML편집으로 들어가서 아까와 같이 </body>바로위에 발급받은 스크립트를  붙여넣기하는데 아래사진과 같이,

<!-- 광고를 보여줄 영역 -->

<div id="MobileadAreaDiv"></div>    <---------- 이부분은 뺀 아랫부분만 붙여넣습니다.

<실제적으로 HTML편집에 붙여넣을 부분>

<script type="text/javascript"

src="http://m1.daumcdn.net/adtc/js/mobilead.js"></script>

<!-- 광고 스크립트 환경 설정 -->

<script type="text/javascript">

    new AdamLargeMobileBanner({

        client: 'DAN-qdvhlcj5fk1c',

        bannerDivId: 'MobileadAreaDiv'

    }).init();

</script>

그리고 본인이 작성한 또는 작성할 포스팅으로 가서 HTML을 체크합니다.

그리고 본인이 원하는 위치에 아래 스크립트를 붙여놓고 저장하면 끝~

<!-- 광고를 보여줄 영역 -->

<div id="MobileadAreaDiv"></div>

<!-- 광고를 보여줄 영역 -->  이부분은 주석(설명)부분이라 빼셔도 상관없어요.

실제적으로 <div id="MobileadAreaDiv"></div> 이 태그만 본인이 원하는 위치에 붙여주시면 됩니다.

자 내가 원하는 위치에 배너가 잘 삽입이 되었는지 확인해 볼까요?

좋습니다~ 아주 좋아요~ 제가 원하는 위치에 깔끔하게 삽입이 되었네요.

아무래도 상단 하단 보다는 포스트 본문에 광고를 배치하는게 클릭율이 더 높다고 봅니다.

하지만 일일이 포스팅 할때마다 삽입해야하는 번거로움이 있는게 단점이긴 합니다.

모쪼록 여러분께서 원하는 위치에 광고를 잘 배치하셔서 대박나기를 기원하구요!

★중요★

아아아...그리고 추가로 알아낸 사실인데 포스팅 중간에 <div id="MobileadAreaDiv"></div> 태그를 삽입하고 저장을 누르면

광고가 뜨는데 클릭했을때 URL이 걸려있지 않아 광고페이지로 안넘어갑니다.

앞으로도 <div id="MobileadAreaDiv"></div> 태그를 넣고 포스팅을 저장했을땐 HTML로 가서 기존의 다음애드핏 스크립트를 지우고

다시 붙여주면 클릭했을때도 광고페이지로 넘어가 캐시가 쌓입니다.

그냥 새로고침? 의 개념이라고 생각하시면 될듯!! 매우 중요한 TIP이니 잘 새겨들으시길....

★추가수정★

실험결과 HTML로 가서 기존의 스크립트를 지울필요가 없음.

일정시간이 지나면(약 5분정도) 자동으로 광고가 송출이되면서 URL이 걸리게됨

이로써 다음 애드핏(adfit) 으로 블로그 수익창출하는 방법을 배웠습니다. 사실 이렇게 길게 포스팅하지 않아도 충분히 유입률을

많이 들어오게 할 수 있지만, 정말 초보자분들은 이렇게 세세하게 설명해주지 않으면, 중간에 딱 막혀버립니다.

매우 답답하고 절망스럽죠...제가 그랬거든요.....자세하게 설명해놓지 않은 포스팅보면 열도받고...

그리고 중요한건 제가 까먹지 않게 하기위해서라도 포스팅을 매우 자세하게 써야합니다...

기억엔 한계가있기에 나중에 저도 제 포스팅보고 다시 해야 될 날이 올수도....아무튼 너무 힘드네요...지금 새벽 6시 1분... 

댓글 공감 추천 눌러주시고 중간에 막히거나 궁금한점은 댓글로....이제 잠 좀 자야겠습니다.......휴~~~~ 

<번외>

악...죄송합니다. 한가지 안 알려드린게 있었네요. 전면형 광고 블로그에 달지는 못하나 스크립트는 가르쳐드리기로 했는데!!!

전면형 광고는 매 페이지마다 뜨는 것은 아니고, 일정시간 내에는 한번만 나타나게 되므로 사용자의 미관을 크게 해치는 것은 아닙니다.

반면에 띠배너 광고보다 클릭률이 매우 높은 장점이 있습니다.

그렇지만, 전면형광고가 사용자경험을 전혀 해치지 않는 것은 아니므로 전면광고가 나타나는 비율을 조금 줄이는 방법을 알아보겠습니다.

전면형광고가 나타날때는 띠배너광고가 나타나지않고, (예: 30%)

전면형 광고가 나타나지 않을 때에는 띠배너 광고가 나타나게 됩니다. (예: 70%)

<준비물>

다음 Ad@m 전면형 광고 코드, 띠배너 광고 코드

광고 코드는  - 티스토리에 다음 광고 "Adam(아담)" 적용하기 를 참고하여 얻으면 됩니다.

설명은 띠배너지만, 전면형도 마찬가지로 생성하시면 됩니다.

<적용 방법>

다음 코드를 skin.html의 </body> 윗줄에 붙여넣습니다.

빨간색부분만 자신의 코드에서 광고유형에 맞는 client 번호를 넣으시면 됩니다.

파란색 0.3은 전면형 광고가 나타날 확률입니다. 10%확률을 원하시면 0.1, 50%확률은 0.5로 수정하시면 됩니다.

<script>

DaumAd= Math.random();

  if (DaumAd < 0.3) {

  document.write("<script>var daum_adam_fullad_vars = \{client : '###############',test : false\};<\/script>")  //전면형 광고코드

  } else {

  document.write("<script>var daum_adam_vars = \{client : '###############',position : 'BOTTOM',test : false\};<\/script>") //띠배너 광고코드(하단 고정형)

  }

</script>

<script src='http://m1.daumcdn.net/adtc/js/mobilead.js'></script>

▶ 추천포스팅 : 다음 애드핏(adfit)으로 블로그 수익창출하기 1탄
▶ 추천포스팅 : 모텔대출로 월4천만원 수익만들기
▶ 추천포스팅 : 애드센스 부정클릭을 방지하는 방법
▶ 추천포스팅 : 중국하이난 여행 - 로맨스파크 송성가무쇼 후기
▶ 추천포스팅 : 경락잔금대출이 가능한 은행권