본문 바로가기
팁 & 테크

블로그 글 상단에 구글 애드센스(광고코드) 설치하기

by 테리™ 2009. 4. 4.
반응형
  자신의 블로그에 구글 애드센스를 설치함에 있어 티스토리의 경우 사이드바 설정 메뉴를 이용하면 이야기가 매우 간단해진다.  단순히 [HTML 배너출력]을 추가하고 편집 메뉴를 통해 스크립트를 복사 및 붙여넣기를 하면 설치 작업은 끝난 것이다. 허나 블로그에 포스트 되는 글 상단이나 하단에 구글 애드센스를 설치하고자 한다면 초보자에게는 다소 어렵게 다가올 수 있을 것이다. 메뉴가 잘 마련되어 있는 티스토리 블로그조차 위 기능을 플러그인으로 제공하고 있지 않기 때문인데, 이는 HTML/CSS 편집을 통해 직접 코드를 집어넣어야 한다.

1. 우선 HTML/CSS 소스 편집창에서 [##^_article_rep_desc_^##]을 찾아보자.(Ctrl + F 로 빠르게 찾을 수 있다.)
 
<div class="article"> 은 <div class="article_post">
     <글 상단에 넣고자 하는 경우>
      [##^_article_rep_desc_^##]   ==>이 부분이 블로그 포스트 위치라고 이해하면 될 것이다.
      <글 하단에 넣고자 하는 경우>
</div>
(※ ^는 글을 올리기 위하여 임의 삽입한 것으로, 실제 태그에는 없는 기호임)
2. 위의 예시와 같이 [##^_article_rep_desc_^##] 블로그 포스트를 중심으로 글 상단 내지 하단에 애드센스(광고코드)를 삽입하면 된다.

3. 애드센스를 원스하드웨어 블로그와 같이 2개를 나란히 배치하고자 한다면, 아래와 같이 코드를 삽입하자.

<table align="center" border="0" cellpadding="0" cellspacting="0">
<tr><td>
애드센스 코드
</td>
<td>
애드센스 코드
</td></tr>
</table>

최종 예

아래는 위의 설명대로 작성한 예로써,
1. 구글 애드센스(컨텐츠 박스형)를 글 상단에 위치시켰으며, 2개의 애드센스를 나란히 배치.
2. 글 하단에는 구글 애드센스(컨텐츠 링크형)을 글 하단에 위치, 단일 배치한 코드이다.

<div class="article">
       <table align="center" border="0" cellpadding="0" cellspacting="0">
       <tr><td>
<script type="text/javascript"><!--
google_ad_client = "pub-□□□□□□□□□□□□□□□□";
/* 336x280, 작성됨 09. 4. 3 */
google_ad_slot = "1385464260";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="
http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>  
     
       </td>
       <td>
<script type="text/javascript"><!--
google_ad_client = "pub-□□□□□□□□□□□□□□";
/* 336x280, 작성됨 09. 4. 3 */
google_ad_slot = "0776423497";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="
http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
       </td></tr>
       </table>
                       <div><br></div>   ==>글 상단의 애드센스와 본문 사이의 간격을 두기 위하여 입력 

        
반응형
  자신의 블로그에 구글 애드센스를 설치함에 있어 티스토리의 경우 사이드바 설정 메뉴를 이용하면 이야기가 매우 간단해진다.  단순히 [HTML 배너출력]을 추가하고 편집 메뉴를 통해 스크립트를 복사 및 붙여넣기를 하면 설치 작업은 끝난 것이다. 허나 블로그에 포스트 되는 글 상단이나 하단에 구글 애드센스를 설치하고자 한다면 초보자에게는 다소 어렵게 다가올 수 있을 것이다. 메뉴가 잘 마련되어 있는 티스토리 블로그조차 위 기능을 플러그인으로 제공하고 있지 않기 때문인데, 이는 HTML/CSS 편집을 통해 직접 코드를 집어넣어야 한다.

1. 우선 HTML/CSS 소스 편집창에서 [##^_article_rep_desc_^##]을 찾아보자.(Ctrl + F 로 빠르게 찾을 수 있다.)
 
<div class="article"> 은 <div class="article_post">
     <글 상단에 넣고자 하는 경우>
      [##^_article_rep_desc_^##]   ==>이 부분이 블로그 포스트 위치라고 이해하면 될 것이다.
      <글 하단에 넣고자 하는 경우>
</div>
(※ ^는 글을 올리기 위하여 임의 삽입한 것으로, 실제 태그에는 없는 기호임)
2. 위의 예시와 같이 [##^_article_rep_desc_^##] 블로그 포스트를 중심으로 글 상단 내지 하단에 애드센스(광고코드)를 삽입하면 된다.

3. 애드센스를 원스하드웨어 블로그와 같이 2개를 나란히 배치하고자 한다면, 아래와 같이 코드를 삽입하자.

<table align="center" border="0" cellpadding="0" cellspacting="0">
<tr><td>
애드센스 코드
</td>
<td>
애드센스 코드
</td></tr>
</table>

최종 예

아래는 위의 설명대로 작성한 예로써,
1. 구글 애드센스(컨텐츠 박스형)를 글 상단에 위치시켰으며, 2개의 애드센스를 나란히 배치.
2. 글 하단에는 구글 애드센스(컨텐츠 링크형)을 글 하단에 위치, 단일 배치한 코드이다.

<div class="article">
       <table align="center" border="0" cellpadding="0" cellspacting="0">
       <tr><td>
<script type="text/javascript"><!--
google_ad_client = "pub-□□□□□□□□□□□□□□□□";
/* 336x280, 작성됨 09. 4. 3 */
google_ad_slot = "1385464260";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="
http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>  
     
       </td>
       <td>
<script type="text/javascript"><!--
google_ad_client = "pub-□□□□□□□□□□□□□□";
/* 336x280, 작성됨 09. 4. 3 */
google_ad_slot = "0776423497";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="
http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
       </td></tr>
       </table>
                       <div><br></div>   ==>글 상단의 애드센스와 본문 사이의 간격을 두기 위하여 입력 

        

<p align="center">
<script type="text/javascript"><!--
google_ad_client = "pub-□□□□□□□□□□□□□□□□";
/* 468x15, 작성됨 09. 4. 3 */
google_ad_slot = "9791129707";
google_ad_width = 468;
google_ad_height = 15;
//-->
</script>
<script type="text/javascript"
src="
http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>    
    
</p>
       </div>

ps. HTML/CSS 편집시에는 항상 무결점 상태에 있는 소스를 전체 복사(Ctrl+A & Ctrl+C)하여 메모장에 백업(Ctrl+V)해두어 만약의 에러 상황에 대비하도록 하자. 또한 코드 수정 후 [미리보기]를 통하여 사전 확인 후 [저장하기]를 실행토록 하자.
 
반응형


<p align="center">
<script type="text/javascript"><!--
google_ad_client = "pub-□□□□□□□□□□□□□□□□";
/* 468x15, 작성됨 09. 4. 3 */
google_ad_slot = "9791129707";
google_ad_width = 468;
google_ad_height = 15;
//-->
</script>
<script type="text/javascript"
src="
http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>    
    
</p>
       </div>

ps. HTML/CSS 편집시에는 항상 무결점 상태에 있는 소스를 전체 복사(Ctrl+A & Ctrl+C)하여 메모장에 백업(Ctrl+V)해두어 만약의 에러 상황에 대비하도록 하자. 또한 코드 수정 후 [미리보기]를 통하여 사전 확인 후 [저장하기]를 실행토록 하자.
 
반응형

댓글