블로그 운영하기 / / 2023. 6. 9. 10:46

애드센스 상단 광고 두개 넣기 - 티스토리

반응형

 

홈 리스트 상단 광고 두개 넣는 법
홈 리스트 상단 광고 두개 넣는 법

 

 

 

더많은 게시글을 보시려면, https://moomul.com/으로 오셔서 열람하시기 바랍니다.

 

애드센스 상단 광고 두 개 넣기 - 티스토리

 
애드센스 광고를 어떻게 활용해야 좋을까 많이들 생각하실 겁니다. 게시글 내에 광고 두 개도 좋지만 홈에 두 개를 넣는 것도 좋은 방법입니다. 홈 같은 경우는 거의 대부분 들어는 오지 않지만 트래픽이 발생했을 때 수익의 공백이 생깁니다. 그래서 이번에는 홈 화면 상단 광고를 두 개 넣는 방법에 대해서 알아보도록 하겠습니다.

기존 제 블로그는 게시글 내 두개만 적용했었습니다. 그러다가 이번에 홈화면에 빈 것을 확인하고 아 여기도 넣으면 좋을 것 같다는 생각에 실행에 옮기게 되었습니다. 
 

블로그 광고방에 지쳐 만든 블로그 정보 공유방
https://open.kakao.com/o/g3Rudmwf

 

블로그 광고방에 지쳐 만든 워드프레스 정보 공유방

 

open.kakao.com

 

애드센스 메인 리스트 상단 광고코드

 
우선 먼저 하단에 있는 코드를 복사하여 메모장에 적어둡니다.

<div style="text-align: center; margin-bottom: 15px; justify-content:space-between">
    <style>
    .adsbygoogle.list-top-first {display:block}
    .adsbygoogle.list-top-second {display:none}

    @media (min-width: 168px) {
    .adsbygoogle.list-top-first {display:inline-block;min-width:168px;max-width:500px;width:100%;height:280px;}
    .adsbygoogle.list-top-second {display:inline-block;margin-left:20px;min-width:500px;max-width:336px;width:100%;height:280px;}
    }
    </style>
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
    <!-- 1번째 광고 -->
    <ins class="adsbygoogle list-top-first"
        data-ad-client="ca-pub-pub번호"
        data-ad-slot="광고를 만들었을 때 슬롯 번호"
        data-ad-format="rectangle"
        data-full-width-responsive="true"></ins>
    <script>
        (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
    <!-- 2번째 광고 -->
	<ins class="adsbygoogle list-top-second"
        data-ad-client="ca-pub-자신의pub번호"
        data-ad-slot="광고를 만들었을 때 슬롯 번호"
        data-ad-format="rectangle"
        data-full-width-responsive="true"></ins>
    <script>
        (adsbygoogle = window.adsbygoogle || []).push({});
    </script>
</div>

위의 코드가 복사가 되지 않을 경우 아래의 첨부파일은 다운로드 받으세요. 위와 같이 코드를 복사 후  data-ad-client="ca-pub-자신의pub번호" 와 data-ad-slot="광고를 만들었을 때 슬롯 번호"를 자신이 만든 광고 코드를 바꿔줍니다.

메인 홈 리스트 상단 두개.txt
0.00MB

애드센스 상단 광고 코드 적용 하기

 
위의 코드가 다 작성이 되었다면, 다음 경로로 이동하세요. ( 설정 > 스킨편집 > HTML 편집 )
HTML편집으로 이동하셨다면, HTML 에디터를 클릭하고 Ctrl + F를 누른 후에  를 검색합니다.

검색해서 찾으셨다면, 바로 위에 복사하여 수정한 코드를 그대로 가져다가 붙여버립니다.
 

홈 메인 리스트 상단 광고 - 코드삽입부
홈 메인 리스트 상단 광고 - 코드삽입부

 
그러면 아래와 같이 적용되신 모습을 볼 수 있습니다. 적용되는데 시간이 걸린다고 하지만 광고가 들어갈 위치의 공간이 확보가 안되었다면 다시 소스를 한번 봐야 할 수도 있습니다.
 

상단 광고 두개 적용 모습
상단 광고 두개 적용 모습

반응형
  • 네이버 블로그 공유
  • 네이버 밴드 공유
  • 페이스북 공유
  • 카카오스토리 공유