Размещение рекламы на HTML-сайте -> Как сделать сайт на html -> document.getElementById.getElementsByTagName.append

Как разместить рекламу после второго абзаца?

Не секрет, что размещение рекламного блока в теле статьи значительно повышает его CTR и, следовательно, прибыль веб-мастера. Однако далеко не все бесплатные CMS имеют функционал, позволяющий добавлять блоки в середину текста.

Самый простой способ вставить рекламу после определенного абзаца - это использование библиотеки jQuery, которая позволяет сделать это всего парой строк. К минусам этого решения можно отнести то, что рекламный блок не будет показан пользователю, у которого отключен JavaScript (например, при установленном расширении NoScript), но, если учесть, что подавляющее большинство рекламы выводится на web-странице при помощи JS, то эту проблему можно считать несущественной.

Вывести рекламный блок после второго абзаца довольно просто:

<script type="text/javascript">
<script type="text/javascript"> $("#articleBody p:eq(3)").after('<div>Рекламный блок!</div>');
</script>

Однако дело усложняется в случае, если требуется вывести не просто контент, размещенный в DIV, а скрипт, который обычно и выводит всю рекламу. Для этого понадобится создать отдельную переменную, в которой указать свойства скрипта, после чего вывести его при помощи функции append.

Готовый код к результате будет выглядеть так:

<script>
$(document).ready(function() {
var s1 = document.createElement('script');
s1.src='http://...'; // адрес скрипта
s1.type = 'text/javascript';
document.getElementById("article-body").getElementsByTagName('p')[1].append(s1);
});
</script>

Разберем код подробнее. В переменную s1 заносится вся необходимая информация, позволяющая вывести данные скрипта, в частности, его адрес (src) и тип (type). С помощью функции append скрипт добавляется в HTML-код страницы после заданного объекта.

Опция getElementById позволяет обратиться к элементу страницы по его ID (в данном случае к div с ID article-body). Функция getElementsByTagName('p')[1] получает второй абзац (отсчет начинается с нуля) P, входящий в состав DIV.

Как разместить блок Adsence после второго абзаца

В интернете также имеется способ вывести в теле статьи рекламу Adsence:

<script type="text/javascript" src="https://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){ $("#articleBody p:eq(3)").after('<ins class="adsbygoogle" style="display: block;" data-ad-client="ca-pub-XXXXXXXXXXXXXXXX" data-ad-slot="XXXXXXXXXX" data-ad-format="auto"></ins>'); });
</script>
<script src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
$(document).ready(function(){ (adsbygoogle = window.adsbygoogle || []).push({}); });
</script>

Однако достоверно неизвестно, позволяют ли правила Google вносить изменения в их рекламный блок подобным образом.


Меню сайта

Как разместить рекламу после второго абзаца?
Как разместить рекламу после второго абзаца?