Как создать и настроить ошибку 404 в WordPress: 4 верных способа

Часто мы теряем трафик на веб-сайте по непонятным причинам. Одной из них является неправильно оформленная страница 404 WordPress.

Для чего используется страница 404 на сайтах

Назначение 404 страницы — показывать ошибку при попытке посетителей зайти на страницу, которой нет на сайте.

Пользователь может оказаться на такой странице WordPress по следующим причинам:

Он допустил ошибку при вводе адреса в браузере.

Админ сайта WordPress поменял URL записи, а пользователь пытается зайти по старой ссылке.

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

В WordPress при обработке 404 ответа сервера отображается дефолтная страница, на которой присутствуют следующие элементы:

Сообщение о том, что контент не найден.
Форма поиска и предложение поискать запрашиваемую информацию на сайте.

У многих шаблонов WordPress есть свои варианты 404 страничек. А у коммерческих тем их даже может быть несколько на выбор.

Зачем менять дефолтный вывод ошибки 404 в WordPress

Грамотно оформленная 404 page даст несколько преимуществ:

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

Возрастает лояльность пользователей. Посетители видят вашу заботу о них, и их впечатление о сайте улучшается. В следующий раз они с удовольствием будут заходить на ваш ресурс WordPress.

Улучшаются SEO-показатели. Благодаря предыдущим двум пунктам количество времени, которое пользователи проводят на сайте, увеличивается, а процент отказов сокращается. Поисковики оценивают эти сигналы как свидетельство того, что вы предлагаете ценный контент, и повышают позиции ресурса.

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

Кастомная страница 404 WordPress: способы создания

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

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

Во всех шаблонах WordPress обязательно должен присутствовать файл с темплейтом 404 ошибки. Его легко отыскать среди других файлов темы по названию 404.php. Файл можно редактировать прямо в админке, открыв его в «Редакторе тем».

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

В файл 404.php вы можете вставлять код HTML и PHP, а также подключать скрипты JS и стили CSS. При этом доступны все функции и хуки WP.

Smart Custom 404 error page [404page]: плагин для создания кастомного вывода ошибки 404

Smart Custom 404 error page [404page] — бесплатный плагин из репозитория WordPress, который позволяет применить любую пользовательскую страницу для отображения ошибки 404.

Чтобы создать 404 страницу, сделайте следующее:

Создайте страницу через консоль WP обычным способом.
Оформите ее с помощью инструментов редактора WordPress.
Зайдите в настройки плагина, которые после его установки появятся в разделе «Внешний вид» админ-панели WP.
Выберите эту страницу, чтобы она применилась в качестве 404 ответа.

С помощью конструктора Elementor

Тут все зависит от того, платную или бесплатную версию конструктора Elementor вы используете. На платном тарифе доступна опция для выбора шаблона 404 page. Этих пресетов много и на любой вкус.

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

Если вы используете бесплатную версию Elementor, настроить кастомный вариант 404 page также не составит труда:

Просто создайте новую страницу стандартным способом и оформите ее с помощью конструктора Elementor.
Затем воспользуйтесь плагином Smart Custom 404 error page, чтобы назначить только что созданную страничку для обработки ошибки 404.

Настройка 404 страницы через правку файла htaccess

Сначала, как и в предыдущих пунктах, нужно создать и оформить 404 page. Вы можете либо добавить стандартную страницу WP, либо оформить ее с помощью Elementor.

Затем нужно будет отредактировать файл htaccess. Для этого проделайте следующие действия:

Через FTP-клиент скачайте с сервера, где расположен сайт, файл htaccess. Он находится в корневой папке сайта.
Откройте его с помощью редактора кода и вставьте в него директиву (замените ссылку вашей 404 страницей):

ErrorDocument 404 https://ваш_сайт.ru/404-page/

Сохраните и загрузите файл htaccess обратно на сервер.

Какой бы способ вы ни выбрали, помните, что созданную 404 страницу нужно закрыть от индексации. Это делается с помощью директивы Disallow в файле robots.txt.

Как повысить эффективность раздела 404 на WordPress

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

Поэтому основные цели при оформлении 404 page следующие:

оповестить пользователей, куда и почему они попали;

замотивировать их остаться на сайте;

дать инструкции, куда им двигаться дальше.

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

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

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

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

Краткое описание наиболее очевидных способов исправить проблему. Посоветуйте посетителям, например, проверить правильность ввода ссылки в строке браузера.

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

Приведу несколько примеров, что еще можно добавить на эту страницу:

Форма подписки с надписью: «Не нашли ответ на свой вопрос? Оставьте e-mail, и мы сообщим, когда у нас появится интересующая вас информация».
Форма обратной связи: «Напишите, что вас интересует, и мы добавим ответ на ваш вопрос на сайт».
Лента похожих на запрос материалов: «К сожалению, у нас нет того, что вы ищете. Но, возможно, вас заинтересуют следующие материалы».
Промокод. Если у вас интернет-магазин, вы можете разместить на 404 страничке промокод, дающий скидку при следующей покупке, в качестве компенсации за неудобства.
Небольшой опрос: «Что еще вы хотели бы видеть на нашем сайте?».

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

Как на WP протестировать пользовательскую страницу 404?

Чтобы увидеть, как выглядит новая 404 страничка на вашем WordPress ресурсе, вбейте в адресную строку браузера ссылку на ваш сайт, после чего введите символ «/» и набор рандомных букв или чисел.

Затем нажмите «Enter», чтобы перейти по этому адресу. Вы увидите, что выдает ваш сайт в ответ на запрос несуществующей страницы.

Reboot — премиальный WordPress шаблон с гибкими настройками страницы 404

В удобном и постоянно обновляемом шаблоне Reboot от WPShop с конструктором главной среди множества полезных настроек есть также опции для оформления 404 Page Not Found.

Это новая «фича» темы, которая появилась в 2024 году. Если вы установили шаблон раньше и не находите таких настроек, просто обновите его.

После этого действуйте по инструкции:

Зайдите в кастомайзер темы.

Далее перейдите в раздел «Блоки».

В блоках найдите пункт «404» и откройте его.

Здесь вы можете вывести или скрыть сайдбар WordPress, поменять заголовок и описание, а также отобразить форму поиска и блок похожих записей.

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

Чтобы обойтись без установки лишних модулей, лучше приобрести одно универсальное решение. Шаблон Reboot подходит для создания сайта практически любой направленности и содержит массу встроенных инструментов, включая настройку страницы 404. Для большинства моих целей этого хватает, поэтому я предпочитаю использовать именно Reboot на своих сайтах.

Лицензия Reboot со скидкой

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