404 page: The Ultimate Guide (with 50+ Examples)

23.12.2022 alexxlab

Содержание

Smart Custom 404 error page [404page] — Плагин для WordPress

Детали
Отзывы
Разработка

Поддержка

With 100,000+ active installations the 404page plugin is the most used plugin to create a customized 404 error page in WordPress.

Bringing visitors to your website takes time and effort. Every visitor is important. The default 404 error page of most themes do not provide any information on what to find on your site. A first tme visitor, who does not know you, is left in a dead end and leaves your website. Set up a helpful custom 404 error page to keep him on your site.

This handy plugin allows you to easily create your own 404 error page without any effort and it works with almost every theme.

Usage

Create your custom 404 error page just like any other page using the WordPress Page Editor. Then go to ‘Appearance’ -> ‘404 Error Page’ and select the created page as your custom 404 error page. That’s it!

Demo

See it in action (no registration needed)
kindly powered by TasteWP

Why use this plugin?

Different from other similar plugins the 404page plugin does not create redirects. That’s quite important because a correct code 404 is delivered which tells search engines that the page does not exist and has to be removed from the index.

Different from other similar plugins the 404page plugin does not create additional server requests.

Requirements

The only requirement for this plugin is that you change the Permalink Structure in ‘Settings’ -> ‘Permalinks’ to anything else but ‘Plain’. This also activates the WordPress 404 error handling.

Docs & Support

Plugin Manual

Support Forum

Videos

A brief Introduction to the free WordPress Plugin 404page

A quick Overview over the Advanced Settings

«Force 404 error after loading page» explained

«Disable URL Autocorrecton Guessing» explained

«Send HTTP Status Code 410 for trashed objects» explained

«Compatibility Mode» explained

Block & Shortcode

Block

The Plugin offers a block «URL causing 404 error» for the block-based editor to show the URL that caused the error. The block offers three display options:

«Page» to show the page including path ( e.g. does/not/exist )
«Domain Path» to show the URL without protocol and parameters ( e.g. example.com/does/not/exist )
«Full» to show the complete URL ( e.g. https://example.com/does/not/exist?p=1 )

Shortcode

The Plugin offers a shortcode «pp_404_url» for the classic editor to show the URL that caused the error. There are three possible options:

[pp_404_url page] to show the page including path ( e.g. does/not/exist )
[pp_404_url domainpath] to show the URL without protocol and parameters ( e.g. example.com/does/not/exist )
[pp_404_url] or [pp_404_url full] to show the complete URL ( e.g. https://example.com/does/not/exist?p=1 )

Do you like this plugin?

I spend some of my precious free time developing and maintaining my free WordPress plugins. You don’t need to make a donation. No money, no beer, no coffee. If you like this plugin then please do me a favor and give it a good rating. Thanks.

Plugin Privacy Information

This plugin does not set cookies
This plugin does not collect or store any data
This plugin does not send any data to external servers

Peters’ Plugins Privacy Information Page

ClassicPress

This plugin is compatible with ClassicPress.

More plugins from Peter

Take a look at my other plugins

Compatibility

The 404page plugin was sucessfully tested by the author with the following themes

Athena
Customizr (Read more about Customizr Compatibility Mode)
evolve
GeneratePress
Graphene
Hemingway
Hueman
Responsive
Spacious
Sparkling
Sydney
Twenty Ten
Twenty Eleven
Twenty Twelve
Twenty Thirteen
Twenty Fourteen
Twenty Fifteen
Twenty Sixteen
Twenty Seventeen

Twenty Nineteen
Twenty Twenty
Vantage
Virtue
Zerif Lite

The 404page plugin was sucessfully tested by the author with the following starter themes

Bones
JointsWP
undersores

The 404page plugin was sucessfully tested by the author with the following plugins

bbPress
BuddyPress
DW Question & Answer
hashtagger
Page Builder by SiteOrigin
Polylang
User Submitted Posts
WooCommerce
WP Super Cache (Read more about WP Super Cache Compatibility)
WPML WordPress Multilingual Plugin (officially approved by WPML team)

For developers

Action Hook

The plugin adds an action hook 404page_after_404 which you can use to add extra functionality. The exact position the action occurs after an 404 error is detected depends on the Operating Method. Your function must not generate any output. There are no parameters.

Constant

If the 404page plugin is installed and activated it defines the PHP constant PP_404. Check existence of it to detect the 404page plugin.

Functions

The Plugin provides the following functions:

pp_404_is_active() to check if there is a custom 404 page selected and the selected page exists

pp_404_get_page_id() to get the ID of the 404 page
pp_404_get_all_page_ids() to get an array of page IDs in all languages
pp_404_get_the_url( $type ) to get the URL that caused the 404 error
- Parameter $type string Optional
- «page» to get the page including path ( e.g. does/not/exist )
- «domainpath» to get the URL without protocol and parameters ( e.g. example.com/does/not/exist )
- «full» (default) to get the complete URL ( e.g. https://example. com/does/not/exist?p=1 )

Native Mode

If you are a theme developer you can add native support for the 404page plugin to your theme for full control. Read more.

The themes default 404 error page
Creating a custom 404 error page
Select the created page as 404 error page
The custom 404 error page in action
The advanced plugin settings
The block for the block-based editor
The block options

Этот плагин предоставляет 1 блок.

URL causing 404 error

Will it work with the theme I’m using?

This plugin is designed to work with as many themes as possible. It uses the WordPress Template System to detect and handle 404 errors. If your theme makes use of this Template System this plugin will work properly. If it does not the plugin offers a so called Compatibility Mode, which uses its completely own method to detect and handle 404 errors.

If this plugin does not work properly, try to activate Compatibility Mode.

Are 404 errors redirected?

No, there is no redirection! The chosen page is delivered as a ‘real’ 404 error page. This results in a HTTP 404 code and not in 301 or 302, which is important for Search Engines to tell them, that the page does not exist and should be deleted from the index.

Is it possible to add custom CSS to the 404 page?

The 404page plugin adds a CSS class error404 to the <body> tag which can be used for extra styling.

Where can I get help?

Please use the Support Forum.

Bonjour et merci pour cet excellent plugin. J’ai pourtant eu un bug sur ma page d’accueil, puis j’ai désactivé un autre plugin, ce qui m’a donner l’occasion de le virer et tout est rentré dans l’ordre. Je me suis régalé à personnaliser la page 404 et j’ai fais le ménage dans mes plugin, quoi demander de mieux. Donc Merci à Smart Custom 404 error page et bien sûr 5 étoiles.

I just use it on all my websites, works great. Thank you.

Does the job. Simple and straightforward

Great solution when redesigning a traditional multi-page WordPress website and switching it to a one-page locally scrolling website.

Does what it’s intended to do! Couldn’t ask for more 🙂

No need to edit the 404.php file (plus no adding in a child theme to preserve your edits). Just install this plugin, add a new page, call it, oh, how about 404 page, then select your new 404 page from this plugins settings and you’re done. Quick and easy.

Посмотреть все 1 118 отзывов

«Smart Custom 404 error page [404page]» — проект с открытым исходным кодом. В развитие плагина внесли свой вклад следующие участники:

Участники

Peter Raschendorfer

«Smart Custom 404 error page [404page]» переведён на 16 языков. Благодарим переводчиков за их работу.

Перевести «Smart Custom 404 error page [404page]» на ваш язык.

Заинтересованы в разработке?

Посмотрите код, проверьте SVN репозиторий, или подпишитесь на журнал разработки по RSS.

11.4.3 (2022-11-05)

bugfix for WP 6.1

11.4.2 (2022-11-01)

also add class error404 to body tag if page is called directly

plugin renamed

11.4.1 (2022-10-16)

bugfix: load Javascript for Block only when needed

11.4.0 (2022-10-13)

Block added
Shortcode added
Function pp_404_get_the_url() added

11.3.1 (2022-04-05)

just cosmetics
Plugin Foundation updated to PPF08

11.3.0 (2021-01-06)

new option to always send an 410 instead of an 404
Plugin Foundation updated to PPF07

11.2.6 (2020-08-23)

Plugin Foundation updated to PPF06

11.2.5 (2020-08-22)

minor UI adjustments

11.

2.4 (2020-08-16)

bug fix for Flamingo (see topic) plus potentially other plugins (thanks to garfiedo for supporting me to find the reason)

11.2.3 (2020-07-05)

fix for Polylang (see topic)

11.2.2 (2020-03-28)

changes to the notification for hopefully better compatibility
Plugin Foundation swtiched to PPF04

11.2.1 (2020-01-04)

if W3 Total Cache is installed and caching is active URLs that result in an 404 error are automatically excluded from caching

11.2.0 (2020-01-01)

if WP Super Cache is installed and caching is active URLs that result in an 404 error are automatically excluded from caching

11.1.4 (2019-12-29)

urgent bug fix for PPF03

11.1.3 (2019-12-29)

Plugin Foundation updated to PPF03, no functional changes

11.1.2 (2019-11-19)

exclude 404 page from XML sitemap generated by Jetpack

11.

1.1 (2019-11-16)

from now on it is not only detected if Yoast SEO Plugin is active, but also if the sitemap feature is activated

11.1.0 (2019-11-10)

now uses Plugin Foundation PPF02 for plugin compatibility
introduces two new functions for developers pp_404_get_page_id() and pp_404_get_all_page_ids()

11.0.5 (2019-10-22)

bugfix for Yoast SEO XML Sitemap (see topic)
added a note to settings page if Yoast SEO is active

11.0.4 (2019-10-06)

bugfix for WPML

11.0.3 (2019-09-01)

bugfix for REST API call (see here)

11.0.2 (2019-08-30)

two bugs fixed (see here and here)

11.0.1 (2019-08-13)

fix for PHP 7.1 — __construct() access level in subclass — this is an PHP error that was fixed in PHP 7.2, but I’ve changed my code to also work with PHP 7.1

11.0.0 (2019-08-13)

mostly rewritten based on my own newly created Plugin Foundation

10.

5 (2019-04-01)

some more security improvements

10.4 (2019-03-31)

security vulnerability in AJAX call fixed (thanks to Julio Potier for pointing me to this)

10.3 (2019-02-21)

fix for compatibility with iThemes Sync (ticket)

10.2 (2019-02-19)

just another small change to prevent from potential problems with version 10

10.1 (2019-02-14)

error fixed (ticket)

10 (2019-02-14)

workaround for WordPress Permalink bug #46000
code improvement
performance tuning

9 (2019-01-24)

Gutenberg note added

8 (2019-01-11)

fixed compatibility issue with latest WPML version
code improvement
UI improvements

7 (2018-07-16)

corrected wrong image path
added video links to admin page
code improvements

6 (2018-06-18)

exclude 404 page from XML sitemap generated by Yoast SEO
further UI-improvements

5 (2018-03-05)

show an indicator if the currently edited page is a 404 error page
minor code- & UI-improvements

4 (2018-03-05)

bugfix for bbPress (see topic)

3.

3 (2017-11-16)

support for right-to-left-languages added
faulty display in WP 4.9 fixed

3.2 (2017-10-05)

new feature to send an HTTP 410 error for deleted objects

3.1 (2017-07-24)

bugfix for Polylang (see topic)
bugfix for CLI (see topic)
add debug class to body tag
also add body classes for Customizr theme
do not add error404 class if already exists
further redesign admin interface

3.0 (2017-07-05)

new feature to force 404 error after loading page
new feature to disable URL autocorrection guessing
finally removed Polylang stuff disabled in 2.4
redesigned admin interface
code improvement

2.5 (2017-05-19)

hide 404 page from search results on front end (if WPML is active, all languages are hidden)
do not fire a 404 in Compatibility Mode if the DW Question & Answer plugin by DesignWall is active and a question has no answers

2.

4 (2017-03-08)

ensure that all core files are loaded properly (see topic)
Polylang plugin does no longer require Compatibility Mode (see topic)
hide all translations if WPML is installed and «Hide 404 page» is active (thanks to the WPML guys for pointing me at this)
post status fix (see topic)
Enfold theme issue fix (thanks to the guys at Kriesi.at for supporting me)

2.3 (2016-11-21)

a few minor bugfixes solve some problems with page templates in certain combinations

2.2 (2016-09-26)

automatic switch to Compatibility Mode for several plugins removed
enhanced support for WPML and Polylang
remove the 404 page from search results (for all languages if WPML or Polylang is used)
remove the 404 page from sitemap or other page lists (for all languages if WPML or Polylang is used)
bugfix for author archives
confusing admin message removed

2.

1 (2016-04-22)

introduction of selectable Operating Methods
several changes to Compatibility Mode for improved WPML and bbPress compatibility plus compatibility with Page Builder by SiteOrigin
Polylang compatibility
automatic switch to Compatibility Mode if WPML, bbPress, Polylang or Page Builder by SiteOrigin is detected
completely new Customizr Compatibility Mode (automatically enabled if Customizr is detected)
firing an 404 error in case of directly accessing the 404 error page can now be deactivated
WP Super Cache support
option to hide the 404 error page from the Pages list
404 error test
plugin expandable by action
delete all settings on uninstall

2.0 (2016-03-08)

WPML compatibility
bbPress compatibility
Customizr compatibility
directly accessing the 404 error page now throws an 404 error
class error404 added to the classes that are assigned to the body HTML element
the settings menu was moved from ‘Settings’ to ‘Appearance’
translation files removed, using GlotPress exclusively
Read more

1.

4 (2015-08-07)

edit the 404 page directly from settings page
Portuguese translation

1.3 (2015-01-12)

technical improvement (rewritten as class)
cosmetics

1.2 (2014-07-28)

Spanish translation
Serbo-Croatian translation

1.1 (2014-06-03)

Multilingual support added
German translation

1.0 (2013-09-30)

Первый релиз

Мета

Версия: 11.4.3
Обновление: 4 недели назад
Активных установок: 100 000+
Версия WordPress: 4.0 или выше
Совместим вплоть до: 6.1.1
Версия PHP: 5.4 или выше
Языки:
Albanian, Chinese (China), Chinese (Taiwan), Danish, Dutch, English (Australia), English (Canada), English (New Zealand), English (US), French (France), Galician, German, Italian, Spanish (Colombia), Spanish (Ecuador), Spanish (Spain) и Spanish (Venezuela).
Перевести на ваш язык
Метки:
404404 pageerrorerror pagepage
Дополнительно

Оценки

Посмотреть все

5 звёзд 1 085
4 звезды 8
3 звезды 7
2 звезды 2
1 звезда 16

Войдите, чтобы оставить отзыв.

Участники

Peter Raschendorfer

Поддержка

Решено проблем за последние 2 месяца:

2 из 3

Перейти в форум поддержки

404 страницы — Документация ExpressionEngine 6

Отображение пользовательской страницы 404
Когда отображается страница 404?
Пример

Примечание: Этот параметр является предпочтительным для всего сайта.

По умолчанию ExpressionEngine направляет посетителя на домашнюю страницу при обнаружении ошибки 404.

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

Настройки --> Настройки шаблона

Параметр страницы 404 сообщает ExpressionEngine, какой шаблон использовать для всех полученных ошибок 404. Стоит отметить, что использование строгих URL-адресов предпочтительнее, так как это делает путь к вашему контенту более точным, позволяет использовать более релевантные страницы 404 и не позволяет отображать ваш контент с отклонениями в структуре URL-адреса.

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

Первое условие — недопустимая группа шаблонов. ExpressionEngine проверяет только первый сегмент, чтобы определить, показывать страницу 404 или нет. Поскольку первый сегмент представляет собой группу шаблонов, ExpressionEngine будет отображать шаблон 404 только в том случае, если запрошенная группа шаблонов в URL-адресе не существует.

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

Второе условие, которое вызывает статус 404, — это лишние сегменты. Это потребует добавления некоторого кода в ваш шаблон. Помните, что ExpressionEngine просматривает только первый сегмент, чтобы активировать статус 404, чтобы расширить эту проверку ошибок за пределы первого сегмента, нам нужно использовать условную и глобальную переменную {redirect=}.

 {если сегмент_3 != ''}
  {перенаправить = "404"}
{/if}

В приведенном выше коде, если третий сегмент не пуст, ExpressionEngine покажет определенный нами шаблон 404.

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

example.com/blog

Но предположим, что посетителю нужна определенная запись в группе шаблонов вашего блога, поэтому он набирает

example.com/blog/cats-in-dresses-dancing- to-Christmas-music

Скорее всего, они не поймут это правильно и вызовут ошибку 404. Группа шаблонов верна, поэтому они не увидят никаких ошибок. Это создает впечатление, что они напечатали все правильно, но им остается только гадать, где же кошки.

Давайте позаботимся об этом. Это страница с одной записью, поэтому мы можем использовать require_entry= в паре тегов записей нашего канала. Это указывает паре тегов записей канала возвращать результаты только в том случае, если в сегменте URL-адреса есть определенный заголовок URL-адреса.

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

 {если нет_результатов}
  {перенаправить = "404"}
{/if}

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

 {exp:channel:entries channel="blog" limit="1" require_entry="yes" url_title="{segment_3}"}
  {если нет_результатов}
    {перенаправить = "404"}
  {/если}
  Вещи здесь.
{/exp:channel:entries}

17 Creative 404 Error Pages от SaaS-компаний!

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

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

[otw_is sidebar=otw-sidebar-1]

Креативные и забавные 404 страницы

Некоторое время назад Spiegel.de — один из крупнейших немецких новостных сайтов — включил нашу 404 страницу в свою коллекцию креативных 404 страниц.

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

Mailchimp

Сотрудники Mailchimp знают, как общаться. И это не останавливается на их целевой странице 404.

http://mailchimp.com/404/

Slack

Мы в Usersnap большие поклонники Slack. Это наш основной инструмент общения, и мы даже разработали собственную интеграцию со Slack. Поскольку Slack помогает компаниям общаться, они также знают, как общаться со страницей 404.

https://slack.com/404

GitHub

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

https://github.com/404

Asana

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

https://asana.com/404

New Relic

New Relic, самый известный среди DevOps, имеет действительно выдающуюся целевую страницу 404. Кто не любит мысленный эксперимент Шрёдингера 🙂

https://newrelic.com/404

[otw_is sidebar=otw-sidebar-2]

Pusher

Pusher — это одна из услуг, которую мы в Usersnap используем, чтобы сделать наш собственный продукт лучше. С помощью библиотек реального времени Pusher отлично справляется с работой, реализующей функции реального времени в браузере. Их целевая страница 404 имеет простой дизайн, но эффективна.

Вы только что получили 404.

https://pusher.com/404

GrooveHq

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

https://www.groovehq.com/404

Unbounce

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

Основной призыв к действию на этой странице? Игра в понг 🙂

http://unbounce.com/asd

Orat.io

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

https://orat.io/404

Intercom

Компания Intercom, известная своими инструментами автоматизации обслуживания клиентов и маркетинга, имеет хорошо продуманную страницу 404.

https://intercom.io/404

[otw_is sidebar=otw-sidebar-3]

Bitmovin

Bitmovin, который вам лучше известен как Крысолов из сериала Силиконовая долина (шутка!) , предлагает инфраструктуру видео для Интернета. Ура!

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

https://bitmovin.com/404

Wunderlist

Wunderlist, список дел, приобретенный Microsoft, предлагает простую, но привлекательную целевую страницу 404.

Первомай! У нас есть 404!

https://www.wunderlist.com/404/

Travis-CI

Интересный подход к 404 целевым страницам можно найти на сайте Travis-CI. Вместо того, чтобы извиняться перед пользователем за то, что он попал на страницу 404, Travis-CI заставляет своих посетителей чувствовать себя желанными.

https://travis-ci.com/404

Infinum

Infinum, компания-разработчик программного обеспечения из Хорватии, предлагает одну из самых креативных 404 целевых страниц. Попасть на страницу 404 можно по разным причинам. Битые ссылки, неверные перенаправления, старый контент. Итак, кого следует винить в этом?

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

https://infinum.co/404

Zendesk

Знаете ли вы, что большинство людей никогда не попадают на страницу 404. Если вы один из тех счастливчиков, вас следует поздравить. Согласно Zendesk, вы входите в элиту, которой удалось найти страницу 404.

Поэтому, оказавшись там, вы должны почувствовать себя особенным.

https://www.zendesk.com/404

Wufoo

Еще одну красиво оформленную целевую страницу 404 можно найти на веб-сайте Wufoo.