Как сделать страницу ошибки 404 на своем сайте

Как создать красивую страницу ошибки 404

Реферальные банеры

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

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

Вот наглядный пример, как выглядела раньше страница ошибки 404 на моем блоге:

пример стандартной страницы ошибки 404

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

Что может содержать шаблон ошибки 404 not found. Пару предложений, вроде: "Страницы, которую Вы ищите нет...". Какую-нибудь прикольную картинку. Ее можно найти в интернете или нарисовать свою. Еще один элемент, который должна содержать любая страница ошибки 404 - поиск. Где взять код формы поиска? В стандартных шаблонах, обычно, есть файл searchform.php, в нем и будет код.

Также можно вывести список рубрик, последних статей, добавить ссылку на главную страницу сайта, а также ссылку на страницу со списком всех статей. Если Вы еще не знаете, как создать страницу с выводом списка всех статей, то почитайте эту статью https://inetsovety.ru/karta-bloga-dlya-lyudey/

Как создать страницу 404

    1. Нужно зайти в подраздел Редактор, который находится в разделе Внешний вид:Как сделать страницу ошибки 404
    2. Справа выбрать для редактирования файл шаблона ошибки 404 под названием 404.php.
    3. У меня редактирование файла страницы ошибки 404.php заключалось во ставке следующего кода:
      <div align="center"><h3>Страницы, которую Вы ищете уже  нет!</h3>   <img src="https://inetsovety.ru/wp-content/uploads/404.jpg">  </div>   <div align="center">Посмотрите перед уходом раздел рубрики,  последние статьи и другие страницы блога!</div>

Давайте рассмотрим, что означает данный код:

  • выравнивание текста внутри по центру (внутрь его я вставляю остальную часть кода)
    <div align="center"></div>
  • вставка картинки (картинку я загрузила на хостинг и указала путь к ней)
    <img src="https://inetsovety.ru/wp-content/uploads/404.jpg">
  •  <h3></h3> - тексту присваивается стиль заголовка h3
  • Код для вывода рубрик:
    <?php wp_list_cats ('sort_column=name'); ?>
  • Если хотите вывести список из 5 последних опубликованных записей, добавьте этот код:
    <?php get_archives ('postbypost', 7); ?>

После этих изменений страница ошибки 404 стала выглядеть следующим образом:

Как создать привлекательную страницу ошибки 404

Со временем буду приукрашивать ее еще. На сегодня у меня все. А как  на Вашем блоге  оформлена страница ошибки 404 или все еще показывается стандартная страница?

Понравилась статья? Поделиться с друзьями:
Как заработать деньги в интернете
Комментарии: 24
  1. Игорь

    да уж, такая страничка отпугивает. Нужно свою привлекательную сделать, что бы человек вернулся на сайт

    1. Люся

      Если у человека нет времени или торопится, он не вернётся на сайт, а продолжит поиск материала в другом месте.

  2. Рашида

    Отличная страница 404 — я тоже сделала, только еще добавила ссылку на пять последних статей, «вдруг вы их еще не читали»

    1. Люся

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

  3. Александр

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

    1. seomodern

      Возьмите за пример страницу с блога Виктории. Поставьте другую картинку и поставьте ссылки на страницы своего блога.

      1. Александр

        Да я уже думал об этом. но никак руки не доходят

    2. Люся

      У вас не доходят руки, потому что не считаете важной страницу 404. а зря не считаете.

  4. Александр

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

    1. seomodern

      Правильное оформление данной страницы может положительно повлиять на оптимизацию сайта.

      1. Александр

        Возможно, но раньше никогда об этом не задумывался об этом

      2. seomodern

        «Замечательный» комментарий. Стоит задуматься :)

      3. Александр

        Да наверное многим нужно задуматься в первую очередь мне

  5. seomodern

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

    1. Александр

      Вот и я не могу решить какой сделать внешний вид страницы 404

      1. seomodern

        Я уже определился. Могу подсказать, как:)

      2. Александр

        Очень бы хотел получить совет!

  6. Фидан

    Благодарю. Сделаю наконец-то нормальную страницу 404

  7. Инга Анатольевна

    Доброго времени суток. Виктория, полный восторг!
    Вы даете такую информацию и бесплатно, просто и не верится — ведь большинство, кого я встретила ранее = ее Продавали!!!!
    Уже пару недель, как *вынашиваю* идею своего сайта (может быть инет-магазина, но не такого как есть!); ПРОЧЛА большинство Ваших статей, и возник вот какой вопрос: Вы по образованию программист, или осваивали просто самоучкой? Благо Дарю!!!

    1. Виктория (автор)

      Здравствуйте, Инга Анатольевна! Спасибо за приятные слова. Я стараюсь писать статьи с полезной информацией максимально доступным языком, понятным даже новичку. По образованию я не программист, веб-программирование изучала сама :)

  8. Олег

    А як створити свою 404 сторінку, якщо в темі шаблону 404 сторінки немає, а все прописано в файлах окремим кодом?

    1. Виктория (автор)

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

  9. Анна

    У вас интересно оформлена страница 404, но вот фраза «перед уходом» звучит не очень позитивно. Лучше было бы её убрать.

    1. Виктория (автор)

      Спасибо. Мне тоже эта фраза не нравится, пока удалю, а потом может что-нибудь придумаю.

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

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!:
Нажимая на кнопку "Отправить комментарий", я даю согласие на обработку персональных данных и принимаю политику конфиденциальности. Комментарий появится после проверки. Комментарии, содержащие спам и ненормативную лексику будут удалены!

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.