Установка шаблона, состоящего из картинки-фона

Кроме шаблонов, описанных в предыдущем посте (в формате xml), часто можно встретить шаблоны в виде картинки-фона для блога (+ иногда прилагается картинка для заголовка). Особенно популярны такие шаблоны, как мне показалось, среди скрапбукеров…
Примером может служить мой шаблон (у меня в блоге они будут под тегом "simple") из элементов наборов от Bel Vidotti Scraps:
image


Скорее всего, вместе с картинкой-фоном будет и инструкция по установке. Я постаралась расписать очень подробно (уже публиковала инструкцию в своем блоге, теперь просто копирую сюда):

  1. Нажмите "Настроить" в правом верхнем углу вашего блога (вы должны быть залогинены!)


  2. Жмите Выбор нового шаблона и установить шаблон Minima! (Вы не потеряете ваши виджеты/панели). Сохраните.


  3. Идите в Элементы страницы и жмите "Добавить гаджет"
  4. Найдите "HTML/Java Script" и нажмите "Добавить в блог"
  5. В окне настроек вставьте следующий код:
    <style type="text/css">body {background-image: url(адрес картинки); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style>

  6. Выберите понравившийся шаблон и скопируйте ссылку на него. Именно эту ссылку и надо указать в коде вместо слов "адрес картинки".
Кроме указанного кода я буду еще иногда советовать указать цвет фона страницы. Для этого перед закрывающей скобкой } надо будет дописать:

background-color: #код_цвета;
Понятно, что вместо слов “код_цвета” надо будет подставить выбранный/предложенный цвет.
Для установки картинки-заголовка (другими словами, “шапки” блога), которые часто предлагаются вместе с картинкой-фоном (в одном стиле), заходите в пункт “Элементы страницы” и у заголовка нажимайте “Изменить”.
image
В открывшемся окне настроек загружайте вашу картинку либо с компьютера, либо указав ей адрес в интернете. Если картинка предполагает, что кроме нее должен быть виден заголовок вашего блога, указывайте место размещения – после названия и описания, в противном случае – вместо…
image
В чем минусы такого подхода (использование фоновой картинки)?
  • На мониторах с разным разрешением будет смотреться по разному! У кого-то картинка обрежется, у других будут пустые места.




  • Размер, а, следовательно, и вес картинки довольно велик. Если соединение медленное, то картинка будет грузиться довольно долго.


  • Изображение-фон расположено на неком фотохостинге, у которого могут быть перебои в работе или он может вообще заблокировать аккаунт автора шаблона/прекратить существование/быть взломанным (надеюсь, конечно, что не будет таких неприятных моментов)… Так что на всякий случай сохраните фон себе на компьютер (загрузите на свой фотохостинг…)

Зато такой шаблон проще сделать самим (а, точнее, проще объяснить, как это делать!), но об этом в другой раз.
Вот, вроде и все, о чем хотела рассказать… Возможно, что-то еще вспомню и допишу… Если что-то упустила – свистните :)
О создании шаблонов будет отдельный пост.


18 коммент.:

Ольга Олза комментирует...

Супер! давно искала такой материал!!
Надеюсь. что получится сделать подобное по Вашей инструкции...
С уважением,Ольга
www.ya-ok.tk

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

Большое спасибо! Мне Вы тоже очень помогли!

Olga Gorchichko комментирует...

я очень рада! :)

Елена ( Helenasa) комментирует...

Здравствуйте! Нашла у Вас на сайте много интересного, в ближайшее время реализую в своем блоге. Единственное, устанавливала шаблон разными путями, и, к сожалению, в блоге никаких изменений не происходит. Помогите, пожалуйста.

Olga Gorchichko комментирует...

Здравствуйте, Елена. На каком блоге не получается установить? Попробуйте установить, как я в этом посте пишу, и киньте мне ссылку. Я гляну.

Елена ( Helenasa) комментирует...

Ольга, спасибо за ответ! Разобралась. Ссылка на шаблон была некорректна. Но я сделала даже больше, фон прописала в HTML. До этого счастливого момента пришлось многое почитать, изучить. Теперь дело за остальным: установить шапку и все остальное. Спасибо! Мой блог: http://dashinamama.blogspot.com/

Olga Gorchichko комментирует...

отлично :) успехов

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

Спасибо за объяснения!!! Вы мне очень помогли!

Olga Gorchichko комментирует...

я очень рада! :)

Кристина комментирует...

Огромное Вам спасибо за Ваш труд,для всех нас.

Инна комментирует...

Спасибо большое!

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

Большое спасибо за такой подробный урок!

Анонимный комментирует...

Спасибо!

Валентина комментирует...

Очень важная и необходимая статья! Путем ошибок ,проб ,экспериментов,прочитав много информации-я установила фон в своем блоге (не помню,в который раз...)
А у вас так все подробно и понятно описано! и столько необходимой информации,для тех кто только начинает создавать свой блог.Спасибо за ваши статьи!
Пошла изучать остальные.Думаю,я еще очень много найду важного и необходимого для себя.

Olga Gorchichko комментирует...

Валентина, я очень рада, если мои записи окажутся полезными :)

Лилия комментирует...

Оля здравствуйте, прочитала ваш пост, попыталась у себя установить, но, почему то картинка у меня наполовину, помогите пожалуйста....Спасибо, что предоставили информацию.ipushok.blogspot.com

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

Здравствуйте , Оля ! Спасибо большое за ваш материал !
Но , наверное я что-то не то делаю . Очень нравится вот этот шаблон
http://cute-bloglayouts.blogspot.com/
Но никак не получается его поставить . Помогите чайнику !

Olga Gorchichko комментирует...

frosenka, там надо написать автору, чтобы получить код шаблона

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