FAIL (the browser should render some flash content, not this).

intwayblog.netДвижок для блогаBlogger (Blogspot) → Растягиваем интерфейс блога на всю ширину окна

Растягиваем интерфейс блога на всю ширину окна

шаблоны для дизайна

Полагаю, многие заметили, что на широкоформатных мониторах при достаточно большом разрешении экрана, лента блога шириной в 700-800 пикселей смотрится неказисто - как тоненький ручеек посреди бескрайней равнины... Да, разработчики платформы Blogger (Blogspot) предоставили нам возможность растянуть интерфейс нашего блога аж до 1500 пикселей, но проблема в том, что это жестко заданный параметр, при увеличении которого блог будет смотреться плохо уже на мониторах с низким разрешением.

Как быть? Как растянуть наш блог на всю ширину окна браузера, но при этом угодить всей читательской аудитории, имеющей различные технические возможности? Об этом мы и поговорим в этой статье.

Метод, о котором я хочу вам рассказать в простонародье зовется резиновым. Суть его в том, что вместо постоянных величин - в нашем случае пикселей, мы будем использовать относительные - проценты. Благодаря этому, браузер сам оценивает ширину окна, принимая ее равной 100%, а потом обсчитывает размер остальных элементов, заданных в процентах, уже относительно этой ширины. Меняем ширину окна - браузер мгновенно снова все пересчитывает и размеры вновь подгоняются под изменившиеся условия.

Прежде всего откройте Дизайнер шаблонов Blogger (Дизайн->Дизайнер шаблонов) и в блоке "Регулировка ширины" задайте оптимальные параметры. Четко определитесь с шириной боковых панелей, поскольку для них мы оставим статичные, жестко заданные размеры. И определитесь с общей шириной блога - этот параметр нам потребуется, чтобы установить минимальные границы нашего дизайна, меньше которых блог, при уменьшении размера окна, схлопываться не будет. Последнее нужно для того, чтобы при критическом уменьшении размера окна наш дизайн не перекосило.

Итак, теперь откройте редактор шаблона (Дизайн->Изменить HTML) и найдите следующий код:

.content-outer, .content-fauxcolumn-outer, .region-inner {
min-width: $(content.width);
max-width: $(content.width);
_width: $(content.width);
}

Подсвеченную третью строку мы немного видоизменим. Вместо значения $(content.width) мы пропишем 100%. Если вы хотите, чтоб интерфейс вашего блога был растянут на меньшее значение, то просто замените цифру 100 на ту, что вам больше нравится.


Смотрите также:

  • Скругление углов, тени и прочие изыски в IE9 на Blogger

    Многие из моих читателей, использующих Internet Explorer, полагаю, заметили, что некоторые варианты оформления, описанные в моих статьях, имеют скругленные уголки, тени, свечение и кое-какие другие графические изыски

     
Источник: http://www.aboutblogger.ru/2012/02/rastyagivaem-interface-bloga-na-vsy


Milashka
Имя: Milashka
Обратилась к блогеру, который как раз писал подобную статью у себя в блоге. Он так мне помогал... проблемы возникали одна за другой... мне не удобно было просить его снова и снова..Сама, сколько ни ковыряла, только по-моему все портила... А зря..Оказывается ему было не трудно мне помогать, наоборот, как он утверждал, тем самым он набивал себе руку... Как сильно он меня ругал, за то, что я сразу к нему не обратилась и наковыряла там такого, что ему пришлось еще больше решать проблемы, чем, если бы я сразу к нему обратилась! Вывод я сделала сразу - если не знаешь, не лезь, лучше обратиться за помощью к человеку компетентному в этом вопросе!



Добавьте комментарий:
Ваше имя:
E-mail: