BloGGood.ru

Блог Костаневича Степана

До Нового Года осталось:

Блог на разные темы, seo-оптимизация, раскрутка сайта, создание сайта, вкусные эффекты для сайта и многое другое…

Главная » Эффекты для сайта » Меняется шапка сайта по времени

Меняется шапка сайта по времени

2012-10-28 / Вр:16:09 / просмотров: 5111

Еще один эффект для сайта, который поможет улучшить вид вашего сайта. Шапка сайта меняется в зависимости от времени на часах у пользователя на компьютере.  Короче говоря, веб-мастер устанавливает в коде время для ночи, утра , дня, вечера. Вот по этому времени и будет меняться шапка сайта.
Давайте тогда  все просмотрим на примере.

Пример установки кода буду показывать для WordPress. Если вы создавали сайт на html или php, тогда вам нужно делать это изменение там, где вы прописывали код шапки сайта.

Итак, начнем.
В Wordpress откройте  файл header.php
(Внешний вид > Редактор > header) 
 и ищем место, где выводится шапка вашего сайта или блога, например:

<div id="header"></div>

или

<div id="head"></div>

Далее добавляем к этому блоку класс «time-»:

class="time-<?php echo $time; ?>"

Теперь над выводом шапки сайта добавим функцию $now_hours:

<?php
$now_hours = date('G');
if($now_hours<8)
{
$time = 'night';
}
elseif($now_hours<12 && $now_hours>=8 )
{
$time = 'morning';
}
elseif($now_hours>=12 && $now_hours<17)
{
$time = 'day';
}
elseif($now_hours>=17 && $now_hours<=23)
{
$time = 'evening';
}
?>

Сохраните файл.

night - ночь,
morning - утро,
day - день,
evening - вечер.

В этой строке elseif($now_hours>=17 && $now_hours<=23меняем время.

Теперь откроем файл style.css и добавим нужную нам шапку, например:

/* Ночь */
 .time-night
 {
 background:url (/images/night.jpg);
 }
 /* Утро */
 .time-morning
 {
 background:url (/images/morning.jpg);
 }
 /* День */
 .time-day
 {
 background:url (/images/day.jpg);
 }
 /* Вечер */
 .time-evening
 {
 background:url (/images/evening.jpg);
 }

Сохраните файл.

Картинки night.jpg, morning.jpg, day.jpg, evening.jpg разместите в папке images, в вашей теме WordPress.

Меняется шапка сайта по времени.

Если вы все сделали правильно, то должно работать..... ;)

С Уважением Webmasterok2009

Понравился пост? Помоги другим узнать об этой статье, кликни на кнопку социальных сетей ↓↓↓

Получай обновления блога!!! Подпишись:

Популярные статьи:

2 Ответов на комментарий - Меняется шапка сайта по времени

  1. Антон

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

    Ответить

    Степан => автор блога

    Степан => автор блога отвечает:

    Спасибо за комментарий, Антон. Рад что информация на моем блоге интересная и полезная людям. Желаю вам творческих успехов.

    Ответить

Добавить комментарий

;-) :| :x :twisted: :smokes: :smile: :shock: :sad: :rose: :roll: :razz: :pop-corne: :oops: :o :mrgreen: :lol: :idea: :grin: :gazeta: :evil: :cry: :cool: :coffe: :arrow: :???: :?: :!:

Чтобы добавить в комментарий код HTML, PHP, CSS, JavaScript, нужно сделать так: [code] ваш код [/code]

Subscribe without commenting

Метки: ,

Мои цели на 2016 год:

1). Закончить тему «Bootstrap»

2). Закончить тему «Все про PHP и MySQL»

3). Довести количество статей до 600

4). Добиться стабильной посещаемости 2500 человек/сутки

5). Закончить все статьи, которые находятся в черновиках

6). Создать портфолио и мини интернет-магазин шаблонов

7). Создать книгу

8). Добиться стабильной посещаемости 3000 человек/сутки

9). Довести количество статей до 700

10). Увеличить число подписчиков до 250

Статистика по блогу

Количество записей на блоге: 669
Количество страниц на блоге: 20
Количество рубрик на блоге: 27
Количество меток на блоге: 71
Количество комментариев на блоге: 3663