2 гаджета в шапке блога на Blogger

источник:блога Я блоггер.

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

Нестандартное размещение виджетов в шаблоне (теме) blogger

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

Заходим в Административную панель = > Шаблон = > Изменить HTML. Находим участок кода:

<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' это число гаджетов в шапке блога.