n-wp.ru — блог о WordPress
Редирект через определенное время | n-wp.ru

Редирект через определенное время

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

Я решил закрыть один свой сайт. А чтобы не ставить посетителей в недоумение пустым экраном и показать, куда нужно переходить, решил сделать автоматический редирект с закрытого сайта на другой. Причем редирект не моментальный, а через определенное время, в течение которого посетителям показывается информационное сообщение о том, что этот сайт закрыт и они будут перенаправлены на другой сайт. Посмотрев бесплатные плагины в репозитарии WordPress, я не нашел ни одного, который бы отвечал моим требованиям. Поэтому решил самостоятельно сделать код редиректа. И вот что у меня получилось:

Редирект через определенное время

Делюсь с вами кодом этого редиректа — вдруг он нужен будет еще кому-нибудь.

Я решил создать полупрозрачный слой, который бы отображался поверх основного содержимого любой страницы сайта, с которого осуществляется редирект. Этот слой будет препятствовать доступу к контенту, но в то же время посетитель увидит, что он правильно попал на сайт. Информационное сообщение должно все время располагаться по центру экрана, в каком бы разрешении вы его не открыли. Для этого я внедрил javascript:

Этот скрипт располагает блок с классом white всегда по центру окна.

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

30000 — это 30 секунд времени, в течение которых прогресс-бар двигается по отведенной ему длине. Если вы измените ширину окна браузера, то скрипт пересчитает скорость, замедлив или ускорив движение.

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

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

Ну и, собственно, сам код информационного блока, отображаемого на сайте с редиректом:

И код java-скрипта, создающего автоматический редирект через определенное время:

В этой части кода указан адрес, на которой осуществляется редирект, и время (30000 — это 30 секунд).

Для того, чтобы редирект осуществлялся с любой страницы сайта, я поместил все эти части кода последовательно в файл footer.php используемой темы оформления непосредственно перед закрытием тега [codei][

].

tiaurus

Являюсь создателем n-wp.ru — блога о WordPress для новичков. Мне интересно многое, поэтому еще я сделал 123-box.ru — блог о программах для Windows, и tiaurus.info — блог о красоте.

Комментировать

/* ]]> */