Обновлено: 27.03.2020 г.
Всем привет. Просматривала свои записи в блоге и вижу, что до сих пор не написала пост, как изменить пугающий черный фон лайтбокс на более приветливый.
Многие блоггеры используют эту функцию для увеличения изображений. С одной стороны, на черном фоне картинки заметно выделяются, но при открытии, как будто попадаешь в мир теней. Мне очень не нравится, хотя дело вкуса. Давайте рассмотрим примеры оформления и настроим веселее фон:
Вкладка тема, делаем резервную копию. Нажимаем изменить HTML и находим строку <b:skin>...</b:skin>. Раскройте секцию CSS стилей, жмите на стрелку слева. Код CSS для оформления фона вставить выше строки ]]></b:skin>. Кто не знает, где найти строку, почитайте пост Как быстро и красиво оформить текст в блоге.
Примеров можно показать много. Вместо цветового фона вставить картинку
Самое простое оформление, белый фон
.CSS_LIGHTBOX_BG_MASK {
background-color:#f8f8ff !important; }
Основной зеленый и фон нижней границы
.CSS_LIGHTBOX_BG_MASK {
background-color: rgba(31, 124, 35, 0.28) !important;}
.CSS_LIGHTBOX_FILMSTRIP {
background-color: rgba(81, 151, 95, 0.79) !important;}
Светлый голубой и фон нижней полосы
.CSS_LIGHTBOX_BG_MASK {
background-color: #84b6bf !important;}
.CSS_LIGHTBOX_FILMSTRIP {
background-color: #404040 !important;}
Примеров можно показать много. Вместо цветового фона вставить картинку
.CSS_LIGHTBOX_BG_MASK {
background-image: url (адрес изображения) !important; }
Стиль CSS с фоном картинки и нижней границей
.CSS_LIGHTBOX_BG_MASK {
background-image: url (адрес картинки) !important;}
.CSS_LIGHTBOX_FILMSTRIP {
background-color: #404040 !important;}
У кого в блогах много фотографий, изображений интерьера, по колдуйте и оформите в своем индивидуальном стиле. Тем более, что есть возможность оформить фон для каждой страницы разный. В редакторе блоггер перейти по вкладке HTML и внизу страницы вставить стиль CSS
Кому стили CSS трудно вставить в шаблон, код ниже или свой вариант оформления, можно вставить дизайн добавить гаджет для всех страниц, сохраните внизу макета блога.
А у меня на сегодня вся информация. Вопросы задавайте в комментариях или в меню форма для связи. Удачи и всего доброго.
Почитайте другую информацию:
<style>код CSS</style>
<style>
.CSS_LIGHTBOX_BG_MASK {
background-color:#f8f8ff !important; }
</style>
Почитайте другую информацию:
- Горизонтальное меню для блогов блоггер на сторонних шаблонах;
- Скрыть navbar atom attribution с помощью CSS Сохранить гаджет без названия заголовка;
- Переместить или удалить заблокированный гаджет в макете блога blogspot;
- Скрыть виджеты на статических и страницах сообщений с помощью CSS;
- Причина неработающих настроек и функций в панели инструментов блоггер;
Рекомендуемый контент:
У меня почему-то не сработало. Фон так и остался чёрным. Может надо предварительно обнулить стили? Но я не знаю как.
ОтветитьУдалитьГалина здравствуйте. Какой у Вас шаблон. Тестировала во всех, работает, даже вставляла гаджетом. В "Корпорации" у меня и без CSS картинки открываются на белом фоне. Проверьте правильно ли скопировали, важна каждая точка. .CSS_LIGHTBOX_BG_MASK { Посмотрите точка есть вначале.
ОтветитьУдалитьЗдравствуйте, Оля! Скопировала аккуратно, с точкой. Шаблон Simple жёлтый
УдалитьГалина, посмотрите по ссылке, шаблон такой? Нажмите на картинку, все работает. Код CSS добавила гаджетом. Где-то ошибка, посмотрите еще раз внимательно.
ОтветитьУдалитьhttp://ovp23.blogspot.com/2016/02/blog-post.html
Да, гаджетом и у меня получилось, спасибо!
ОтветитьУдалитьГалина, все таки почему в шаблоне не сработал код, я вставляла в шаблон, рабочий.
ОтветитьУдалитьОль, у меня что-то вообще непонятное происходит. Я целый день потратила, пытаясь исправить цвет заголовков гаджетов. В шаблоне вставляю исправления, сохраняю - и ничего не меняется, а в визуальном дизайнере шаблонов у меня погасли кнопки "Применить к блогу" на всех блогах и во всех браузерах. Задала вопрос в группе "Blogger Форум. Вопросы и ответы", даже скриншот вставила, и никто не ответил. Даже просмотров, кроме моих собственных нет. Я уже паникую, т.к. совсем не знаю - в чём причина такого.
ОтветитьУдалитьГалина, кнопка "Применить к блогу" становится активной, когда измените что-то в настройках дизайна. Попробуйте изменить цвет заголовка например, кнопка должна активироваться.
ОтветитьУдалитьПо цвету заголовков желательно ссылку на скриншот шаблона, что и куда вставляли.
Ой, точно! Кнопка активизировалась, но я рано радовалась. Как и в прошлый раз у меня - какой-то глюк при корректировке заголовка гаджетов. Изменения вносятся не в гаджет, а в верхний колонтитул (дата сообщения)
Удалитьhttp://i-fotki.info/19/7a78307272ba4a9c33ddad216136edcd5bdb65238496261.png.html
Я потому и полезла в шаблон
http://i-fotki.info/19/2d0ebaa22fd1abb7fb5012e02407c57b5bdb65238496261.png.html
Галина, написала на почту. Посмотрите для начала адрес. Часто и много глюков в блоггер из-за неправильного адреса. Отпишитесь.
ОтветитьУдалитьСпасибо Вам, добрый человек! Я уже получила и ответила. :)
ОтветитьУдалить