вторник, 9 февраля 2010 г.

Работа над блогом. Исправляем дизайн.

Как только разобрался с функционалом и настройками блога, тут же захотелось сменить оформление. Из стандартных тем в Дизайн -> Выбрать новый шаблон ничего особо не приглянулось. Немного погуглив я нашел сайт с темами для блогов на blogspot'е. Потратив около двух часов на выбор той темки, которая будет отвечать моему извращенному вкусу, я остановился на следующей: Spiral Pad. Тема меня вполне устроила, она была успешно скачана и установлена. Но через пару часов обнаружился небольшой огрех дизайна.
Выглядел он следующим образом:
На лицо не состыковка фоновой картинки футера с фоном основной части. Еще раз сходив на сайт и посмотрев привью темы я убедился, что она такая, какая есть. И единственный способ все исправить, это взять в руки инструмент и подпилить.
В первую очередь я отправился в Дизайн -> Изменить HTML, где нашел ссылки на все бекграунды, что использовались в теме. Их оказалось всего три.
Верх:
#header-wrapper {
background:#52929E url(http://3.bp.blogspot.com/_iI6SgnnhWEM/S0D3ymR2GJI/AAAAAAAAA6I/Sytw0X5Pdcs/s1600/header.jpg) no-repeat scroll center top; }

Основная часть:
#content-wrapper {
background:transparent url(http://3.bp.blogspot.com/_iI6SgnnhWEM/S0D4MvZeu7I/AAAAAAAAA6Q/30_E7mAq77s/s1600/content-bg.gif) repeat-y scroll 0 0; }

Низ:
#footer {
background:transparent url(http://2.bp.blogspot.com/_iI6SgnnhWEM/S0D4eqrBkYI/AAAAAAAAA6Y/MYq0lEeGdEs/s1600/footer.gif) no-repeat scroll center bottom; }

Изображение footer.gif было слегка смещено, отсюда и поломанный дизайн. Способ решить проблему был только один. Запустить Фотошоп The Gimp и подогнать изображение под нужные нам размеры. 10 минут работы и результат готов.
Осталось залить изображение на какой нибудь стабильный хостинг и прописать в  #footer ссылку на исправленную картинку. В качестве такого сервиса я выбрал DropBox.
#footer {
background:transparent url(http://dl.dropbox.com/u/1660744/blog/spiral-pad-template/footer.gif) no-repeat scroll center bottom; }

Также в блоке #footer я поменял в свойстве width значение с 1015 на 1004, т.е. на то значение, которое соответствует размеру картинки.
Осталось нажать Сохранить шаблон и насладится результатом. Конечно у самой темы есть еще некоторые мелкие огрехи, связанные с цветом. Будет время и я попробую эти недочеты исправить.
UDP: Закинул на DropBox исправленную мной xml'ку.

2 комментария:

zwey+ комментирует...

Возможно придется отказаться от данной темы, слишком много правок...

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

Я вообще отказался от блогспота ибо на нормальном хоте держать блог или сайт как то более престижней. Хотя вот подумываю перейти как закончется оплата хоста на бесплатный http://www.0fees.net. Очень хороший забугорный хост, тольк что придется все ручками переносить.

Отправить комментарий