Почему я выбрал свой хостинг
Главная » Wordpress » Вы здесь =)

Апгрейд 404 — делаем красивую страницу об ошибке

Пару дней назад я случайно наткнулся на страницу 404 у одного блогера. Она полностью была на английском языке. Тут я решил посмотреть какая же страница у меня на блоге. А получилось, что она ничем не отличается. Я подумал, что это неправильно. И буквально вчера сделал небольшой апгрейд своей 404-страницы.

страница 404

Вы можете посмотреть на нее, например, скопировав и вставив этот URL http://sosnovskij.ru/111 в строку вашего браузера. А какая она у вас?

Вообщем что я там изменил? Я, во-первых, написал по-русски, что человек попал не туда и дал ссылку на главную. Это вполне естественно, но есть не на всех блогах. Во-вторых, ниже я вставил список самых популярных тем на блоге и посоветовал их прочитать.

Это, конечно, хорошо, а как это сделать-то? А сделать это обычно проще простого.

Как облагородить страницу 404 ошибки

1) Вначале надо скачать ваш файл со 404-страницей (путь domen.com/wp-content/themes/ваша-тема/404.php. Часто используется именно этот файл.

2) Затем перевести все что вы хотите на русский язык или дописать что-то свое. Надо переводить именно то, что непосредственно показывается на вашей странице 404. Редактируйте файлы wordpress в правильном редакторе. Я, например, использую NotePad++.

3) Загрузить файл обратно на сервер.

Программа минимум выполнена. Но это все равно обычная страница 404 только переведенная. Идти можно и дальше, а именно:

1) Вывод поиска по сайту

1
<?php include (TEMPLATEPATH . '/searchform.php'); ?>

2) Вывод популярных статей (если у вас стоит соответствующий плагин).

1
<?php akpc_most_popular(); ?>

3) Вывод категорий

1
<?php wp_list_cats(); ?>

Вообщем туда вставить можно все что угодно — ограничения только в вашей фантазии. Напоследок выкладываю забавные картинки 404 страниц.

веселая страница 404

смешная страница 404

страница 404

Те, которые пробовали и пытались, но у них ничего не вышло,  пишите в комментариях в чем проблемы. Я постараюсь помочь ;-).

1 звезда2 звезды3 звезды4 звезды5 звезд (2 голос., в среднем: 5,00 из 5)
Loading ... Loading ...

Дата: 19.01.2010
Получайте актуальные статьи по SEO, блоггингу и заработку в Интернете
прямо на ваш почтовый ящик. Уже более 3000 подписчиков!

Отзывов уже 79:

  1. 1. Андрей | 19 января 2010

    Все правильно. Страницу 404 надо делать «красивую». Вот у димка не особо blog.dimok.ru/1232e2ded, а у Шакина уже повеселей shakin.ru/1232e2ded. Так же видел и просто пустые страницы 404. У них наверно вообще нет такого файла в шаблоне :x

  2. 2. valeriy | www.betexpert.ru | 19 января 2010

    Простите, но может быть аПгрейд (upgrade) ? ;-)

  3. 3. Святослав | expee.ru | 19 января 2010

    Это конечно хорошо, можно оформить страницу ошибки (причем не только 404, но и 500, 403), но я думаю, что можно делать ее полегче. Совсем не нужно тянуть весь дизайн. Сейчас еще у многих пользователей медленный интернет и, если, у вас на сайте много баннеров, всякой графики и т.д., то он будет огорчен, когда узнает о том, что он грузил так долго, а такой страницы не существует.

    Например, хорошая страница ошибки на хабре: habrahabr.ru/asjdjashdjashd/

  4. 4. Duna | fire-game.ru | 19 января 2010

    А ещё можно банеры какие-нить влепить:) Адсенс правда вроде запрещает, но что-нибудь ещё наверняка можно.

  5. 5. Павел | www.shapranov.ru/blog | 19 января 2010

    Тоже хотел написать пост на эту тему)

    Посмотрите мою кстати ;)

  6. 6. Linar | www.url.by | 19 января 2010

    Павел, посмотрел Вашу страницу 404 улыбнулся. Прикольно :razz: Я тоже настроил у себя эту страничку: url.by/404.php. Только у меня еще и такие страницы имеются, например, url.by/article/7866 . То есть здесь когда-то была размещена статья, но она была удалена. Получается мне надо сделать редирект подобных страниц на url.by/404.php?

  7. 7. Sosnovskij | sosnovskij.ru | 19 января 2010

    valeriy, безусловно «П». Черт меня дернул. Спасибо, что сообщили ;)
    Павел, отличная страничка. Еще бы открывалась до конца :idea:

  8. 8. Sosnovskij | sosnovskij.ru | 19 января 2010

    Linar, да. Несуществующие страницы должны выдавать 404.

  9. 9. Linar | www.url.by | 19 января 2010

    Только программист из меня никакой, поэтому я не знаю как это сделать. Прочитав статьи, сделал вывод, что мне придется каждую страницу, которая была удалена, прописывать в .htaccess вот так: Redirect 301 /article/7866 url.by/404.php. Я правильно понял? Или можно это как-то по-другому сделать?

  10. 10. Павел | www.shapranov.ru/blog | 19 января 2010

    Sosnovskij, странно, у меня грузится)

    Linar, лучше спросить на каком-нибудь форуме в профильном разделе ;) Я сам в этом плохо разбираюсь, нужно не только чтобы 404 нормально выглядела, но и чтобы отдавала соответствующий код 404, а не 200.

  11. 11. Nick Rifmer | konkursy-stihov.narod.ru | 19 января 2010

    Интересно, скоро я наконец-то переделаю свою 404 ..)) никак взяться не могу =/

  12. 12. Linar | www.url.by | 19 января 2010

    Sosnovskij, еще надо исправить: «И буквально вчера сделал небольшой абгрейд своей страницы 404.»

  13. 13. Sosnovskij | sosnovskij.ru | 19 января 2010

    Павел, я имел в виду дырка, которая не до конца открыта ;)
    Linar, попробуйте в .htaccess вписать «ErrorDocument 404 url.by/404.php» (без ковычек). Может поможет.

  14. 14. Блог белорусской семьи | tuta.by | 19 января 2010

    Похвастаться супер оригинальной страницей 404 не могу, но все же она у меня существует уже как месяца полтора… кому интересно можете заглянуть tuta.by/3543421451 )))

  15. 15. blogavod | www.blogavod.ru | 20 января 2010

    Давно хотел заняться своей страницей с ошибкой 404, но руки не доходили. Сегодня обязательно найду прикольную картинку и займусь страницей.

  16. 16. Роман | 20 января 2010

    Юмор на высоте.!

  17. 17. Linar | www.url.by | 20 января 2010

    А вообще зачем делать страницу 404 оригинальной. У нее другое предназначение. Она должна помочь посетителю сайта найти требуемую информацию или как минимум не покинуть Ваш сайт.

  18. 18. Andrew | gblog.zzl.org | 20 января 2010

    Читаю этот блог недавно, но каждый раз поражаюсь. В каждой статье, Вы несете креативные идеи которые сразу же загорается желание сделать.
    Моя фантазия вот что мне подсказала, правда я не уверен что есть такой плагин. Хотел бы чтобы страница 404 выглядила поразному в зависимости от дня недели и в соответсвии с этим там отображались ссылки на статьи подходящие к этому дню.
    А так вообще правда. Страницу можно оформить как угодно, на сколько бурно развита фантазия автора

  19. 19. Николай | advuser.blogspot.com | 20 января 2010

    Павел, а вот как раз в этом есть дилемма, отдавая красивую страничку про ошибку 404 с кодом 200, либо отдавать правильный код 404, а большинство браузеров тогда игнорируют текст и показывают собственную страницу ошибки.

  20. 20. Святослав | expee.ru | 20 января 2010

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

  21. 21. Sosnovskij | sosnovskij.ru | 20 января 2010

    Andrew, спасибо за теплые слова ;-)
    Интересную идеи вы, конечно, предложили, но я думаю она больше не для страницы 404 подойдет, а, например, для основного дизайна блога.

  22. 22. Валентин | valeoblog.ru | 21 января 2010

    Страница 404 играет очень важную роль. Как уже было замечено, 404-ая позволит сохранить посетителя. Также советую сделать 404-ую не только блогам, но и всем другим сайтам.

  23. 23. Lingvaroom | www.lingvaroom.ru | 21 января 2010

    Попыталась проверить, как выглядит моя страница 404 — меня перенаправляют на главную. Хотя сам файл страницы есть. Как это можно исправить?

  24. 24. Sosnovskij | sosnovskij.ru | 21 января 2010

    Lingvaroom, видимо в файле стоит редирект на главную страницу. Киньте файл мне на почту или скопируйте сюда в комментарии. Разбиремся ;)

  25. 25. Lingvaroom | www.lingvaroom.ru | 21 января 2010

    Почему-то в комментарии не отобразился весь код. Отправлю на почту.

  26. 26. Святослав | expee.ru | 22 января 2010

    Сделал себе 404: expee.ru/404 :)

  27. 27. Sosnovskij | sosnovskij.ru | 22 января 2010

    Святослав, посмеялся от души. Отличная страничка ;-)

  28. 28. site-katalog | site-katalog.ru | 22 января 2010

    когда попадаешь на веселую страницу 404, даже настроение повышается :)

  29. 29. Андрей | bysmeta.ru | 27 января 2010

    Спасибо отличная статья как раз то что искал.

  30. 30. Xstroy | xstroy.com | 28 января 2010

    Не помешало бы исправить на 404-й:
    «Миссия моего дневника-» или «Миссией моего дневника является». И лучше с новой строки.

  31. 31. Sosnovskij | sosnovskij.ru | 28 января 2010

    Xstroy, спасибо, поправил ;-)

  32. 32. Linar | www.url.by | 30 января 2010

    После прочтения Вашего поста изменил страницу 404. Сегодня зашел в Яндекс.Вебмастер и эта страница теперь с ошибкой: HTTP-статус: Ресурс не найден (404). Список страниц, исключённых роботом при обходе сайта. Причиной исключения может быть ошибка при загрузке или обработке страницы. Кроме того, в поисковый индекс не попадают страницы, запрещённые в файле robots.txt и т.п. Исключение страниц из индекса не всегда является ошибкой в настройках сайта. Вы можете указать степень серьёзности той или иной причины исключения в Настройках.

  33. 33. Sosnovskij | sosnovskij.ru | 30 января 2010

    Linar, ну так это страница, которая отдает ошибку 404 — зачем роботу ее индексировать? :smile:

  34. 34. mozgolom | vpravmozgi.ru | 31 января 2010

    Это конечно хорошо креативом заниматься, но я вот практически никогда и не попадал на 404, как то все по адресу.

  35. 35. Linar | www.url.by | 31 января 2010

    Sosnovskij, нет, я не против того, чтобы она не индексировалась. Просто до внесения изменений в страницу, она не была в панели Вбемастер в качестве страницы с ошибкой.

  36. 36. Alex@Macenko.com | macenko.com | 9 февраля 2010

    А вообще, должна она присутствовать 404, но лучше, чтоб ее вообще не видели клиенты сайта

  37. 37. Sosnovskij | sosnovskij.ru | 9 февраля 2010

    Alex@Macenko.com, в идеале, конечно, да. Но бывают пользователи, либо сами ошибаются, либо статьи куда-нибудь переносится. А редирект на главную — не лучший вариант ;)

  38. 38. paralax13 | nibru.ru | 27 февраля 2010

    Alex@Macenko.com, если пользователь ошибся при наборе ссылки, то ему обязательно об этом нужно сообщить, чтобы не возникало путаницы: хотел попасть на одну страницу, а в итоге попал на совершенно другую (чаще всего на главную). Хотя можно сделать проверку на опечатки в набранной ссылке и попробовать либо отредиректить на предполагаемую правильную страницу, либо на 404-ой предложить список вероятных ссылок, куда метил пользователь.

  39. 39. Алексей | makvak.com/ru | 12 марта 2010

    Есть отличный плагинчик, который палит по каким адресам пользователю показывали 404 страницу. Очень полезно для отлова трафика, особенно, если вы любите удалять и переименовывать посты.

  40. 40. Ismail | pro.ucoz.org | 21 апреля 2010

    Хм… я тоже думал как-то, поставить, что-то стильное и интересное… но как говорят: все гениальное — просто, решил все сделать просто. вот моя страница ошибки 404: pro.ucoz.org/404

  41. 41. Ян | stupid-blog.ru | 1 мая 2010

    :x картинки вынесли)) обязательно надо будет переделать шаблончик 404-ой, в yandex е, помниться тоже была очень оригинальная страница)

  42. 42. Alex | 12 июня 2010

    А как вам такая 404-я
    postrlive.ru/error/404.html
    Прикольно придумали: ошибка будет исправлена через 404 секунды… :idea:

  43. 43. Sosnovskij | sosnovskij.ru | 12 июня 2010

    Alex, да, оригинальная страничка. :smile:

  44. 44. SEOman | www.seostuff.org.ua | 3 августа 2010

    Хороший вариант также — вывод поискового результата гугла основанного на «основных» ключевых словах вашего сайта.

    Помоему такой плагин был для вордпресса.. ну я сильно не замарачивался и оставил стандартную 404 еррор пейжд))

  45. 45. Валерий | rabotaisam.ru | 3 августа 2010

    :razz:
    я другим путем пошел, сделал свою данным методом: rabotaisam.ru/error-404.html

  46. 46. Боксик | 21 сентября 2010

    Особенно улыбнула картинка со сперматозоидами… :) Наверное, нужно и себе на сайт втулить… :)

  47. 47. Дмитрий | vtouchphone.ru | 3 ноября 2010

    оригинально))) ;-)

  48. 48. sidash | sidash.ru | 30 ноября 2010

    ;-) сегодня переделываю 404!)
    вот мой вариант sidash.ru/404 :grin:

  49. 49. Sosnovskij | sosnovskij.ru | 30 ноября 2010

    sidash, симпатичная страничка :smile:

  50. 50. Strikestar | www.webliberty.ru | 12 декабря 2010

    А у меня вопросик возник :grin: . Почему вордпресс не отдает ошибку 404 если в строке адреса странички в конце вставить цифры? Например если сравнить site.ru/test/ и site.ru/test/11/ то при втором запросе с цифрами нет ошибки 404 и отдается содержание site.ru/test/ по адресу с цифрами…

  51. 51. Евгений | tolevbizsystems.com | 12 декабря 2010

    Хороший совет. Вот только не смог отыскать у себя страницу 404, знаю что быть должна, а ее нет )))
    Буду пытаться ее выцепить и использовать по максимуму.
    Спасибо, хороший пост

  52. 52. Данте | frome4u.ru | 26 декабря 2010

    Здравствуйте, Сергей. Понравилась Ваша 404. Креативно :idea:
    Сам не так давно переделал свою, добавив изображение и немного текста. Прошу: frome4u.ru/404
    Пишите ещё, ждём новых идей от Вас ;-)

  53. 53. Пчеловод | beebazar.ru | 6 января 2011

    Тоже переделал — beebazar.ru/404

  54. 54. Alex_vgf | yousee24.com | 10 февраля 2011

    Даже на это счет и не задумывался.Осталось придумать как на этом заработать)

  55. 55. Vedro_Okunei | landofpc.ru | 5 марта 2011

    Блин, а у меня нет ошибки 404 в теме :( Что делать?

  56. 56. Sosnovskij | sosnovskij.ru | 5 марта 2011

    Vedro_Okunei, создавать ;-) .

  57. 57. Vedro_Okunei | landofpc.ru | 5 марта 2011

    Sosnovskij, так пробывал. А толку от неё нет. Ведь её нужно что-то где прописать наверное, чтоб на неё всё перенаправлялось

  58. 58. Sosnovskij | sosnovskij.ru | 6 марта 2011

    Vedro_Okunei, попробуйте ознакомиться с материалом ktonanovenkogo.ru/wordpress/wordpress_osnovi/stranitsa-oshibok-404-v-wordpress.html

  59. 59. Vedro_Okunei | landofpc.ru | 6 марта 2011

    Sosnovskij, да смотрел уже. Создаю 404.пхп и нефига не выходит. :(

  60. 60. Sosnovskij | sosnovskij.ru | 6 марта 2011

    Vedro_Okunei, обратитесь к какому-нибудь верстальщику. Он поможет.

  61. 61. Алексей | proobschenie.ru | 14 марта 2011

    а я не знаю как тема называется, ну название я знаю но когда вбиваю в урл нето пишет. Как подскажете название найти?

  62. 62. Sosnovskij | sosnovskij.ru | 15 марта 2011

    Алексей, название чего?

  63. 63. Сергей | vitatour.net | 18 марта 2011

    Валерий, мне ваш вариант подошел! спс! и у вас отличная и оригинальная — rabotaisam.ru/5555, только вот у меня не работает флеш, как его запустить

  64. 64. Григорий | 21 мая 2011

    Прочитал всю статью и мне она понравилась. Я к стати уже сделал свою 404 страницу, по моему вот хороший пример оформления 404 ошибки на веб сервере vpn.by/error404.php

  65. 65. Роман | 2 июня 2011

    А что если в самой теме нету файла 404.php? Где исправлять код?

  66. 66. peshehod | pobrehushki.ru | 6 июля 2011

    Свою страницу 404 я перевёл на русский язык, а как туда картинку вставить не понял. Подскажите!

  67. 67. Sosnovskij | sosnovskij.ru | 7 июля 2011

    peshehod, в вашем случае после слов «Извините за доставленные неудобства» нужно вставить html-код нужной картинки. Она появится после всего текста.

  68. 68. peshehod | pobrehushki.ru | 8 июля 2011

    Sosnovskij, Спасибо! Подыщу, что-нибудь оригинальное вставлю обязательно.

  69. 69. peshehod | pobrehushki.ru | 22 июля 2011

    Sosnovskij

    Получилось! Спасибо за помощь.

  70. 70. Olga | 11 сентября 2011

    А вот наш пример med-altai.ru/404

  71. 71. lex | compoline.ru | 28 сентября 2011

    Интересные идеи. Посмотрите на мою станичку compoline.ru/12345

  72. 72. Евгений | sovetywebmastera.ru | 30 октября 2011

    Как всегда, у Вас на сайте только самое интересное, завтра попробую сотворить со своей 404-й. Спасибо.

  73. 73. Александр | 14 декабря 2011

    Sosnovskij,
    Я прочитал эту статью и сделал страницу ошибки, а до этого и не думал о полезности таковой. Спасибо.

  74. 74. Игорь | lepeta.net | 16 марта 2012

    На мой взгляд, главное, чтобы она была простой. Я сделал так: lepeta.net/404
    Так пользователь сразу понимает, что попал не туда, куда хотел. + фокусируется на тексте, а не на окружающих меню :)

  75. 75. Александр | 5 июня 2012

    Вот пример с анимацией
    ldni.sumy.ua/11111

  76. 76. Евгений | 11 сентября 2012

    привет всем у меня такая задумка я хочу сделать так чтобы карты сайта недоброжелатель списком а изначально отображались разделы и только кликнув по нужному тогда появлялись бы категории и после материал внём, в данный момент у меня вместо страницы 404 отображается карта сайта вот оцените
    zaton09.ru/novig-saite.html
    zaton09.ru/rabotaempk/122-web/1007-404.html

  77. 77. Толян | 3 июля 2013

    Прикольная 404 страница с гастарбайтерами okostroy.ru/404

  78. 78. ed | 27 февраля 2014

    Мне как-то тоже не нравились безликие странички об ошибках. Сегодня сделал красивую и музыкальную страничку об ошибке 404 good-surf.ru/404.shtml Думаю скоро красивыми сделать и другие странички об ошибках.

  79. 79. Коля | 14 января 2015

    Вот реальный креатив, и она там не одна такая zapolsky.moscow/404/

Подняться наверхПодняться наверх
WordPress: 66.77MB | MySQL:32 | 2,490sec