# Как показать всплывающую липкую рекламу AdSense 300x250 в правой боковой панели страницы темы выше сгиба?

**URL:** https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723
**Category:** Support
**Created:** [11.Сентябрь.2020 09:39:45 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723 "2020-09-11T09:39:45Z")
**Posts on this page:** 15
**Page:** 1

<div class="post-metadata">

### Author: ![Faizan\_Zahid](https://avatars.discourse-cdn.com/v4/letter/f/b9bd4f/32.png) [@Faizan\_Zahid](https://meta.discourse.org/u/Faizan_Zahid)
#### Post date: [11.Сентябрь.2020 09:39:45 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/1 "2020-09-11T09:39:45Z")

</div>

По сути, я хочу реализовать то, что очень похоже на то, что есть на сайте ниже.  
Обратите внимание на рекламный баннер 300x250 в правой боковой панели страницы темы на Quora.

 ![image](https://global.discourse-cdn.com/meta/original/3X/5/8/588e91b855c64c0aab56a8a30fde864ce04787bd.jpeg)

У меня есть аналогичная структура страницы темы в форуме Discourse с большим количеством сообщений в каждой теме. **Я хочу, чтобы пользователи видели фиксированный/плавающий рекламный баннер 300x250, который должен быть «липким» (sticky). Это означает, что когда пользователи прокручивают страницу темы вниз, чтобы читать новые сообщения, этот баннер в правой боковой панели должен оставаться на месте, точно под текущим слайдером навигации по теме (timeline темы) в Discourse.**  
То же поведение, что вы видите здесь: [https://www.quora.com/What-are-the-lessons-people-most-often-learn-too-late-in-life](https://www.quora.com/What-are-the-lessons-people-most-often-learn-too-late-in-life)

Как мне этого добиться? Я уже использую плагин [GitHub - discourse/discourse-adplugin: Official Discourse Advertising Plugin. Install & Start Serving Ads on Your Discourse Forum · GitHub](https://github.com/discourse/discourse-adplugin), но не нашел в нем опции для реализации такой функции.

Я нашел эту тему: [How to show advertising in timeline of the topic page?](https://meta.discourse.org/t/how-to-show-advertising-in-timeline-of-the-topic-page/160049), но не уверен, как вставить туда код рекламы Google AdSense, который выглядит примерно так. Я не знаю, как вставить это в HTML Ember JS, так как получаю ошибки, связанные с тегом script и незакрытым div. Поскольку это уже тег script, как мне загрузить скрипт Google JS внутри существующего скрипта Discourse Ember?

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

```

При попытке сделать это я получаю следующую ошибку:

 ![image](https://global.discourse-cdn.com/meta/original/3X/1/8/1808b724e3de97c416ac29ced8d41e08d77dcf0a.png)  
 ![image](https://global.discourse-cdn.com/meta/original/3X/f/d/fd800dac4aae5f636e5b73ef01002acf37be0487.png)

Мой код выглядит так:

```
<script type="text/discourse-plugin" version="0.8">

api.decorateWidget('topic-timeline-container:before', helper => {
    return helper.h('div.side-block', [
    	helper.rawHtml('<div id="friends"><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-708790731302" data-ad-slot="5067761793" data-ad-format="auto" data-full-width-responsive="true"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});</script></div>'),
    ])
 });    
</script>

```

Также я использую плагин «Оглавление» (Table of Contents) для Discourse: [DiscoTOC - automatic table of contents](https://meta.discourse.org/t/discotoc-automatic-table-of-contents/111143), поэтому реклама должна отображаться также под текущим оглавлением. Сейчас я заметил, что когда появляется оглавление, таймлайн темы исчезает.

Может ли кто-нибудь помочь мне реализовать это? Такой липкий баннер будет более заметен для моих пользователей, что улучшит CPM.  
@ladydanger @neil, не могли бы вы помочь?

Заранее спасибо.

---

<div class="post-metadata">

### Author: ![bartv](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bartv/32/130052_2.png) [@bartv](https://meta.discourse.org/u/bartv)
#### Post date: [11.Сентябрь.2020 20:29:10 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/2 "2020-09-11T20:29:10Z")

</div>

Думаю, всплывающая реклама может нарушать условия использования Adsense, будьте осторожны.

---

<div class="post-metadata">

### Author: ![Stephen](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/stephen/32/95011_2.png) [@Stephen](https://meta.discourse.org/u/Stephen)
#### Post date: [11.Сентябрь.2020 20:30:45 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/3 "2020-09-11T20:30:45Z")

</div>

На мой последний взгляд, они тоже были.

---

<div class="post-metadata">

### Author: ![Faizan\_Zahid](https://avatars.discourse-cdn.com/v4/letter/f/b9bd4f/32.png) [@Faizan\_Zahid](https://meta.discourse.org/u/Faizan_Zahid)
#### Post date: [11.Сентябрь.2020 20:31:04 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/4 "2020-09-11T20:31:04Z")

</div>

Нет, они не нарушают политику AdSense. Я уже несколько лет веду сайт с сертифицированным партнёром Google, и именно они добавили эту всплывающую рекламу. Quora делает то же самое.

Вы тоже упомянули об этом в своём посте. Но как мне получить версию тега AdSense в формате iframe?

---

<div class="post-metadata">

### Author: ![bartv](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bartv/32/130052_2.png) [@bartv](https://meta.discourse.org/u/bartv)
#### Post date: [11.Сентябрь.2020 20:32:05 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/5 "2020-09-11T20:32:05Z")

</div>

Моя всплывающая реклама — это моя собственная, а не реклама AdSense.

---

<div class="post-metadata">

### Author: ![Faizan\_Zahid](https://avatars.discourse-cdn.com/v4/letter/f/b9bd4f/32.png) [@Faizan\_Zahid](https://meta.discourse.org/u/Faizan_Zahid)
#### Post date: [11.Сентябрь.2020 20:34:04 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/6 "2020-09-11T20:34:04Z")

</div>

Многие ведущие новостные сайты размещают фиксированную рекламу в правой боковой панели, пока пользователи читают новости слева на странице и прокручивают её вниз.

В том числе Forbes, Huffingtonpost, Quora, 9gag, BBC и другие.

Может ли кто-нибудь помочь мне встроить мой код AdSense в этот блок кода на Ember.js? У меня возникают ошибки синтаксиса.

---

<div class="post-metadata">

### Author: ![Terrapop](https://avatars.discourse-cdn.com/v4/letter/t/ecd19e/32.png) [@Terrapop](https://meta.discourse.org/u/Terrapop)
#### Post date: [11.Сентябрь.2020 20:37:12 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/7 "2020-09-11T20:37:12Z")

</div>

У вас есть разрешение на размещение липкого рекламного блока AdSense в вашем аккаунте от вашего представителя? Я уверен, что издателями, которых вы назвали, мы тоже являемся, но для этого у вас должен быть заключён премиальный контракт с издателями. Если нет, это один из самых быстрых способов получить блокировку аккаунта. Просто предупреждаю… и, возможно, в интересах других, кто хочет заняться этим.

---

<div class="post-metadata">

### Author: ![Faizan\_Zahid](https://avatars.discourse-cdn.com/v4/letter/f/b9bd4f/32.png) [@Faizan\_Zahid](https://meta.discourse.org/u/Faizan_Zahid)
#### Post date: [11.Сентябрь.2020 20:52:13 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/8 "2020-09-11T20:52:13Z")

</div>

@Terrapop да, я являюсь премиум-партнёром Google по издателям. Не могли бы вы помочь мне решить мою проблему? Я уже целый день пытаюсь заставить это работать.

Я также являюсь премиум-партнёром Google Ad Exchange.

Кроме того, у меня есть и другие рекламные сети, поэтому я могу размещать их код в «липком» элементе, но все они используют JS-теги, которые вставляются в HTML-код. Однако, когда я пытаюсь вставить JS-теги внутрь кода Ember.js, как в моём посте выше, возникает ошибка синтаксиса.

---

<div class="post-metadata">

### Author: ![Terrapop](https://avatars.discourse-cdn.com/v4/letter/t/ecd19e/32.png) [@Terrapop](https://meta.discourse.org/u/Terrapop)
#### Post date: [11.Сентябрь.2020 21:05:56 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/9 "2020-09-11T21:05:56Z")

</div>

Почему бы просто не добавить div с идентификатором над контейнером таймлайна и не настроить таргетинг/трафик через DFP? В частности, поскольку вы не хотите показывать в этом месте адаптивный блок AdSense, а блок фиксированного размера. В контейнере для рекламы вообще не нужен JavaScript. Именно так мы размещаем всю рекламу на Discourse, включая header bidding через prebid.js. В противном случае, полагаю, придется разрабатывать плагин, так как я не знаю, возможно ли вообще через компонент шаблона вставить сырые script-теги куда-либо. Мне кажется, что нет, но у других может быть более точный ответ.

---

<div class="post-metadata">

### Author: ![Faizan\_Zahid](https://avatars.discourse-cdn.com/v4/letter/f/b9bd4f/32.png) [@Faizan\_Zahid](https://meta.discourse.org/u/Faizan_Zahid)
#### Post date: [11.Сентябрь.2020 21:29:34 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/10 "2020-09-11T21:29:34Z")

</div>

> [@Terrapop](#):
>
> ID над таймлайном

Большое спасибо за ваше предложение. Я на самом деле никогда не использовал DFP, но у меня есть аккаунт в DFP.  
Не могли бы вы привести пример кода, показывающий, как добавить div с ID над контейнером таймлайна и настроить таргетинг/трафик через DFP?

Какие изменения мне нужно внести в настройки Discourse и в аккаунте DFP? Пожалуйста, предоставьте скриншоты и пример кода, это было бы очень полезно.

Приношу извинения, но у меня нет большого опыта в кастомизации макета страницы темы или в работе с Discourse в целом; я использовал его по умолчанию, как есть. Если вы сможете помочь, это будет превосходно.

---

<div class="post-metadata">

### Author: ![Terrapop](https://avatars.discourse-cdn.com/v4/letter/t/ecd19e/32.png) [@Terrapop](https://meta.discourse.org/u/Terrapop)
#### Post date: [11.Сентябрь.2020 21:55:34 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/11 "2020-09-11T21:55:34Z")

</div>

Премиальный партнер AdX и никогда не использовали DFP? Как такое возможно? Ладно… 🙄

Здесь, на Meta, множество руководств по созданию компонентов. Но я не могу поделиться с вами кодом нашей реализации DFP. Это лишь запутает вас, так как мы также внедрили в него header bidding, что гораздо сложнее, чем вам нужно. Однако у Google есть очень подробная документация для простого настройки — это довольно базовые вещи на JavaScript.

---

<div class="post-metadata">

### Author: ![Faizan\_Zahid](https://avatars.discourse-cdn.com/v4/letter/f/b9bd4f/32.png) [@Faizan\_Zahid](https://meta.discourse.org/u/Faizan_Zahid)
#### Post date: [11.Сентябрь.2020 22:29:00 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/12 "2020-09-11T22:29:00Z")

</div>

Мои рекламные сети всегда берут на себя работу с DFP, я этого не делаю.

Вы могли бы привести простой пример на основе кода, не раскрывая свой личный код. Просто скажите, что я вставлю свой код вместо вашего… Любое видео или примеры кода (вы можете удалить свои секретные коды DFP, мне это не важно), но я хочу понять, как это делается…?

---

<div class="post-metadata">

### Author: ![Terrapop](https://avatars.discourse-cdn.com/v4/letter/t/ecd19e/32.png) [@Terrapop](https://meta.discourse.org/u/Terrapop)
#### Post date: [11.Сентябрь.2020 22:41:13 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/13 "2020-09-11T22:41:13Z")

</div>

Никогда не слышал, чтобы рекламные сети управляли DFP для клиентов. Агентства — да… но рекламные сети?

Что-то в этом роде… (это не полностью рабочий код, требуется гораздо больше, но чтобы дать вам представление)

```
<div id="adunit_sidebar"></div>

var adunit_sidebar = googletag.defineSlot('/XXXXXXX/SIDEBAR', [300,250], 'adunit_sidebar').addService(googletag.pubads());

googletag.pubads().disableInitialLoad();
googletag.enableServices();
googletag.display([adunit_sidebar]);
googletag.pubads().refresh([adunit_sidebar]);

```

Но если вы вообще не понимаете этот код, вам нужно попросить вашу «рекламную сеть» или агентство настроить его.

---

<div class="post-metadata">

### Author: ![Faizan\_Zahid](https://avatars.discourse-cdn.com/v4/letter/f/b9bd4f/32.png) [@Faizan\_Zahid](https://meta.discourse.org/u/Faizan_Zahid)
#### Post date: [11.Сентябрь.2020 22:59:55 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/14 "2020-09-11T22:59:55Z")

</div>

Давайте попробуем. Где в Discourse нужно разместить этот код? Если в секции после , пожалуйста, обновите код, чтобы его можно было вставить в site head без ошибок JavaScript или синтаксических ошибок.

Также, какие еще зависимости или скрипты необходимы для полноценной работы?

---

<div class="post-metadata">

### Author: ![Terrapop](https://avatars.discourse-cdn.com/v4/letter/t/ecd19e/32.png) [@Terrapop](https://meta.discourse.org/u/Terrapop)
#### Post date: [12.Сентябрь.2020 05:45:29 UTC](https://meta.discourse.org/t/how-can-i-show-a-floating-sticky-300x250-adsense-ad-on-right-side-bar-of-topic-page-above-the-fold/163723/15 "2020-09-12T05:45:29Z")

</div>

Нет, вы не можете использовать это как есть где-либо. Как уже говорилось, требуется гораздо больше, и, поскольку у вас нет базового технического понимания ни DFP, ни Discourse, ни JavaScript, пожалуйста, наймите кого-то, кто сможет вам помочь, например, в #Marketplace.
