정보/블로그 운영팁

티스토리(TISTORY) 글 중간에 구글 애드센스(Google Adsense) 광고 쉽게 넣기

아미넴 2020. 10. 6.

블로그 글을 보다 보면 글 중간에 광고가 들어가 있는 경우가 있는데

최근에는 구글 애드센스 스크립트가 자동으로 광고를 넣어 주는 것 같기도 하지만

광고가 안 들어가는 경우가 더 많은데 명확한 기준은 알기가 어렵네요.

 

아무튼 저도 넣고 싶어서 방법을 알아 보았습니다.

찾아 본 정보를 바탕으로 좀 더 명확하고 알기 쉽고 편리한 방법으로 정리를 해 보겠습니다.

 

목차

     

    광고 단위 수동 생성

    1. 애드센스 사이트 > 광고 > 개요 클릭

     

    2. 광고 단위 기준 > 콘텐츠 내 자동 삽입 광고 선택

     

    3. 광고 단위 이름 입력 후 '저장 및 코드 생성' 버튼 클릭

     

    4. 생성된 코드 확인

    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <ins class="adsbygoogle"
         style="display:block; text-align:center;"
         data-ad-layout="in-article"
         data-ad-format="fluid"
         data-ad-client="ca-pub-0000000000000000"
         data-ad-slot="0000000000"></ins>
    <script>
        (adsbygoogle = window.adsbygoogle || []).push({});
    </script>

     

     

     

     

    티스토리 블로그 서식 저장

    광고 코드를 따로 관리하면 매우 번거롭기 때문에 간단히 붙여 넣기 위해 서식으로 저장해 놓습니다.

     

    1. 관리 페이지 접속 > 콘텐츠 > 서식 관리 > 서식 쓰기

     

    2. 기본모드 > HTML 선택

     

    3. 제목에 '글 중간 광고' 입력 및 내용에 애드센스 광고 단위에서 생성한 코드 붙여 넣기

    사실 이 정도만 해도 별 문제는 없지만

    태그가 3개이므로 실제 글 중간에 붙여 넣으면 덩어리가 3개가 생깁니다.

    기본모드에서는 나타나지 않지만 스크립트 중간에 ins 태그가 숨겨져 있습니다.

    간혹 글을 수정할 때 사라지기도 해서 지우고 다시 삽입해야 하는 경우도 생깁니다.

     

    따라서 명확하게 입력될 수 있도록 수정하는 것이 더 좋습니다.

    첫번째 스크립트 태그는 구글 광고 신청 시 붙여 넣은 스크립트와 중복되므로 제외했습니다.

    그리고 ins 태그를 script 태그 안에서 document.write 메서드를 이용해서 직접 쓰도록 하여

    에디터 기본모드에서 보이지 않는 불편함을 없앴습니다. 

    <script>
      document.write('<p><ins class="adsbygoogle" style="display:block; text-align:center;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-0000000000000000" data-ad-slot="0000000000"></ins></p>');
      (adsbygoogle = window.adsbygoogle || []).push({});
    </script>

    이렇게 만든 서식을 글에 붙여 넣으면 script 덩어리 하나만 생겨 관리가 깔끔해 집니다.

     

    4. 저장 및 등록된 서식 확인

     

     

     

     

    글 작성 시 광고 서식 삽입

    1. 글쓰기 에디터 > ... > 서식 선택

     

    2. 광고를 넣고 싶은 위치에서 '글 중간 광고' 서식 선택

     

     

    3. 광고 스크립트가 잘 삽입되었는 지 확인

     

     

     

     

    저는 위의 위치에 광고를 넣어 보겠습니다.

     

    4. 글 저장 후 광고가 잘 뜨는 지 확인 (실제 광고와 다를 수 있음)

    원하는 위치에 광고가 잘 뜹니다.

     

    다들 돈 마니 버세요~

    반응형

    댓글22

    💲 추천 글