Как оформить фон сообщения без изменений в теле шаблона



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

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

Итак, давайте перейдем к настройкам: в черновике blogger нажимаем настройки-сообщения и комментарии. Сверху увидите шаблон сообщения, нажмите добавить. В открывшемся поле вставьте самый простой код обычной рамки, к примеру такой:

<div style="border:2px dotted  #ccc;padding:10px;">ваш текст</div>
Смотрите скриншот

Справа вверху не забудьте сохранить настройки. Когда Вы нажмете создать сообщение, у Вас в редакторе уже будет настроенное оформление, типа рамочки. Там, где написано ваш текст (удаляете), ставите курсор и начинаете писать информацию.

Таким способом можно оформить формат сообщения любым фоновым цветом и своим изображением, добавляете в код рамки фон background:#f8f8ff; или адрес картинки background-image:url(адрес изображения);

<div style="background:#f8f8ff;border:2px dotted  #ccc;padding:10px;">ваш текст</div>

<div style="background-image:url(адрес изображения); padding:10px;">ваш текст</div>

Коды рамок можно посмотреть в моих постах здесь и  готовые рамки для оформления текста;

Так же можно оформить все новые сообщения в блоге, вставить аккуратную точечную или пунктирную рамочку. Почему я написала новые, потому что на уже опубликованные настройки не действуют.

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

После удаления кода все создаваемые сообщения будут без настроек в обычном формате.

У меня на этом вся информация. Пишите отзывы и задавайте вопросы по оформлению сообщений. Поделитесь со своими друзьями и знакомыми в социальных сетях. Всем пока, до новых встреч.

Посмотрите еще записи




Автор статьи ✎ Olga Protasova Выпуск ✹ 2/07/2015 Ярлыки ►


Открыть комментарии →

9 коммент. :

  1. Оленька приветик! Здорово, большое спасибо дорогая! Оленька, а с яндекса тоже можно ссылки на фон или картинку добавлять?

    ОтветитьУдалить
    Ответы
    1. Валюша здравствуй. Спасибо за отзыв. Да, в код можно вставить url адрес картинки или фона с яндекса, радикала или гугла.

      Удалить
    2. Оленька, у меня ещё один вопрос есть по поводу рамки изображения.. я когда то сделала рамку для своих изображений в блоге, но уже не помню как.. , вот теперь хочу убрать , не подскажешь как это сделать..?вот посмотри здесь http://valentinakozak.blogspot.ru/2015/02/blog-post.html голубая рамочка вокруг картинки..

      Удалить
    3. Валя,у тебя у всех картинок такая рамка. Это в шаблоне. Почитай по ссылке пост Оформление изображений в блоге с использованием CSS стилей

      http://www.bdblogov.ru/2014/08/Decor-pictures-in-blog-with-use-the-CSS-styles.html

      Внимательно посмотри CSS код и удали, не забудь на всякий случай резервное копирование шаблона.
      Я не думаю, что ты в редакторе сообщений каждый раз по вкладке HTML оформляла изображения.

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

      Удалить
    5. Валя я тоже помню твой красивый шаблон и боюсь, чтобы опять не повторилось подобное. Есть только один вариант безопасный. Сделай резервную копию шаблона блога и запомни путь к папке. Создай тестовый блог и загрузи этот шаблон. Затем попробуй изменить вот здесь
      .post-body img {
      padding: 8px;
      background: #4672ff;
      border: 1px solid transparent;

      Если получится, то уже с уверенностью измени в своем блоге.

      Удалить
    6. Валя, если ты в шаблоне ничего не меняла, может вставляла код в дизайнере шаблонов-дополнительно-добавить CSS. Посмотри, если есть удали и сохрани шаблон.
      Ну а если нет, то делай только РК.

      Удалить
    7. Оленька, для меня это тёмный лес... что такое РК ? Оленька , а у тебя есть возможность поговорить со мной по скайпу на эту тему? И как сделать тестовый блог? У меня есть резервный блог, http://photoshopotvalentiny.blogspot.ru/ правда я там давно не была... может быть на нём потренироваться?

      Удалить
    8. Валя РК-резервное копирование шаблона. Здесь я писала

      http://www.bdblogov.ru/2013/10/keep-up-template-on-computer.html

      Посмотрела блог, не трогай его. Создай новый блог (в гугл их можно до 100 создать), в заголовке напиши Демо или Тестовый, впиши адрес demo, если занят demo1. к примеру. В настройках закрой от индексации и чтения. Это будет твой личный блог.
      Затем загрузи на новый блог шаблон основного и можно экспериментировать.

      По скайпу уже давно ни с кем не говорила. Камера плохо работает. Номер olga58564, но надо договориться о времени.

      Удалить

Ув. читатели! Для вставки HTML кода в комментарии, воспользуйтесь в меню Генератором преобразования HTML кода.

 
Технологии Blogger.

Форма для связи

Имя

Электронная почта *

Сообщение *