Как вставить Google AdSense в любом месте блога на Блоггер (Blogspot)

Как вставить рекламный блок объявлений Google AdSense в любом месте блога на Блоггер (Blogspot)


  Доброго времени суток дорогие читатели блога Best-For-Blogger.ru
В этой статье хочу рассказать Вам - Как вставить рекламные блоки объявлений Google AdSense в любом месте Вашего блога на Blogger (Блогспот). Таком как: шапка блога, тело сообщения (поста), раздел комментариев.

    Содержание
  1. Несколько слов о Google AdSense
  2. Общее, что необходимо для успешного размещения рекламы в любом месте блога на блогпост
  3. Блок рекламных объявлений Адсенсе в шапке блога
  4. Блок рекламы Гугле Адсенсе после заголовка статьи (поста)
  5. Реклама Google AdSense в любом месте вашей(го) статьи (поста)
  6. Реклама Адсенсе в конце статьи (поста)
  7. Блок рекламы Google AdSense в разделе комментарии (4 варианта)
  8. Примечания

Несколько слов о Google AdSense

– это партнёрская программа контекстной рекламы от известной во всём мире поисковой системы Google. Данная партнёрка – это отличный способ заработать в интернете на своём сайте, даже если ваш сайт просто информационный и вам нечего продавать.  Вам необходимо лишь один раз установить блок рекламных объявлений на свой ресурс и тем самым получить дополнительный доход в интернете.

  Этот вид заработка можно смело отнести к пассивному доходу. Так как вам достаточно зарегистрироваться в Адсенсе, создать и настроить рекламные объявления и установить блок рекламы к себе на сайт. После этого вы будете получать денежное вознаграждение каждый раз, когда посетители вашего ресурса будут кликать по рекламным объявлениям.

  Размер вашего заработка на контекстной рекламе в первую очередь зависит от популярности вашего сайта. Чем он популярнее и чем больше у него суточная посещаемость, тем больше вы сможете заработать на рекламе. Поэтому не забывайте наполнять свой ресурс новыми интересными статьями и уделять должное внимание его раскрутке.

  Бродя по просторам интернета, я не раз обращал внимание на то, что на многих сайтах реклама от Гугла стоит не только в шапке сайта или в боковых панелях, но и в середине текста (контента). Так же захотелось сделать и у себя.



  Зашёл в аккаунт Адсенсе создал новый рекламный блок, настроил, скопировал его код. И вставил, в том виде как он был в тело поста своего блога. И – о чудо, сработало! Теперь и у меня в блоге есть реклама в середине поста. Но моя радость длилась не долго, пока я не увидел RSS-ленту своего блога, там отображался код рекламного блока. И это смотрелось, мягко говоря – не очень. Пришлось искать другой способ как установить блок рекламы от Google AdSense в тело поста на болггер. Потратив некоторое время на решение этого вопроса, оно было найдено.


Общее, что необходимо для успешного размещения рекламы в любом месте блога на блогпост


Важно: 
- В первую очередь Вам нужно сделать резервную копию шаблона. Т.к. мы будем устанавливать блок рекламы Google AdSense непосредственно в шаблон блога с последующим автоматическим или ручным выводом его в тело статьи. Вероятность глобальной ошибки всегда присутствует, в результате которой внешний вид блога может измениться в худшую сторону. На восстановление до первоначального состояния может уйти довольно-таки много времени и сил.  А при наличие сохранённой резервной копии при любых неожиданностях, в любой момент можно вернуть прежний вид блогу всего за несколько кликов.

- При любых работах с шаблоном перед сохранением внесённых изменений обязательно необходимо предварительно просмотреть шаблон. Нажав на соответствующую кнопку и убедиться, что нет ни каких не предвиденных сюрпризов. Всё осталось как было или стало ещё лучше и только после этого нажимаем "Сохранить шаблон".

  Для успешной реализации задуманного Вам потребуется:
- Скрипт блока рекламы AdSense о том где его взять я рассказывал в одной из прошлых статей - Google AdSense - регистрация, создание рекламного блока его настройка.

- Adsense Converter - который поможет Вам конвертировать скрипт рекламы. Для установки его в шаблон блоггера. Т.К. в исходном виде вставить его в шаблон не получится.

- Заходим в свой аккаунт Google AdSense. Следуем в: «Мои объявления», «Рекламные блоки» выбираем уже существующий или же создаём новый рекламный блок. Где и копируем код/скрипт нашего блока объявлений. Он должен иметь приблизительно следующий вид:

Скрипт рекламы Google AdSense



  Далее переходим на страницу Adsense Converter и вставляем скрипт в окно конвертера.

Adsense Converter


  И жмём на кнопочку "Converter Script". После чего произойдёт конвертация и мы получим готовый для установки в шаблон блога код рекламного блока объявлений Гугле Адсенсе.

Converter Script



  Копируем его и сохраняем у себя на ПК в файле любого текстового редактора (блокнот или прочие) для последующего использования.

  Далее в меню блога переходим в раздел "Шаблон", нажимаем кнопку "Изменить HTML". В новом окне кликаем левой кнопкой мыши, что бы установить курсор в HTML код шаблона. И нажимаем комбинацию кнопок "Ctrl + F", должно появиться поле поиска. С помощью которой будем искать "заветное место", что бы установить рекламный блок Адсенсе в любом месте блога. Будьте внимательны для каждого из предложенных ниже вариантов будет своя строка для поиска. После того как вставили искомую строку в поле поиска жмём клавишу Ввод/Enter. Произойдёт поиск и нужная строка будет выделена.

Пример поиска:

Поиск в шаблоне Blogger



Блок рекламных объявлений Адсенсе в шапке блога Blogspot


  В шаблоне находим строку - <b:section class='header' id='header' maxwidgets='1' showaddelement='no'> и заменяем её следующим содержанием:

<b:section class='header' id='header'>
<b:widget id='HTML500' locked='yes' type='HTML/JavaScript'/>

  Далее в меню блога, переходим во вкладку "Дизайн". Над гаджетом "Название вашего блога (заголовок)", находим новый гаджет HTML/JavaScript. Нажимаем "Изменить" и в поле "Содержание" вставляем скрипт рекламы Адсенсе (в том виде как он есть изначально, без конвертации его в Adsense Converter).

Вставить рекламу Google AdSense в шапку блога на Blogger



  Теперь необходимо откорректировать расположение блока рекламы. Для этого возвращаемся в шаблон, находим - ]]></b:skin> и перед ним прописываем следующее:

#header {position: relative;}

#HTML500 {
z-index: 200;
position: absolute;
max-width: 732px; /* ширина блока  */
max-height: 94px; /* высота блока */
top: 10px;  /* отступ сверху */
right: 0px;  /* отступ справа */
}

  Значения выделенные красным подставляем свои, для достижения наилучшего расположения.
Таким образом можно разместить шапке блога не только рекламы от Гугла, но и объявления рекламной сети РСЯ,  баннер, любой другой гаджет и т.д.


Блок рекламы Гугле Адсенсе перед или после заголовка статьи (поста)


  Ищем в шаблоне одну из следующих строк для выбранного варианта:
Перед заголовком - <b:includable id='post' var='post'>

После заголовка - <div class='post-header-line-1'/>

  После того как нашли нужную строку, сразу под ней вставляем код блока объявлений Google AdSense который должен иметь следующий вид:

<div style='clear:both; margin:10px 0'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>/* Показ объявлений на всех страницах, кроме главной */

<div style='text-align:center;'> /* Расположение блока по центру страницы */

(Ваш конвертированный код)


</div> </b:if>
</div>

  Выделенное красным - (Ваш конвертированный код) обязательно нужно заменить на полученный в Adsense Converter преобразованный код.

  Проверяем и сохраняем шаблон. Теперь объявления Google будут автоматически выводиться перед заголовком статьи или под ним. В соответствии выбранного вами варианта.


Реклама Google AdSense в любом месте вашей(го) статьи (поста)


  Находим строку: <data:post.body/>, таких строк должно быть три. Если же их меньше или больше тогда последнюю из них заменяем следующим кодом:

<div expr:id='&quot;aim1&quot; + data:post.id'/>
<div style='clear:both; margin:10px 0'>
<b:if cond='data:blog.pageType == &quot;item&quot;'> /* Показ объявлений на всех страницах, кроме главной */
<div style='text-align:center;'> /* Расположение блока по центру страницы */

(Ваш конвертированный код)

</div> </b:if>
</div>
<div expr:id='&quot;aim2&quot; + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
var obj0=document.getElementById(&quot;aim1<data:post.id/>&quot;);
var obj1=document.getElementById(&quot;aim2<data:post.id/>&quot;);
var s=obj1.innerHTML;
var r=s.search(/\x3C!--Reklama-adsense --\x3E/igm);
if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script>

  Выделенное красным - (Ваш конвертированный код) заменяем полученным в Adsense Converter преобразованным кодом.

  Проверяем и сохраняем шаблон.
  Далее переходим к редактированию любой уже написанной статьи или же написанию новой. И во вкладке HTML в желаемом месте выводы объявлений Adsense вставляем следующую строчку:
<!--Reklama-adsense -->. Обновляем статью, проверяем результат.


Реклама Адсенсе в конце статьи (поста)


  Если Вы уже использовали способ размещения из пункта "4" тогда код из этого пункта должен быть размещён сразу под ним.
  Если нет, тогда ищем строку: <data:post.body/>, таких строк должно быть три. Если их меньше или больше в таком случае сразу после последней вставляем следующий код:

<div style='clear:both; margin:10px 0'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>/* Показ объявлений на всех страницах, кроме главной */
<div style='text-align:center;'> /* Расположение блока по центру страницы */

(Ваш конвертированный код)

</div> </b:if>
</div>

  Выделенное красным - (Ваш конвертированный код) заменяем полученным в Adsense Converter преобразованным кодом.

  Проверяем и сохраняем шаблон. Теперь объявления Гугле будут автоматически выводиться в конце статьи.


Блок рекламы Google AdSense в разделе комментарии (4 варианта)


  Выбираем любой понравившийся вариант из предложенных ниже:
Перед комментариями - <div class='comments' id='comments'>

После строки ХХ (количество)комментариев - <h4><data:post.commentLabelFull/>:</h4>

Над формой создания нового коментария - <div id='comment-holder'>

Под формой создания нового коментария - <p class='comment-footer'>

 Находим соответствующую строку в шаблоне и сразу под ней вставляем ваш код, который должен иметь следующий вид (он имеет общий вид для всех четырёх вариантов):

<div style='clear:both; margin:10px 0'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>/* Показ объявлений на всех страницах, кроме главной */
<div style='text-align:center;'> /* Расположение блока по центру страницы */

 (Ваш конвертированный код)

</div> </b:if>
</div>

  Выделенное красным - (Ваш конвертированный код) как всегда заменяем преобразованным кодом, полученным в Adsense Converter.

  Просматриваем и сохраняем внесённые изменения в шаблон. В результате этих не сложных манипуляций, объявления Google автоматически будут выводиться в соответствии выбранного варианта.

Примечания:


- Помните об ограничении Максимального количества объявлений Google на странице. Согласно правил партнёрской программы Адсенсе, помимо трех стандартных рекламных блоков объявлений и двух окон поиска можно разместить до трех блоков ссылок - не увлекайтесь.

- Что бы блок объявлений более гармонично вписывался в Ваш блог не лишним будет использовать следующие свойства позиционирования:

<div style='text-align: center;'>Ваш конвертированный код (выравнивание по центру)</div>

<div style='float: left;'>Ваш конвертированный код (обтекание текстом справа)</div>

<div style='float: right;'>Ваш конвертированный код (обтекание текстом слева)</div>

  В примерах представленных в статье было использовано расположение рекламного блока по центру.

- Так же можно использовать показ объявлений на определённых страницах. О том как это сделать, Вы сможете узнать в следующей статье "Как отображать гаджеты в Blogger на определённых страницах блога".
  В примерах использовался код <b:if cond='data:blog.pageType == &quot;item&quot;'> </b:if> который отвечает за показ объявлений на всех страницах, кроме главной.


  Смотрите также:
- Как вставить блок рекламы от Google AdSense в блог на Blogger (Блогпост)
- Google AdSense — регистрация, создание рекламного блока его настройка
- Регистрация в поисковых системах
- Как изменить шаблон в Blogger
- Закрыть внешние ссылки
- Убрать внешние ссылки из Шаблона
- Закрыть внешние ссылки от кнопок и гаджетов
- Гаджет - Ссылка на это сообщение
- Вставить Facebook Like Box в Blogger
- Кнопки социальных сетей от Pluso
- Кнопки социальных сетей и закладок от Share42

 Если статья оказалась Вам полезной буду признателен если Вы порекомендуете её или сам блог "Best-For-Blogger.ru" своим друзьям и знакомым воспользовавшись кнопками социальных сетей. Или оставите на своём веб-ресурсе обратную ссылку.

 С наилучшими пожеланиями, всегда Ваш Алексей Иванович! До новых встреч на страницах нашего блога "Лучшее для Blogger". Оставляйте комментарии, подписывайтесь на обновления.

URL На эту статью:


Вставьте этот HTML код к себе на страницу:

21 комментарий :

Vera Spirina комментирует...

Большое спасибо за такие информативные посты. Я поставила рекламные блоки в конце поста по вашим инструкциям. Но сейчас у меня настройка "Показывать объявления в блоге" стоит в переключателе "Нет". Означает ли это, что пока я не поставлю "Да", реклама не будет видна в моем блоге?

Алексей Иванович комментирует...

Vera - Вам тоже спасибо, за то что так высоко оценили мой труд.
Просмотрев Ваш блог и место где стоит блок рекламы Гугл. Хочу порекомендовать с Вашего позволения - добавьте в свой блог хотя бы ещё один из предложенных выше в статье вариант размещения рекламы Google. Например в теле статьи. Объясню почему - если для Вас Google Adsense является средством монетизации блога, а не просто его украшением. То одного блока рекламы и в придачу в конце статьи для этого не достаточно. У Вас хорошие, информативные статьи и в добавок с большим количеством иллюстраций. Соответственно не каждый посетитель дочитает её до самого конца. Один блок рекламы - хорошо, повышается конкуренция среди рекламодателей, что в свою очередь увеличивает стоимость клика. Но два (на мой взгляд) лучше, увеличивает шансы на клик, хоть и уменьшает стоимость самого клика.
- На счёт Вашего вопроса - У меня реклама Google стоит очень давно и той кнопкой с тех пор не пользовался. Для того, чтобы Вам ответить - провёл эксперимент. Переключил с "Да" на "Нет". В результате выяснил, что данное действие отключило показ рекламы установленной через гаджет "AdSense" и той которая была установленная в теле поста. А вот та реклама Гугла, которая была вставлена при помощи гаджета "HTML/JavaScript" осталась на месте. Из этого следует - что, если в настройке раздела меню "Прибыль" в пункте "Показывать объявления в блоге" стоит "Нет", то рекламу вставить можно только при помощи гаджета "HTML/JavaScript". А если Вы переключите её в положение "ДА", то Вы сможете вставить стандартным гаджетом "AdSense" и в добавок можно выбрать место где будет показываться реклама Adsense. Например - "Показывать объявления в боковой панели и в сообщениях" и т.д.

Diana T комментирует...

Добрый день! Спасибо за статью! Попробовала вставить код (в любом месте статьи), все получилось! НО! При создании статьи БЕЗ вставки кода , рекламный блок вставляется автоматически в начале статьи (а там живет другая реклама и получается очень некрасиво). Подскажите пожалуйста, что такого добавить в скрипт, чтобы если в статье не предусмотрена реклама, она сама не добавлялась. Заранее спасибо.

Алексей Иванович комментирует...

Diana - Спасибо за Ваш комментарий и благодарность.
Как Вы уже заметили сами, если в статью не вставлять код для вывода рекламы Гугл Адсенс в заданном месте, то она выводится автоматически в начале статьи.
В Вашем случае для того. что бы развести две рекламы между собой, могу лишь посоветовать вставить код вывода блока рекламы Google Adsense немного ниже чем первая реклама.
На счёт Вашего вопроса - вопрос очень актуален и для меня. В поисках его решения провёл очень много времени. Но готового решения к сожалению пока нет.

Сайхан Сосланбеков комментирует...

Здравствуйте. Статья очень полезная и понятная. Даже у такого нуба как я все получилось с первого раза. Но появилась одна проблема. Между рекламой адсенс и идущим после текстом, образовался очень большой отступ, объясните пожалуйста, как сделать этот отступ меньше.

Алексей Иванович комментирует...

Сайхан - если я правильно понял, Вы решили вставить рекламу Гугл в середине статьи и под блоком рекламы появилась лишняя пустота. Для того, что бы её убрать - зайдите в редактор сообщений (постов). Перейдите в режим HTML и найдите код отвечающий за вывод рекламы Гугл в тело сообщения <!-- adsense -->. Скорее всего Вы увидите сразу за ним один или несколько тегов <br /> - это и есть "Ваша Пустота".

Сайхан Сосланбеков комментирует...

Нет, к сожалению я не нашел там несколько тегов, но к счастью я решил эту проблему тем: Что удалил единственный тег
После кода вставки адсенс.

Алексей Иванович комментирует...

Сайхан - Рад что Вы нашли тот самый тег <br /> отвечающий за перенос строки и разобрались с его количеством. И реклама Гугл вписалась в текст поста так как Вы того хотели.

Сайхан Сосланбеков комментирует...

Да, спасибо большое. Не всегда мне так быстро отвечают на мои вопросы.

Алексей Иванович комментирует...

Сайхан - я всегда стараюсь отвечать на все комментарии. Но к сожалению не на все получается отвечать так оперативно как в Вашем случае.

Koresh N комментирует...

Здравствуйте !! хочу сказать огромное спасибо за эту статью , она помогла мне во многом разобраться !! Но вот возник вопрос , я все сделал как вы написали в статье , вставил код в конце статьи и после заголовка а также и в после комментариев все сохранил как надо , но вот ни каких изменений на странице не увидел . Кроме разве что гаджета HTML/JavaScript который все таки виден , но я не уверен что этого достаточно для того , что бы мою заявку рассмотрели или это нормально, подскажите ? Буду вам признателен !

Алексей Иванович комментирует...

Koresh - если я Вас правильно понял - Вы вставили рекламу Гугл в свой блог, но она не отображается. Могу предположить, что Вы недавно зарегистрировались в Гугле Адсенсе и Ваша заявка на участие в партнёрке Гугл ещё не прошла модерацию.
Как вариант - перепроверьте всё ли Вы правильно сделали при внедрении рекламы Google Adsens в свой блог. А так же почитайте эту статью http://www.best-for-blogger.ru/2013/04/Google-AdSense-registracija-sozdanie-reklamnogo-bloka-nastrojka.html
Если же Ваш блог уже прошол модерацию в Google но рекламы всё равно нет, тогда воспользуйтесь котактной формой моего блога "Контакты" и пришлите мне адрес своего блога с более подробным описанием проблемы. Так как не видя проблемы, я затрудняюсь Вам порекомендовать соответсвующий вариант решения данного вопроса.

Koresh N комментирует...

Спасибо !! Все получилось , реклама добавилась и видна !

Алексей Иванович комментирует...

Koresh - очень хорошо, что у Вас всё получилось и реклама Гугле Адсенсе появилась на Вашем сайте.

Саня Владимирович комментирует...

Блок вставил, но теперь блоки рекламы появляются в анонсах всех статей. Как сделать так чтобы реклама была видна только после открытия полной версии статьи?

Алексей Иванович комментирует...

Саня Владимирович - для того, что бы реализовать задуманное - читайте статью "Как показать или скрыть гаджет Blogger на определённых страницах блога". В ней Вы найдёте необходимое для Вас решение.

Olga Protasova комментирует...

Здравствуйте, а зачем заключать в Дивы код блока по центру, можно ведь просто вставить в шаблоне center код блока center. Не принимает нормально написать.

Алексей Иванович комментирует...

Olga Protasova - данные свойства не являются обязательными, каждый вебмастер принимает решение использовать их или нет в зависимости от того какой он использует блок рекламы Гугла и как он желает его разместить - с лева, с права, по центру. Нужно ему что бы реклама Google Adsense обтекала текстом или нет.

Lili4ka комментирует...

Добрый день. Скажите пожалуйста если в Блоггере аналогичное решение для того, чтобы разместить рекламу от РСЯ в тело статьи?

Orest May комментирует...

Здравствуйте!!! Делал все так как Вы тут написали все шло хорошо до определенного момента , когда вбил искоемую строку оно ничего мне не выдает к сожалению((( что делать подскажите!!!

Віталій Якуб'як комментирует...

день добрый. У Вас все коды отображаются только на страницах, имеете ли вы код чтобы рекламу показывало только на главной? Спасибо

Вернуться к началу