Многие используют шаблоны для блоггер с слайдами, при помощи java скриптов. Однако, что если Вы хотите чтобы шапка Вашего блога, либо его фон изменялись при каждом обновлении страницы, или к примеру Вашему блогу подошли бы несколько картинок в качестве фона, и Вы хотите показать их все, тогда следующие инструкции придутся Вам по вкусу.
Итак как сделать изменяющуюся картинку в шапке блога.
В моем блоге есть статьи как работать и как создать уникальную шапку для блога, для этого Вам необходимо почитать статью под названиемСоздаем уникальную шапку для блога.
1. Создаем необходимое количество картинок для шапки, которые подходят по размеру и тематике Вашему блогу.2. Загружаем картинки на хостинг. Если у Вас нет хостинга тогда читайте следующие статьи о том где хранить файлы:
Бесплатный хостинг или где хранить файлы для блоггера,Бесплатный хостинг для блоггер, Бесплатный хостинг на 2 гб от DropBox
3. После того как загрузили картинки на свой хостинг, заходим в Настройки/Дизайн/Добавить гаджет и выбираем HTML/Java Script в него вставляем следующий код:<script type="text/javascript">
var banner= new Array()
banner[0]="Image01URL"
banner[1]="Image02URL"
banner[2]="Image03URL"
banner[3]="Image04URL"
banner[4]="Image05URL"
banner[5]="Image06URL"
banner[6]="Image07URL"
banner[7]="Image08URL"
banner[8]="Image09URL"
banner[9]="Image10URL"
var random=Math.floor(10*Math.random());
document.write("<style>");
document.write("#header {");
document.write(' background:url("' + banner[random] + '") no-repeat top left;');
document.write(" }");
document.write("</style>");
</script>
Редактируем код:
а) Вместо Image01URL вставляем ссылку на картинку.
б) Скрипт будет в случайном порядке выбирать картинки при каждом обновлении страницы.
в) Если у Вас меньшее количество картинок, оставьте необходимо количество ссылок, и измените цифру 10 на цифру равную количеству Ваших картинок.
Изменяющийся фон блога.
Если Вы хотите добавить одну картинку в качестве фона блога, то найдите следующий тэг:body {
background:
после двоиточия в Вашем блоге будет идти либо код цвета (#010287;) либо ссылка (url(http//…….);) Заменя код цвета на ссылку с картинкой у Вас в блоге появиться Ваш фон.
А теперь как сделать так, чтобы Ваш фон изменялся.
проделываем все теже шаги, только вставляем немного другой скрипт:
<script type="text/javascript">
var banner= new Array()
banner[0]="Image01URL"
banner[1]="Image02URL"
banner[2]="Image03URL"
banner[3]="Image04URL"
banner[4]="Image05URL"
banner[5]="Image06URL"
banner[6]="Image07URL"
banner[7]="Image08URL"
banner[8]="Image09URL"
banner[9]="Image10URL"
var random=Math.floor(10*Math.random());
document.write("<style>");
document.write("body {");
document.write(' background:url("' + banner[random] + '") repeat center center;');
document.write(" }");
document.write("</style>");
</script>
Редактируем код аналогично предыдущему. только здесь важное значение имеет расположение картинки, если Ваша картинка маленькая и Вы хотите чтобы она повторялась оставьте Repeat, если у Вас большие картинки и они заполняют весь фон Вашего блога то вместо repeat вставьте no-repeat fixed
Надеюсь Вам понравилась данная статья.