суббота, 23 августа 2008 г.

Делаем трехколоночный "подвал" в Blogger

Спонсор поста: Материальная помошь в срочный выкуп квартир.

Вольный перевод оригинального поста.

Хотя специалисты многие специалисты по юзабилити и считают что в «подвал», засовывается всякая дрянь, потому что далеко не каждый читатель дойдет до конца страницы, нынче, мода меняется. Достаточно посмотреть блоги ведущих западных блоггеров, чтобы убедиться в том, что «подвал» играет не последнюю роль.

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

В Wordpress, насколько я знаю, проблема решается довольно просто, но когда я захотел себе сделать трехколоночный подвал в Blogger, пришлось серьезно потерзать Google, и решение было найдено.

Проблема решается в 4 шага:

Шаг 1. Традиционно, нужно сохранить в надежное место шаблон. Заходим во вкладку «Макет», выбираем «Изменить HTML», далее – «загрузить шаблон».

Шаг 2. Если у вас в «подвале» (footer) есть виджеты, переместите их пока на боковую панель. Это делается временно, чтобы они не удалились, потом когда шаблон будет изменен, можно опять вернуть виджеты из side-bar в «подвал».

Шаг 3. Возвращаемся во вкладку «Макет», выбираем «Изменить HTML». Внимание! Галочку «расширить шаблон виджета» ставить не нужно!
Находим следующую секцию (должна располагаться почти в самом низу кода):

div id='footer-wrapper'
b:section class='footer' id='footer'/
/div

Примечание: автор говорит о том что в зависимости от шаблона, лексика может немного отличаться, вместо 'footer-wrapper', может быть "footer-wrap" или "footer". В моем случае было последнее.

В любом случае нас интересует выделенное красным, которое следует заменить на следующий код:



Шаг 4. После того как сохранили шаблон,
возвращаемся во вкладку «Макет», выбираем «Изменить HTML»,
находим закрывающий тэг:  
</b:skin>

и вставляем перед ним следующий код:

#footer-column-container {
clear:both;
}

.footer-column {
padding: 10px;
}


Сохраняем, шаблон – все готово! Что вышло, можно посмотреть у меня внизу, правда, я пока еще не наладил свой «подвал», но кое-что там обозначил, чтобы вам проиллюстрировать, а мудрить буду завтра -).

Новости акции «заКЛАДкоискатели»: акция движется, участников все больше, кто еще не присоединился – добро пожаловать!

Чтобы не пропускать мои «экзекуции», можно подписаться на RSS,
а если понравился пост – добавить в закладки.

Еще читать:

Как увеличить поисковый трафик на Blogger

Меняем домен blogspot на бесплатный co.cc
54 воодушевляющих и оригинальных шаблонов для Blogger
14 полезных виджетов и скриптов для сервиса Blogger




Читайте по теме