Как добавить баннер в заголовок Blogger

Посмотрим как добавить в шапку Blogger гаджет HTML/JavaScript, куда в свою очередь можно вставить сторонний код, например, код баннера рекламодателя или форму поиска Яндекса.

Пункт 1. На вкладке "Шаблон" без указания галочки "Расширить шаблоны виджета" код

      <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='ВАШЕ_НАЗВАНИЕ (заголовок)' type='Header'/>
</b:section>

нужно заменить на

      <b:section class='header' id='header'>
<b:widget id='HTML999' locked='false' type='HTML'/>
<b:widget id='Header1' locked='true' title='ВАШЕ_НАЗВАНИЕ (заголовок)' type='Header'/>
</b:section>

Пункт 2. На вкладке "Дизайн" над блоком заголовка появится гаджет "HTML/JavaScript". Заполняем его.

Пункт 3. На вкладке "Шаблон" без указания галочки "Расширить шаблоны виджета" перед ]]></b:skin> пишем CSS:

#header {position: relative;}

#HTML999 {
  z-index: 200;
  position: absolute;
  top: 5%;  /* отступ сверху */ 
  right: 0;  /* отступ справа */
}

Путём подбора значений top и right добиваемся нужного положения. Подробнее про CSS наложение.

источник