Как сделать 2 гаджета в шапке блога на Blogger (Blogspot)

Приветствую вас, дорогие гости и читатели блога Я блоггер. В предыдущей статье я подробно описала как добавить гаджет в блог.

В нынешнем уроке расскажу как добавить гаджет HTML/JavaScript в шапку блога. В стандартных шаблонах Blogger (Blogspot) в блоке Header по умолчанию стоит один гаджет «Заголовок страницы».

Если рационально использовать шапку блога, то можно добавить еще один гаджет и вставить к примеру социальные кнопки, код баннера рекламы , поиск по сайту от Яндекса или Google, бегущую строку или меню сайта. Изменения будем делать в шаблоне . Не забываем делать резервное копирование шаблона!

Заходим в Административную панель = > Шаблон = > Изменить HTML. Ставим курсор мышки в окно шаблона и сочетанием клавиш Ctrl +F ( раскладка клавиатуры не имеет значения) вызываем окно поиска. Находим участок кода:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'> <b:widget id='Header1' locked='true' title='Я блоггер (заголовок)' type='Header'

Изменяем его на:

<b:section class='header' id='header'><b:widget id='HTML666' locked='false' type='HTML'/><b:widget id='Header1' locked='true' title='Я блоггер (заголовок)' type='Header'

Тitle в коде измените на свой.

Открываем вкладку Дизайн и смотрим, над заголовком должен появится новый гаджет HTML/JavaScript. Добавляем в него нужный код.

Что бы настроить гаджет заходим снова в шаблон блога и добавляем стиль СSS. Перед ]]></b:skin> вставляет код:

#header {position: relative;}#HTML666 { z-index: 200; position: absolute; top: 10%; right: 2; }

Настройки:

top- отступ сверху
right- отступ справа

Второй вариант как добавить гаджет HTML/JavaScript в шапку над заголовком

Все делаем как описано выше. Находим строку в коде:

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

изменяем на

<b:section class='header' id='header' maxwidgets='2' showaddelement='yes'>

maxwidgets='2' это число гаджетов в шапке блога.