티스토리 모바일에 광고 넣기... javascript 이용

어쩌다보니...

간단한 내용이 길어졌습니다.

대략적인 내용은 앞에서 설명했고 오늘은 제가 사용하고 있는 자바스크립트 내용만 적겠습니다.

2013/06/05 - [블로그] - 티스토리 모바일에 광고 넣기... 서식활용

2013/06/04 - [블로그] - 티스토리 모바일에 광고 넣기

AdsenseTop.js

(function() {
  document.getElementById('google-ad-top').style.border = 'none';  // 글쓰기에서 표시했던 border를 제거합니다.
  var currentM = location.href.split("/")[3];
  if ( currentM === 'm' ) {
    document.writeln('<div style="margin: 0 auto; padding-right: 8px; width: 300px; height: 250px;">');
    document.writeln('<sc' + 'ript type="text/javascript">');
    document.writeln('<!--');
    document.writeln('google_ad_client = "[클라이언트 코드]";');
    document.writeln('/* [광고 이름] */');
    document.writeln('google_ad_slot = "[광고 슬롯]";');
    document.writeln('google_ad_width = [광고 넓이];');
    document.writeln('google_ad_height = [광고 높이];');
    document.writeln('//-->');
    document.writeln('</s' + 'cript>');
    document.writeln('<sc' + 'ript type="text/javascript" src="//pagead2.googlesyndication.com/pagead/show_ads.js"></s' + 'cript>');
    document.writeln('</div>');
  } else {
    document.writeln('<table border="0" style="width: 100%;"><tr><td style="width: 50%; min-width:336px; min-height: 280px; background-color: #fff; padding: 0;">');
    document.writeln('<sc' + 'ript type="text/javascript">');
    document.writeln('<!--');
    document.writeln('google_ad_client = "[클라이언트 코드]";');
    document.writeln('/* [광고 이름] */');
    document.writeln('google_ad_slot = "[광고 슬롯]";');
    document.writeln('google_ad_width = [광고 넓이];');
    document.writeln('google_ad_height = [광고 높이];');
    document.writeln('//-->');
    document.writeln('</s' + 'cript>');
    document.writeln('<sc' + 'ript type="text/javascript" src="//pagead2.googlesyndication.com/pagead/show_ads.js"></s' + 'cript>');
    document.writeln('</td>');
    document.writeln('<td style="width: 50%; min-width:336px; min-height: 280px; background-color: #fff; padding: 0;">');
    document.writeln('<sc' + 'ript type="text/javascript">');
    document.writeln('<!--');
    document.writeln('google_ad_client = "[클라이언트 코드]";');
    document.writeln('/* [광고 이름] */');
    document.writeln('google_ad_slot = "[광고 슬롯]";');
    document.writeln('google_ad_width = [광고 넓이];');
    document.writeln('google_ad_height = [광고 높이];');
    document.writeln('//-->');
    document.writeln('</s' + 'cript>');
    document.writeln('<sc' + 'ript type="text/javascript" src="//pagead2.googlesyndication.com/pagead/show_ads.js"></s' + 'cript>');
    document.writeln('</td></tr></table>');
  }
})();

AdsenseMiddle.js

(function() {
  var currentM = location.href.split("/")[3];
  if ( currentM === 'm' ) {
    document.getElementById('google-ad-middle').style.border = 'none';  // 글쓰기에서 표시했던 border를 제거합니다.
    document.writeln('<div style="margin: 10px auto; padding-right: 8px; width: 320px; height: 50px;">');
    document.writeln('<sc' + 'ript type="text/javascript">');
    document.writeln('<!--');
    document.writeln('google_ad_client = "[클라이언트 코드]";');
    document.writeln('/* [광고 이름] */');
    document.writeln('google_ad_slot = "[광고 슬롯]";');
    document.writeln('google_ad_width = [광고 넓이];');
    document.writeln('google_ad_height = [광고 높이];');
    document.writeln('//-->');
    document.writeln('</s' + 'cript>');
    document.writeln('<sc' + 'ript type="text/javascript" src="//pagead2.googlesyndication.com/pagead/show_ads.js"></s' + 'cript>');
    document.writeln('</div>');
  } else {
    document.getElementById('google-ad-middle').style.display = 'none';  // PC 버전에서 중간 광고는 감춘다.
  }
})();

AdsenseBottom.js

(function() {
  document.getElementById('google-ad-bottom').style.border = 'none';  // 글쓰기에서 표시했던 border를 제거합니다.
  var currentM = location.href.split("/")[3];
  if ( currentM === 'm' ) {
    document.writeln('<div style="margin: 0 auto; padding-right: 8px; width: 300px; height: 250px;">');
    document.writeln('<sc' + 'ript type="text/javascript">');
    document.writeln('<!--');
    document.writeln('google_ad_client = "[클라이언트 코드]";');
    document.writeln('/* [광고 이름] */');
    document.writeln('google_ad_slot = "[광고 슬롯]";');
    document.writeln('google_ad_width = [광고 넓이];');
    document.writeln('google_ad_height = [광고 높이];');
    document.writeln('//-->');
    document.writeln('</s' + 'cript>');
    document.writeln('<sc' + 'ript type="text/javascript" src="//pagead2.googlesyndication.com/pagead/show_ads.js"></s' + 'cript>');
    document.writeln('</div>');
  } else {
    document.writeln('<div style="margin: 0 auto; width: 468px; height: 60px;">');
    document.writeln('<sc' + 'ript type="text/javascript">');
    document.writeln('<!--');
    document.writeln('google_ad_client = "[클라이언트 코드]";');
    document.writeln('/* [광고 이름] */');
    document.writeln('google_ad_slot = "[광고 슬롯]";');
    document.writeln('google_ad_width = [광고 넓이];');
    document.writeln('google_ad_height = [광고 높이];');
    document.writeln('//-->');
    document.writeln('</s' + 'cript>');
    document.writeln('<sc' + 'ript type="text/javascript" src="//pagead2.googlesyndication.com/pagead/show_ads.js"></s' + 'cript>');
    document.writeln('</div>');
  }
})();

그나저나...

모바일쪽 상단에 300 * 250 광고를 넣었는데...

너무 커서 무효클릭이 많이 발생하지 않을까 생각된다.

아직 시작한지 얼마되지 않아 광고 수익도 없고...

일단은 그냥 지켜보려 한다.

---

소스 좀 이쁘게 보이려고...

http://alexgorbatchev.com/SyntaxHighlighter/ 사용해 봤는데...

뭐가 문제인지... 적용이 안된다.

자세히 봐야 할 것 같은데...

---

20130725

지금은 위에서 소개한 내용을 바탕으로

서식과 관련 자바스크립트 파일을 자동으로 생성하는 프로그램을 만들어 이용하고 있다.

2013/07/14 - [블로그] - 티스토리에 삽입할 애드센스 코드와 서식 생성하기

2013/07/23 - [블로그] - 티스토리 서식과 애드센스 코드 생성 - 사용법(1/2)

2013/07/23 - [블로그] - 티스토리 서식과 애드센스 코드 생성 - 사용법(2/2)

2013/07/20 - [블로그] - 애드센스 광고 시험 - PC 상단 좌측 1개, 중간 우측 1개, 하단 중앙 1개 / 모바일은 상,중,하

2013/07/23 - [블로그] - 애드센스 광고 시험 - PC 상단 2개, 하단 중앙 1개 / 모바일은 상,중,하