Главная / Уроки Wordpress / Смена шапки сайта в зависимости от времени суток

Смена шапки сайта в зависимости от времени суток

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

Забегая вперед скажу, что данный принцип позволит изменить не только шапку сайта, но и, допустим фон сайта. В разное время суток — разное оформление. Может быть очень интересно 😉

Для этого шапке сайта нужно добавить класс «vremya-» и до её вывода пишем маленькую функцию $now_hours которая определяет время суток, в итоге получается так: vremya-utro — vremya-noch.

Давайте рассмотрим этот способ на примере. Заходим в папку с темой и в файле header.php ищем DIV где выводится шапка сайта, например:

<div id="shapka"></div>

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

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

В итоге должно получиться так:

<div id="shapka" class="vremya-<?php echo $vremya; ?>"> </div>

Потом над выводом шапки (выше <div id=»shapka» >) добавляем функцию $now_hours:

<?php
$now_hours = date('G');
if($now_hours<8)
{
$vremya = 'noch';
}
elseif($now_hours<12 && $now_hours>=8 )
{
$vremya = 'utro';
}
elseif($now_hours>=12 && $now_hours<17)
{
$vremya = 'den';
}
elseif($now_hours>=17 && $now_hours<=23)
{
$vremya = 'vecher';
}
?>

После этого добавляем в файл стилей style.css данные для отображения картинки для каждого времени суток:

/* Ночь */
.vremya-noch {
background:url /images/noch.jpg ;
}
/* Утро */
.vremya-utro {
background:url /images/utro.jpg ;
}
/* День */
.vremya-den {
background:url /images/den.jpg ;
}
/* Вечер */
.vremya-vecher {
background:url /images/vecher.jpg ;
}

И наслаждаемся 🙂

Если этот прием применить к диву, который отвечает за фон сайта — будет меняться фон, да вообще, гулять так гулять! Можно хоть весь сайт сделать динамическим! 🙂

В следующем уроке расскажу как сделать смену шапки в зависимости от времени года.

В тему!

Как добавить водяной знак на фото в WordPress

Как добавить водяной знак на фото в WordPress

Сейчас вроде набирает популярность защита авторских прав. Расскажу как добавить водяной знак или копирайт или логотип на все ...

3 комментария

  1. Туториал очень полезный, автору спасибо, только хотел бы узнать. Как сделать плавный переход между вечером и ночью, днём и вечером и т.д.

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Лимит времени истёк. Пожалуйста, перезагрузите CAPTCHA.