ABOUT ME

    -

    Today
    -
    Yesterday
    -
    Total
    -
    • 티스토리에 구글 애드센스 추가 방법
      WEB/HTML, CSS 2017. 7. 25. 00:34
      반응형

      구글 애드센스 

      사실 구글 애드센스만한 편한 UI는 보지를 못했다. 다른 광고 모듈이 있다면 추천 부탁드립니다.


      핀코드 발행 방법

      핀코드란 정확히는 모르겠지만, 구글 애드센스의 사용자를 인증하는 방법인 것 같다.

      구글 애드센스는 핀코드가 있어야 내가 만든 광고단위를 사이트 내에 표시할 수 있고, 표시가 되어야 광고수익도 올릴 수 있다.

      내 집주소를 적고, 핀코드를 요청하면 미국의 구글로부터 편지 한 통이 배송된다. 잊고 지내다보면 도착한다. (필자는 약 한 달 소요..) 


      계속 못 받으면 어떡하지?? 라는 걱정 말아라, 3번 동안 핀코드를 요청했는데 못 받으면 애드센스 사이트에서 이메일로 인증받을 수 있는 방법을 권고한다ㅎㅎ 

      핀코드를 받고 인증이 성공하면 내 블로그에 광고를 표시할 기회를 갖는다. 


      광고 단위를 블로그에 삽입

      이제 천천히 내 블로그에 광고 코드를 넣어보자.

      광고단위에서 reactive한 광고를 하나 생성하면 아래와 같이 새로 생성한 광고단위 id가 포함된 자바스크립트 코드를 부여한다. 

      애드센스에서는 이 자바스크립트 코드를 <body></body> 안에 추가하도록 권고한다.

      https://www.google.com/adsense/new/u/0/pub-9255899982797908/home

      <html>
<head>
페이지 헤드입니다.
<title>HTML 페이지 예</title>
</head>
<body>
페이지 본문입니다.
<div align="center">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Homepage Leaderboard -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</body>
</html>


      티스토리에 추가하고 싶다면, 아래와 같이 추가하면 항상 본문 위에 표시되게 된다.

      <div class="area_view">
<div align="center">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-format="fluid"
     data-ad-layout="in-article"
     data-ad-client="ca-pub-9255899982797908"
     data-ad-slot="6904133949"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<p> // 한 줄 공백 추가 






                    
        
      
  
      
    
      반응형
      
    
    
    
  
      

      
        

            
      구글 애드센스 
      사실 구글 애드센스만한 편한 UI는 보지를 못했다. 다른 광고 모듈이 있다면 추천 부탁드립니다.

      핀코드 발행 방법
      핀코드란 정확히는 모르겠지만, 구글 애드센스의 사용자를 인증하는 방법인 것 같다.
      구글 애드센스는 핀코드가 있어야 내가 만든 광고단위를 사이트 내에 표시할 수 있고, 표시가 되어야 광고수익도 올릴 수 있다.
      내 집주소를 적고, 핀코드를 요청하면 미국의 구글로부터 편지 한 통이 배송된다. 잊고 지내다보면 도착한다. (필자는 약 한 달 소요..) 

      계속 못 받으면 어떡하지?? 라는 걱정 말아라, 3번 동안 핀코드를 요청했는데 못 받으면 애드센스 사이트에서 이메일로 인증받을 수 있는 방법을 권고한다ㅎㅎ 
      핀코드를 받고 인증이 성공하면 내 블로그에 광고를 표시할 기회를 갖는다. 

      광고 단위를 블로그에 삽입
      이제 천천히 내 블로그에 광고 코드를 넣어보자.
      광고단위에서 reactive한 광고를 하나 생성하면 아래와 같이 새로 생성한 광고단위 id가 포함된 자바스크립트 코드를 부여한다. 
      애드센스에서는 이 자바스크립트 코드를 <body></body> 안에 추가하도록 권고한다.
      https://www.google.com/adsense/new/u/0/pub-9255899982797908/home
      

      <html>
<head>
페이지 헤드입니다.
<title>HTML 페이지 예</title>
</head>
<body>
페이지 본문입니다.
<div align="center">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Homepage Leaderboard -->
<ins class="adsbygoogle"
style="display:inline-block;width:728px;height:90px"
data-ad-client="ca-pub-1234567890123456"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
</body>
</html>
      


      티스토리에 추가하고 싶다면, 아래와 같이 추가하면 항상 본문 위에 표시되게 된다.
      

      <div class="area_view">
<div align="center">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-format="fluid"
     data-ad-layout="in-article"
     data-ad-client="ca-pub-9255899982797908"
     data-ad-slot="6904133949"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<p> // 한 줄 공백 추가 
 // 포스트 본문이 표시되는 부분 


      공감버튼 
      http://notice.tistory.com/2169

      공감버튼은 로그인하지 않고 받을 수 있는 "좋아요" 같은 것이다.
      공감버튼은 글 작성 시에 주제를 선택하면 자동으로 생기는 시스템이다. 


      
                    
        
      
  
      
    
      반응형
      
    
    
    
  
      

      
        

 // 포스트 본문이 표시되는 부분



      공감버튼 

      http://notice.tistory.com/2169


      공감버튼은 로그인하지 않고 받을 수 있는 "좋아요" 같은 것이다.

      공감버튼은 글 작성 시에 주제를 선택하면 자동으로 생기는 시스템이다. 



      반응형

      'WEB > HTML, CSS' 카테고리의 다른 글

      블로그의 코드미러 Highlight.js  (0) 2014.06.13

      관련글 관련글 더보기

    Designed by Tistory.

    티스토리툴바