Как убрать боковую панель на страницах в Блоггере.

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

Мы уберём сайдбар (боковые колонки), разместим контент строго по центру, поменяем цвет фона и уберём комментарии -  если нужно.

Вариант 1. Сразу оговорюсь, используя этот способ, мы избавляемся от сайдбара на всех статичных страницах сразу, кроме главной. Посмотрите здесь, что должно получиться в итоге. Если нужно сделать на одной конкретной - разберём ниже.

Обязательно сделайте резервное копирование, перед тем, как что-то менять в шаблоне. Или пробуйте сначала всё на тестовом блоге.

Шаг 1. Заходим во вкладку шаблон и находим тег <body>. В некоторых шаблонах такого нет, а есть строка такого вида
 <body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
Шаг 2. Копируем следующий код и устанавливаем его под этой строкой.
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<style>
.blog-pager, .footer, .post-footer, .feed-links, .sidebar { display:none !important;}
#main-wrapper {width: 95%; float:none; margin: 0 auto !important;}
</style>
</b:if>
Посмотрите, как это выглядит в шаблоне блога.


Сохраняем шаблон. В результате у нас статичные страницы будут выглядеть так.

убрать сайдбар

Полностью освободили боковую панель на всех страницах от гаджетов.

Шаг 3. Вероятно, захочется разместить содержимое строго по центру, чтобы избавиться от пустого пространства.  Тогда строку, отмеченную в коде синим цветом (на шаге 2) заменим на такую.
.main-inner .columns {width: 100%;padding-left:0 !important;padding-right:0 !important;}
В случае если у вас шаблон с двумя боковыми колонками, можно будет подгонять величину width: 95% до желаемого результата.

Шаг 4. Убираем комментарии. В черновике страницы справа  в настройках ставим соответственно галочки.


Шаг 5. Изменить цвет фона отдельной страницы. Тут всё проще простого. В черновике страницы переходим в режим HTML и в самом начале или конце вставьте следующий код CSS.
<style type="text/css">
.content-inner {background-color: orange;}
</style>
Здесь не нужно использовать какие-то условные теги. Он будет работать на конкретной странице, не затрагивая другие. Так что с помощью него можно разукрасить все статичные страницы в разные цвета, меняя лишь значение orange. Как изменить фон конкретного сообщения написано здесь.

Вариант 2. Очень простой, которым поделилась Ольга Протасова в этом сообщении. Я лишь немного повторюсь за ней.

Нужно сначала определиться -  хотите освободить всю боковую панель на статичных страницах или оставить всё же какой-то нужный гаджет. В любом случае нам понадобится знать ID гаджетов, которые нужно убрать. Заходим во вкладку шаблон выбираем нужные гаджеты и нажимаем изменить. Вверху в конце строки где указан номер блога, есть строке идентификатор гаджета. Смотрите скриншот.


Так скопируйте все ID виджетов в блокнот. Затем идём на страницу, которую хотим освободить полностью от сайдбара или оставить нужное, переходим в режим HTML и прописываем такой код CSS так же как на шаге 5 в первом варианте.
Пример.
<style>
#HTML1,
#HTML2,
#HTML4,
#Label1  {
display: none;}
</style>
Обновляем страницу.

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

здесь можно оформить подписку на новые шпаргалки

Введите Ваш email


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

  1. В шаблон я больше не вмешиваюсь, боюсь совсем блог угробить. А вообще, полезная штука, кому надо. Молодец ты, Вика, такие интересные штуковины знаешь и делишься. Генератор цвета, кстати, очень интересный, не видела еще такого.

    ОтветитьУдалить
    Ответы
    1. Наташа, Тут особых ковыряний в шаблоне и нет. Но ты хозяйка своего блога , что хочешь то и делаешь. Спасибо тебе за комментарий.

      Удалить

Пользовательский поиск
Foto Saya
My Photo