Стильный правильный PHP редирект с таймером обратного отсчёта

Автор: Admin    Категория: Основы / Шаблоны    Теги:  Редирект    Дата: 22-03-2011, 22:32
Стильный правильный PHP редирект с таймером обратного отсчётаКак сделать правильный PHP редирект с таймером обратного отсчёта на javascript
Когда я узнал, что мой домен WebOstrovok.ru оказался вовсе и не мой - возникла необходимость срочно клонировать сайт и делать все уже правильно.
Новый сайт создан и теперь на старый нужно поставить перенаправление и оно должно быть правильным.

Проще всего переадресацию можно сделать с помощью мета тега Refresh или с помощью javascript.
Минусом переадресации тегами и javascript является то, что в случае переезда сайта, смены домена, или перемещении файлов, статья для пользователя остаётся той же, а для поисковых систем - нет. Поэтому при переезде сайта категорически нельзя использовать эти методы, так как основной сайт выпадет из результатов поиска из-за своей пустоты, а новый сайт не попадёт в результаты из-за "плагиата". Поисковые системы оценят сайт как плагиатчик и этот сайт украл содержание с вашего предыдущего сайта. Плагиатчики значительно опускаются в результатах поиска. Не делайте ошибок.

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

Для редиректа на php используется функция header - с добавлением заголовка Location либо Refresh.

Минимальный код правильного редиректа:

<?php
header("HTTP/1.1 301 Moved Permanently");
header("Location: http://новый адрес сайта");
exit();
?>


Преимущество этого способа состоит в том, что можно с этим заголовком параллельно отправить статусы сервера, например, 301 Moved Permanently, что укажет поисковым ботам о перемещении ваших материалов.
ВАЖНО!!! Заголовки функцией header нужно отправлять до любого вывода текста в браузер! Даже перед <?php не должно быть пробелов!

Но мы будем использовать перенаправление с 10 секундной задержкой и красивым информационным блоком для пользователей, чтобы информировать, что сайт переехал.

Простейший PHP код редиректа с задержкой:

<?php
header("HTTP/1.1 301 Moved Permanently");
header('Refresh: 10; url=http://новый адрес сайта');
echo 'Через 10 сек. вы будете перенаправлены на новую страницу.';
exit();
?>


Но нам хочется ещё и оформить красиво, а не просто видеть сухую строчку 'Через 10 сек. вы будете перенаправлены на новую страницу.'
Создаем файл с расширением РНР например index.php и вставляем туда наш код:

<?php
header("HTTP/1.1 301 Moved Permanently");
header('Refresh: 10; url=http://megaweb.su/');
echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\n"; 
echo "<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"ru\" lang=\"ru\">\n"; 
echo "    <head>\n"; 
echo "        <title>http://megaweb.su/</title>\n"; 
echo "        <meta http-equiv=\"Content-Type\" content=\"text/html; charset=windows-1251\" />\n"; 
echo "        <style type=\"text/css\">\n"; 
echo "body { background:#FFC; }\n"; 
echo "h1 { text-align:center; color:#333; }\n"; 
echo "span, h1 a { color:#930; text-shadow: 0 0 4px #ccc, 0 -5px 4px #ff3, 2px -10px 6px #fd3, -2px -15px 11px #f80, 2px -18px 18px #f20; }\n"; 
echo ".bord { margin: 150px auto; background: #666; width:800px; height: auto; border:10px solid #930; border-radius:30px; -webkit-border-radius:30px; -moz-border-radius:30px; box-shadow: 0 0 10px 2px #1A3457; -webkit-box-shadow: 0 0 10px 2px #1A3457; -moz-box-shadow: 0 0 10px 2px #1A3457; }\n"; 
echo "h1, p { font: bold 1.7em/2em \"Trebuchet MS\", Arial, Helvetica, sans-serif; color: #000; text-shadow: 0px 1px 1px #fff; padding:10px 40px; }\n"; 
echo "</style>\n"; 
echo "        <script type=\"text/javascript\">\n"; 
echo "function countdownRedirect(url, msg)\n"; 
echo "{\n"; 
echo "   var TARG_ID = \"COUNTDOWN_REDIRECT\";\n"; 
echo "   var DEF_MSG = \"Redirecting...\";\n"; 
echo "\n"; 
echo "   if( ! msg )\n"; 
echo "   {\n"; 
echo "      msg = DEF_MSG;\n"; 
echo "   }\n"; 
echo "\n"; 
echo "   if( ! url )\n"; 
echo "   {\n"; 
echo "      throw new Error('You didn\'t include the \"url\" parameter');\n"; 
echo "   }\n"; 
echo "\n"; 
echo "\n"; 
echo "   var e = document.getElementById(TARG_ID);\n"; 
echo "\n"; 
echo "   if( ! e )\n"; 
echo "   {\n"; 
echo "      throw new Error('\"COUNTDOWN_REDIRECT\" element id not found');\n"; 
echo "   }\n"; 
echo "\n"; 
echo "   var cTicks = parseInt(e.innerHTML);\n"; 
echo "\n"; 
echo "   var timer = setInterval(function()\n"; 
echo "   {\n"; 
echo "      if( cTicks )\n"; 
echo "      {\n"; 
echo "         e.innerHTML = --cTicks;\n"; 
echo "      }\n"; 
echo "      else\n"; 
echo "      {\n"; 
echo "         clearInterval(timer);\n"; 
echo "         document.body.innerHTML = msg;\n"; 
echo "         location = url;      \n"; 
echo "      }\n"; 
echo "\n"; 
echo "   }, 1000);\n"; 
echo "}\n"; 
echo "</script>\n"; 
echo "    </head>\n"; 
echo "    <body onload='countdownRedirect(\"http://megaweb.su/\", \"Redirecting...\")'>\n"; 
echo "        <div class=\"bord\">\n"; 
echo "            <h1>Сайт WebOstrovok.ru переехал и доступен по новому адресу\n"; 
echo "                <a href=\"http://megaweb.su/\" title=\"Создать сайт веб дизайн\">http://megaweb.su/</a>\n"; 
echo "            </h1>\n"; 
echo "            <h1>Через 10сек. Вы будете автоматически перенаправлены на новый адрес\n"; 
echo "                <br />\n"; 
echo "                Если перенаправление не произошло - то, пожалуйста перейдите по ссылке\n"; 
echo "                <br />\n"; 
echo "                <a href=\"http://megaweb.su/\" title=\"Создать сайт веб дизайн\">http://megaweb.su/</a>\n"; 
echo "                <br />\n"; 
echo "                <strong>Вы будете перемещены через\n"; 
echo "                    <span class=\"counter\" id=\"COUNTDOWN_REDIRECT\">10</span>\n"; 
echo "                    сек.</strong>\n"; 
echo "            </h1>\n"; 
echo "        </div>\n"; 
echo "    </body>\n"; 
echo "</html>\n";
exit();
?>


ВАЖНО!!! Заголовки функцией header нужно отправлять до любого вывода текста в браузер! Даже перед <?php не должно быть пробелов!

Получаем правильный 301 редирект на PHP с красивым информационным блоком на CSS3 и таймером обратного отсчёта на javascript

Вот такой получился 301 винегрет.
Ссылки, естественно, меняете на свои и не трогаем экранированные обратным слешем кавычки!

НО! Такой редирект годится если сайт переносится без сохранения старой структуры, т.е. как бы создаётся заново. Например - сайт получился небольшой, опыта мало, где-то накосячил, и при переезде хочется уже сделать всё правильно, исправить старые ошибки, что-то подкорректировать. И получается, что сайт как бы создаётся заново.

А если сайт просто меняет доменное имя и переносится с сохранением старой структуры - то тут нужен редирект с сохранением передаваемой страницы и параметрами вызова, минимальный код такой:

<?
$ref=$_SERVER['QUERY_STRING'];
if ($ref!='') $ref='?'.$ref;
header('HTTP/1.1 301 Moved Permanently');
header('Location: http://новый адрес сайта/'.$ref);
exit();
?>


Смотреть пример правильный PHP редирект с таймером обратного отсчёта на javascript
Версия для печати
  • 100
     Просмотров: 16 961      Комментариев: 6   

Понравилась новость Стильный правильный PHP редирект с таймером обратного отсчёта на MegaWeb.su? Сохрани в закладках или распечатай!


Информация

Внимание!

Если копируете мой материал - будьте добры оставлять ссылку на источник MegaWeb.su пожалуйста, или поставьте на свой сайт мою кнопочку.
Уважайте чужой труд! И Вам хорошо - и мне приятно, это стимулирует дальнейшее развитие проекта!

Другие новости по теме

Обратите внимание, возможно Вас заинтересуют другие публикации, похожие на Стильный правильный PHP редирект с таймером обратного отсчёта из категории Основы / Шаблоны

№ 6 Автор: Admin 26 августа 2011 22:18

 Вот такой я - Admin

Admin
Администраторы
комментариев
публикаций

Статус: Пользователь offline
Цитата: Alexufo
А притом, что проверять нужно что человек говорит) в IE действительно не пашет редирект потому что не по госту залоголовок сформирован.
9 IE если что)

Если не работает используйте редирект без таймера:
<?php
header("Location: http://новый адрес сайта", true, 301);
exit();
?>

Это работает всегда.


----------------------------------------------------
Пойми что тебе нравится и сделай это своей работой!

  • Нравится
  • 0
    

№ 5 Автор: Alexufo 24 августа 2011 11:48

 Вот такой я - Alexufo

Alexufo
Гости
комментариев
публикаций

Статус:
Admin,
Что не работает? В каком IE? И причём тут вообще браузер, это PHP редирект - скрипт, который выполняется на сервере, а не в браузере.

А притом, что проверять нужно что человек говорит) в IE действительно не пашет редирект потому что не по госту залоголовок сформирован.
9 IE если что)

  • Нравится
  • 0
    

№ 4 Автор: Admin 22 июля 2011 13:00

 Вот такой я - Admin

Admin
Администраторы
комментариев
публикаций

Статус: Пользователь offline
Цитата: corke
В IE не работает.

Что не работает? В каком IE? И причём тут вообще браузер, это PHP редирект - скрипт, который выполняется на сервере, а не в браузере.
Если вы про внешний вид оповещения - то любителям IE неповезло, только IE9 начинает что-то поддерживать, а до IE9 про CSS3 вообще можно забыть. Ставте нормальный браузер и радуйтесь красоте интернета.


----------------------------------------------------
Пойми что тебе нравится и сделай это своей работой!

  • Нравится
  • 0
    

№ 3 Автор: corke 22 июля 2011 06:00

 Вот такой я - corke

corke
Гости
комментариев
публикаций

Статус:
В IE не работает.

  • Нравится
  • 0
    

№ 2 Автор: Admin 29 июня 2011 18:01

 Вот такой я - Admin

Admin
Администраторы
комментариев
публикаций

Статус: Пользователь offline
Цитата: Arseo
Спасибо, пригодилось!

На здоровье, для себя делал, мне тоже пригодилось smile


----------------------------------------------------
Пойми что тебе нравится и сделай это своей работой!

  • Нравится
  • 0
    

№ 1 Автор: Arseo 29 июня 2011 15:32

 Вот такой я - Arseo

Arseo
Гости
комментариев
публикаций

Статус:
Спасибо, пригодилось!

  • Нравится
  • 0
    

Информация

Внимание!

Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.

Лента новостей
RSS 2.0

Лента новостей сайта megaweb.su

Блок программ Популярный софт

Коды блока "Популярный софт":

Фиксированный
windows-1251

код блока 1

<script type="text/javascript" src="/softblok/softblok.js" charset="windows-1251"></script>

Резиновый
windows-1251

код блока 2

<script type="text/javascript" src="/softblok/softblok2.js" charset="windows-1251"></script>

Резиновый
UTF-8

код блока 3

<script type="text/javascript" src="/softblok/softblok1.js" charset="utf-8"></script>

Глобус