안녕하세요. 고래의 개인 노트입니다. 이전 게시글에서는 인피드 광고 맞춤 설정 방법에 대해서 알아보았습니다. 이 글에서는 맞춤 설정한 코드를 가지고 고래 스킨에 적용시켜보도록 하겠습니다. 

 

1. 스크립트 기본 설정

        var inFeed = 0;
        var inFeedAdSenseShow = 0;
        var inFeedAdSenseInsert = 3;
        var inFeedAdSense = '<ins> ~ ~ </ins>';

위 소스 코드를 복사 후 메모장에 붙여 넣으시고, 발급 받은 인피드 광고의 <ins class ~ </in> 코드를 inFeedAdSense 변수의 따옴표 안에 넣습니다.  복사가 되지 않는다면 아래 다운로드 파일을 참조하세요.

 

 

애드센스 인피드 광고 스크립트.txt
0.00MB

 

 

2. 인피드 광고 스타일 설정

인피드 광고는 콘텐츠 사이, 피드 시작 부분 끝 부분에 삽입하는 광고입니다. 광고를 삽입할 컨테이너의 높이는 가변적이어야 하며, 간혹 스킨 사이즈에서 벗어날 수 있는 광고가 표시될 수 있기 때문에 노란색 영역 스타일 속성을 통해 조금씩 조정해주어야 합니다. 

 

display:block; min-width:360px; max-width:855px; margin-left:-15px; margin-top:10px; 

스타일 속성의 따옴표 안에 위 코드를 입력합니다. 최소 광고 크기는 360px, 최대 광고 크기는 855px 등을 설정하는 코드입니다. 

 

 

올바르게 입력하셨으면 위 이미지처럼 소스코드가 완성되어 있을 것입니다. 인피드 광고를 보여주기 위해서는 이 코드를 티스토리 스킨 편집창에 넣어야 합니다. 

 

 

3. 티스토리 스킨 편집창 진입 후 스크립트 설정 

블로그 관리 > 스킨 편집 > 우측 상단에 위치한 HTML 편집을 클릭하여 HTML 코드를 입력하는 창으로 진입합니다. 여기서부터 대충 읽고 따라 하시면 안 되니 잘 따라와 주시기 바랍니다. 

 

위 이미지의 화살표 부분을 주목합니다. </script> 와 </head>가 있습니다. 이 태그는 스크립트 영역이 끝났다, 헤더 영역이 끝났다는 의미를 가지고 있습니다. 따라서, 우리가 위에서 만든 스크립트는 </head> 태그 안쪽에, <script></script> 태그 안에 넣으셔야 합니다. 

 

 

옵션설명

 

  • inFeedAdSenseShow = 0; => 사용 여부 0 : 적용 , 1 : 미적용
  • inFeedAdSenseInsert = 3; => 목록 몇 개마다 광고를 표시할 것인지

 

 

4. 메인 리스트에 인피드 광고 스크립트 추가 

 

메인 리스트에 인피드 광고 스크립트를 넣어야 하기 때문에 이 작업을 필수로 해야 합니다. 편집 창에서 Ctrl + F를 눌러 s_article_rep 을 검색합니다. 

 

그 밑으로 s_index_article_rep 태그가 오는 코드를 찾으셔야 합니다. 찾으셨으면 닫히는 태그인 1번 태그 안에 스크립트를 넣어야 합니다. 

 

 

닫힌 태그 위쪽에 아래 소스 코드를 넣어주시면 됩니다.

 

<script>
if (inFeedAdSenseShow == 0) {
	inFeed++;
	if (inFeed == 1 || inFeed % inFeedAdSenseInsert == 0) {
		document.write(inFeedAdSense);
		(adsbygoogle = window.adsbygoogle || []).push({});
	}
}
</script>

 

애드센스 인피드 광고 스크립트 #2.txt
0.00MB

 

애드센스 인피드 광고가 헤더 영역에 설정한 Insert 값에 따라 출력됩니다. 저는 3으로 설정했기 때문에 게시글이 3개 나오고 광고가 출력되고 있습니다. 코드에서는, 첫번째 게시글 이후 무조건 인피드 광고 하나를 넣는 값 inFeed == 1 포함되어 있는데 제외하실 분들은 inFeed == 1 || << 이 코드를 삭제하시면 됩니다.

 

참고로, 사이트 내에서 광고가 많을수록 웹 페이지 속도는 느려지고 이는 구글 검색 엔진 순위에 영향을 미칩니다. 따라서 과도한 광고는 좋지 않기 때문에 이점 잘 생각하셔서 적당히 설정하시길 바랍니다. 

 

 

 

애드센스 관련 필요한 정보나 작성해주었으면 하는 게시글이 있으면 하단의 댓글폼을 통해 알려주세요. 다음 게시글을 작성할 때 많은 도움이 됩니다.

 

  • 네이버 블러그 공유하기
  • 네이버 밴드에 공유하기
  • 페이스북 공유하기
  • 카카오스토리 공유하기

댓글을 달아 주세요

">
  1. thumbnail
    바밸 : 균형-건강을 위한 시작
    2020.06.02 01:12

    관리자의 승인을 기다리고 있는 댓글입니다

  2. thumbnail
    바밸 : 균형-건강을 위한 시작

    고래님, 제가 고래님 스킨을 적용했는데, 카테고리에 있는 사진이 계속 작게 나와요. 이거 어떻게 해결하나요?

  3. thumbnail
    2020.06.04 18:55

    비밀댓글입니다

  4. thumbnail
    친절한 한이사

    4.0 도 인피드 적용 방법은 동일한가요?

  5. thumbnail
    2020.07.10 16:23

    비밀댓글입니다

  6. thumbnail
    2020.07.11 02:53

    비밀댓글입니다

  7. thumbnail
    2020.07.19 01:42

    비밀댓글입니다

  8. thumbnail
    리뷰 스토리
    2020.09.09 13:12

    관리자의 승인을 기다리고 있는 댓글입니다

  9. thumbnail
    2020.09.12 23:50

    비밀댓글입니다