인피드 광고의 높이 설정

인피드 광고의 높이는 정해진 공간에 광고가 딱 맞게 들어가도록 애드센스 시스템이 자동으로 조절합니다. 자동 크기 조절을 통해 대부분의 게시자가 인피드 광고의 높이를 변경하지 않아도 됩니다. 단, 인피드 광고의 높이에 적용하려는 특별한 요건이 있으면 인피드 광고 코드를 수정하여 원하는 높이를 설정할 수 있습니다. 피드가 표시되는 사이트가 반응형인지 비반응형인지에 따라 고정 높이 또는 변수 높이를 설정할 수 있습니다.

이 도움말에 나온 예는 애드센스 광고 코드에서 허용되는 변경사항이므로 안심하셔도 됩니다. 인피드 광고 코드를 아래와 같이 허용되는 방식으로 수정하는 것은 애드센스 프로그램 정책에 위배되지 않습니다.

고정 높이를 설정하는 방법(비반응형 사이트)

광고 코드에 height 속성(예: height:120px)을 추가하면 인피드 광고의 고정 높이를 지정할 수 있습니다. 인피드 광고 단위가 고정 컨테이너에 있는 경우(즉, 반응형이 아닌 경우) 이 옵션을 사용하세요.

설정할 높이를 모르는 경우 브라우저의 개발자 도구를 사용하면 공백 없이 정확한 광고 높이를 정할 수 있습니다. 자세히 알아보려면 피드의 이미지 크기를 정하는 방법을 참조하세요.

다음 광고 코드는 고정 높이가 120픽셀인 인피드 광고를 보여주는 예입니다.

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-12345" crossorigin="anonymous"></script>
<ins class="adsbygoogle"
     style="display:block;height:120px"
     data-ad-format="fluid"
     data-ad-layout="image-top"
     data-ad-layout-key="xxxxxxxx"
     data-ad-client="ca-pub-12345"
     data-ad-slot="123456"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

변수 높이를 설정하는 방법(반응형 사이트)

인피드 광고 단위의 폭이 화면 폭에 따라 달라지는 경우(즉, 반응형인 경우) 광고 코드에 CSS 미디어 쿼리를 사용하여 화면 폭당 높이를 다르게 지정해야 합니다.

다음은 설정할 높이를 정하는 방법입니다.

1. 사이트의 크기를 다양한 화면 폭(예: 350픽셀, 500픽셀, 1,000픽셀)으로 조절합니다.
2. 브라우저의 개발자 도구를 사용하여 각 폭에 공백 없이 정확한 광고 높이를 정합니다. 자세히 알아보려면 피드의 이미지 크기를 정하는 방법을 참조하세요.

다음 광고 코드는 화면 폭이 350픽셀 이상에 높이가 180픽셀, 화면 폭이 500~800픽셀에 높이가 130픽셀, 화면 폭이 800픽셀 이상에 높이가 200픽셀인 인피드 광고의 예입니다.

<style>
  @media (min-width: 350px) {
    .infeed {
      height: 180px;
    }
 @media (min-width: 500px) {
    .infeed {
      height: 130px;
    }
  }
 @media (min-width: 800px) {
    .infeed {
      height: 200px;
    }
  }

</style>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-12345" crossorigin="anonymous"></script>
<ins class="adsbygoogle infeed"
     style="display:block;"
     data-ad-format="fluid"
     data-ad-layout="image-top"
     data-ad-layout-key="xxxxxxxx"
     data-ad-client="ca-pub-12345"
     data-ad-slot="123456"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

중요: 위의 예에서 수정해야 할 광고 코드가 강조표시되었습니다. 광고 코드에 같은 클래스 이름(예: infeed)을 사용해야 합니다.

광고 코드를 수정한 후에는 다양한 화면 크기에서 인피드 광고를 테스트하여 선택한 높이가 여러 기기에서 잘 작동하는지 확인해 주세요.

인피드 광고에 공백 또는 더보기 버튼이 있는 이유는 무엇인가요?

인피드 광고 단위는 반응형이고 다양한 표시 영역을 지원합니다. 인피드 광고는 게재되는 피드 컨테이너의 전체 폭을 확장하여 페이지 레이아웃에 맞게 자동으로 크기를 조정합니다. 광고의 높이는 광고의 콘텐츠 및 애드센스에서 선택한 인피드 광고 설정을 바탕으로 결정됩니다.

인피드 광고가 사용자의 표시 영역(스크롤 없이 볼 수 있는 부분)에 있는 경우 광고 아래의 콘텐츠가 재배치되지 않도록 광고 높이를 조절할 수 없을 때가 있습니다. 이 경우 공백으로 남기거나 광고를 펼칠 수 있는 더보기 버튼이 표시될 수 있습니다. 이는 사용자에게 최고의 환경을 제공하기 위한 조치입니다.