헤더 뒤에 커스텀 스크립트 삽입

제품 지원
1

여러분 안녕하세요,

현재 공식 Discourse 광고 플러그인을 정상적으로 사용 중이며, 제 사이트에 광고가 표시되고 있습니다. 다만, Discourse에 내장된 광고가 아닌 커스텀 스크립트나 광고를 삽입하고 싶은 경우 어떻게 해야 하는지 궁금합니다.

customize → theme → edit html/css → after header 경로로 들어가 해당 위치에 스크립트 블록을 붙여넣고 사이트를 새로고침해 보았지만, 광고가 보이지 않았습니다. 사실, 해당 스크립트를 <body> 태그 내부에 넣어야만 광고가 표시되는데, 그렇게 하면 광고가 페이지 맨 아래에 위치하게 됩니다. 하지만 “After Header” 위치가 가장 이상적인데, 그곳에서는 로드가 되지 않습니다. 참고로 이 스크립트에는 async 속성이 포함되어 있습니다.

단순히 HTML 블록을 복사해서 붙여넣기만 하면 되는 일에 왜 복잡한 플러그인이 필요할까요? 구글도 스크립트를 제공하며, 이를 헤더 뒤에 복사해서 붙여넣기만 하면 됩니다. 보통 웹사이트에서는 이렇게 하는 것이 일반적이지만, Discourse에서는 어떤 것이 스크립트를 차단하는 것 같습니다. CSP 문제는 아닌 것 같은데, 이미 https:와 inline-code를 필터로 설정해 두었기 때문에 "https"로 시작하는 모든 JS를 허용해야 하기 때문입니다. 다음은 구글 광고 스크립트입니다:

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Ad 1 -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-3368174556925488"
     data-ad-slot="4362547659"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

위 코드를 Adsense 플러그인을 사용하지 않고 수동으로 동작하도록 만들어 테마의 헤더 뒤에 배치해 보세요.

#plugin:advertising

업데이트: 결국 정답은 House Ads였습니다. 하지만 House Ads에 스크립트를 게시해도 광고가 표시되지 않습니다. 동일한 스크립트를 다른 HTML 페이지에 게시하면 정상적으로 표시되므로, Discourse가 무언가를 차단하고 있는 것으로 보입니다.

2

지금 테마 컴포넌트를 사용해서 시도해 볼 수 있습니다. 시도해 보셨나요?

스포일러: Discourse는 단일 페이지 앱(SPA)이기 때문에 광고가 새로고침되지 않습니다. 만약 AdSense가 변경되어 adsbygoogle.push({})를 사용하지 않고도 자동으로 광고를 새로고침할 수 있게 되었다면, 제게는 새로운 소식입니다.

3

사실 결국 iframe을 사용하게 되었습니다. House Ads 안에 iframe을 넣었더니 잘 작동했습니다. Google Adsense의 광고는 페이지를 새로고침하면 업데이트됩니다.

유일한 단점은 House Ads의 제휴 광고를 페이지 하단에 배치하고 싶어도 그런 옵션이 없다는 것입니다. 현재는 주제 목록의 상단이나 중간에만 배치할 수 있습니다. 하단 배치 옵션도 추가되어 더 많은 유연성을 가질 수 있으면 좋겠습니다.

4

다만, Google이 포럼의 주제를 인식하지 못해 방문자에게 관련성이 훨씬 낮은 광고를 노출하게 되며, 이로 인해 수익이 크게 떨어질 수 있습니다.

단순히 다른 페이지로 이동하는 경우에는 업데이트되지 않습니다.

5

이 주장에 대한 근거를 제공해 주시겠습니까?

구글 애드센스 및 기타 광고 봇이 사이트의 맥락을 크롤링할 때, 광고가 IFRAME 태그로든 SCRIPT 태그로든 제공되는 것은 차이가 없을 것입니다.

반드시 구글 개발자 참고 문헌을 확인해 보고 싶습니다!

감사합니다.

6

AdSense 광고가 중첩된 iframe 내에서 서빙될 때, 브라우저의 보안 기능으로 인해 광고가 타겟팅에 사용할 페이지 URL이나 도메인을 감지하는 것이 방지됩니다. 그 결과 가장 관련성 높은 광고가 서빙되지 않아 광고 수익이 잠재적으로 달성할 수 있는 수준보다 낮아집니다.

7

네, 하지만 그것은 전체적인 광고 컨텍스트 생성 방식의 전부가 아니라 단지 미묘한 차이일 뿐입니다.

AdSense를 실행하는 모든 사이트는 Google AdSense 크롤러에 의해 크롤링되므로, Google은 사이트를 크롤링하는 크롤러를 기반으로 해당 사이트의 컨텍스트에 맞게 광고를 제공합니다.

즉, Ruby on Rails를 다루는 기술 사이트의 경우, 사이트 수준에서 해당 컨텍스트와 관련된 광고가(가능한 경우) 제공됩니다.

그러나 페이지 수준에서는 물론 중첩된 IFRAME 태그에서 컨텍스트 관련 문제가 발생할 수 있습니다.

IFRAME 태그에 제공되는 모든 광고 태그가 중첩된 것은 아닙니다.

중첩된 IFRAME 태그의 예시는 다음과 같습니다:

<iframe src="http://www.w3schools.com" width="1000" height="1000" id="frame1" name="frame1">
   <iframe width="200" height="200" src="http://www.bing.com" id="frame2" name="frame2">
   </iframe>
</iframe>

솔직히 말씀드리면, 실무에서 이런 상황이 발생하는 것을 거의 본 적이 없습니다. 그리고 우리가 확인해 본 결과(지난 15년 동안 여러 번 확인해 왔습니다), 이 문제가 발생하는 경우는 패스백 태그(passback tags)를 사용할 때뿐이었습니다.

도움이 되셨으면 좋겠습니다.

8

참조 자료를 원하셨군요. 'nested’가 의미하는 바는 그게 아닙니다. "iFrame 안에 AdSense 광고를 어떻게 제공할 수 있습니까?"라는 제목만 봐도 명확합니다. 예전에는 iframe 사용 자체가 정책 위반이었죠.

2007년부터 AdSense 관련해서 책에 나오는 모든 트릭을 시도해 봤고, @michaeld와 함께 첫 번째 Discourse AdSense 플러그인을 작성했습니다.

우리 둘 다 경험이 다르리라 생각합니다. 그렇게 잘 해결하셨다니 다행이네요. 다른 분들도 시도해 보고 싶으시다면: 제가 눈물을 닦아 주러 있지는 않을 겁니다.

9

솔직히 말씀드리면, 지난 10년 동안 저희는 10억 건 이상의 광고를 제공해 왔으며, 수년 전부터 AdSense를 직접 사용하지 않고 있습니다(여러 이유로 AdSense를 선호하지 않기 때문이죠). 따라서 지금 디스플레이 광고에서 어떤 일이 일어나고 있는지, 즉 '광고 제공(ad serving)'을 거시적인 관점에서, 현재 상황의 관점에서 살펴볼 필요가 있습니다.

컨텍스트(관련성)

IDN Technet이나 다른 컨텍스트 기반 광고 네트워크와 같이 직접 구매 광고를 제공하는 대부분의 광고 네트워크는 사이트의 콘텐츠를 크롤링하지 않습니다. 그들은 광고 구매자에게 사이트를 마케팅하며, 예를 들어 "이곳은 Discourse 메타 사이트로, 기술 개발, Ruby, JavaScript 등 모든 기술 관련 분야에서 훌륭한 콘텐츠를 갖추고 있습니다"라고 설명합니다. 저희는 이들을 강력히 추천합니다.

그리고 요즘은 발행자에게 ads.txt 항목을 제공하며, 크롤러(AdSense 크롤러와 같은)가 아닌 사이트의 카테고리 및 하위 카테고리에 기반하여 광고 네트워크에서 발행자에게 광고를 제공합니다.

이것이 요즘의 규칙이며, 예외가 아닙니다.

동영상 콘텐츠 및 동영상 기반 광고에도 동일한 원칙이 적용됩니다. 저희의 동영상 파트너는 크롤러가 컨텍스트를 찾는 방식이 아니라, 브로셔를 통해 사이트의 컨텍스트에 기반하여 저희 사이트의 광고를 판매합니다.

실제로, 사이트 분류를 크롤러에 의존하는 광고 네트워크(특히 패스백 태그의 경우)로부터 광고를 제공한 지 수년이 되었습니다. 패스백 태그는 크롤러가 분류를 수행하는 것보다 컨텍스트가 광고 네트워크에 하드코딩되어 있을 때 항상 가장 잘 작동합니다.

패스백(Passbacks)

패스백 광고(태그)에서 관련 있는 컨텍스트를 얻는 것은 항상 어렵습니다.

수년간 10억 건 이상의 디스플레이 광고를 제공해 온 발행자로서의 제 경험에 비추어 볼 때, 패스백 광고 네트워크에 대해 크롤러를 통해 컨텍스트를 개발하는 광고 네트워크를 사용하지 않는 것이 좋습니다.

지난 10년간 광고를 발행해 온 제 경험에 따르면, 패스백 태그는 하드코딩된 컨텍스트를 기반으로 사용하는 것이 가장 좋습니다. 예를 들어, 기술 사이트 운영자가 인도에 패스백을 제공하려면, 인도의 기술 애호가들에게 기술적 관심을 유발하는 패스백 태그를 사용해야 합니다.

AdSense

저희는 아마도 15년에서 10년 전쯤 AdSense를 사용했으며, 지난 10년 동안 AdSense를 직접 제공한 적이 언제였는지 기억나지 않습니다. 제 생각에 AdSense는 수익을 창출하는 좋은 방법은 아닙니다.

AdSense는 크롤러를 통해 컨텍스트를 개발하므로, 일반적으로 태그가 중첩된 IFRAME 태그(iframe 태그 안의 IFRAME 패스백 태그)가 아니라면 IFRAME 태그를 사용하면 문제가 없을 것입니다.

IFRAME 태그의 몇 가지 장점

  • 브라우저는 인라인 프레임에 대해 미리 공간을 할당하고 문서 렌더링 시 이를 고려합니다.

  • Iframe은 크로스 도메인 오리진 정책을 구현하여 다른 도메인 이름의 사이트/콘텐츠/광고를 가져오는 데 유용할 수 있으며, 비교적 안전하기 때문에 대부분의 웹 광고 솔루션이 iframe에 기반합니다.

  • 먼저 콘텐츠를 로드한 후 광고를 로드해야 하는 경우, Iframe을 사용하여 수행할 수 있습니다.

  • Iframe은 성능 향상에 도움이 됩니다.

  • Iframe은 페이지의 다른 컴포넌트와 독립적으로 로드됩니다.

  • 사용자가 JavaScript를 비활성화한 경우에도 iframe은 작동합니다.

  • iframe 태그에는 height와 width 속성이 있어 300×250, 728×90과 같은 광고 크기에 따라 디자이너가 크기와 형식에 대해 큰 자유도를 가질 수 있습니다.

  • iframe 태그는 페이지의 어디에나 나타날 수 있으며, 원한다면 여러 iframe을 추가할 수도 있습니다.

IFRAME 태그의 몇 가지 단점

  • Iframe 태그는 접근성 문제를 일으킬 수 있습니다.

  • Iframe 태그는 모든 브라우저에서 지원되지 않으며, 제대로 표시되지 않거나 심지어 빈 화면이 표시될 수 있습니다.

  • 웹 광고에서 iframe을 사용하는 주요 이유는 크로스 도메인 지원에서의 보안이지만, 성능은 완벽하지 않습니다.

  • 많은 휴대용 기기에서는 Iframe이 보이지 않을 수 있습니다.

  • Iframe은 때때로 SEO를 낮추는 것으로 알려져 있습니다.

JS 태그의 장점과 단점:

  • 관심 있는 사람이 있다면 나중에 추가하겠습니다.

공급과 수요

이것은 2020년입니다. 광고주에게 광고를 공급하는 웹 사이트의 수는 2000년 이후 기하급수적으로 증가했습니다. 광고의 공급이 수요를 훨씬 초과하고 있습니다. 이는 Discourse에 광고를 설정하는 것에 대해 논의하고 있는 대부분의 사이트, 즉 강력한 수요와 확립된 니치 аудитории가 없는 한 프리미엄 광고 트래픽을 얻기 어렵다는 것을 의미합니다.

2020년에는 모든 테크니션과 그의 자매가 블로그와 포럼에 광고를 게시할 수 있으며, 실제로 그렇게 하고 있습니다. 이는 디스플레이 광고에 대한 공급이 미래에도 수요를 계속 초과할 것이라는 것을 의미합니다. 대부분의 니치 사이트는 잘 확립되기까지 신규 사이트에서 광고 수익을 창출하는 데 어려움을 겪을 것입니다.

Discourse와 크롤러

Discourse는 크롤러에게 SPA(싱글 페이지 애플리케이션)를 제공하지 않으므로, 이는 adbot 크롤러도 SPA를 볼 수 없다는 것을 의미합니다. 그리고 이 문제의 전체적인 함의가 (독립적인 제3자에 의해) “제3자로서 객관적으로” 분석되지 않았다는 것은 제 지식 범위 내에서는 사실입니다.

요약

JavaScript SPA로 Discourse를 실행하는 대부분의 신규 Discourse 사용자는 디스플레이 광고 수익 네트워크(AdSense 등)로부터 큰 수익을 창출하지 못할 것이라고 생각합니다. 이는 특히 팬데믹으로 인해 광고주의 광고 예산이 훨씬 줄어든 2020년에 더 두드러집니다. 또한, 공급은 높고 수요는 낮습니다.

디스플레이 광고를 실행하는 경우, 페이지가 “새로고침되지 않는” 방식 때문에 모든 SPA에서 문제가 발생할 것입니다. 이는 JS 태그와 IFRAME 태그 모두에 해당되는 문제이며, SPA에서 모든 유형의 제3자 태그를 최적화하기 위해 더 나은 플러그인 코드가 필요합니다.

마무리

저희는 수년 동안 AdSense를 제공하지 않았으며, 미래에도 그렇게 할 계획이 없습니다. 따라서 AdSense가 컨텍스트를 어떻게 얻는지에 대한 논점은 저희에게는 무의미합니다. 다른 사람들에게는, 제 생각에 제3자 스크립트 태그를 제공하고 CORS 문제를 해결하려고 머리를 쥐어짜는 것보다 작동하는 IFRAME 태그를 실행하는 것이 더 낫습니다.

걷기 전에 기어으세요. 달리기 전에 걷으세요.

도움이 되길 바랍니다.

잘 지내세요.

P.S.: 오타가 있다면 죄송합니다. 아내가 비가 오기 전에 쇼핑하러 가려고 문 앞에서 기다리고 있습니다!

10

이것은 구글을 위한 것이 아닙니다. 앞서 논의했듯이, 이는 구글, 아마존 등이 아닌 제휴 광고 단위를 위한 것입니다. 구글의 경우, 이미 내장된 애드센스 플러그인을 사용 중입니다. 제 구글 광고는 이미 잘 작동하며 광고 주제를 방문자에 맞게 조정합니다. 또한 애드센스를 통해 광고 장르도 제어할 수 있습니다.

제 질문은 항상 동일한 정적 제휴 광고에 관한 것입니다. 그래서 이를 위해 설계된 하우스 광고(House ads)를 사용하고자 했습니다. 그러나 이 기능은 광고 단위를 배치할 수 있는 위치에 제한이 있습니다.

현재 저는 iframe을 사용하여 테마 HTML의 푸터에 배치했는데, 잘 작동하고 있습니다. 다만 이 방식의 유일한 문제는 iframe이 모든 사용자 그룹, 심지어 높은 신뢰도 레벨을 가진 사용자들에게도 표시된다는 점입니다. 이전에 저는 디스커스의 광고 관리자를 통해 신뢰도 레벨 3 이상의 사용자에게 광고 단위를 표시하지 않도록 선택할 수 있었거든요.