Как сделать страницу 404 в elementor
Обновлено: 08.07.2024
Что же такое ошибка 404?
Начнем, пожалуй, с определения того, что же такое ошибка 404. Ошибка 404 — это стандартный код ответа сервера на ошибочный запрос. Этот код означает, что по данному адресу ничего нет: Not Found (не найдено). Прежде всего этот код необходим для поисковых роботов, чтобы сообщить им, что по данному URL ничего нет.
А нужна ли ошибка 404?
Здесь можно было бы ограничиться одним словом — нужна. Но давайте попробуем понять, зачем именно она нужна. На самом деле есть подход, применяющийся порой веб-мастерами, который состоит в следующем: при обращении к несуществующему адресу идет перенаправление на главную страницу сайта. Этот подход не очень хорош, поскольку так выходит, что на одну страницу — главную — ведут несколько ссылок. На эту ситуацию уже не очень хорошо могут отреагировать поисковые системы.
Вот для того, чтобы избежать возможных неприятностей, и существует ошибка 404, которая должна отправляться в ответ на ошибочный запрос. В этом случае мы говорим поисковому роботу, что такой страницы нет, и он должен удалить ошибочный адрес из поискового индекса.
Настройка страницы 404 в WordPress
Итак, мы выяснили, что страница 404 — нужна. Как же настроить в WordPress эту страницу и в чем заключается настройка 404 страницы? Собственно, зачастую нам не придется делать ничего особенного, поскольку в WordPress все уже сделано за нас. Все, что вам необходимо сделать — создать в папке активной темы новый шаблон (если его там еще нет), который так и называется — 404.php.
Изучите курс и узнайте, как создавать мультиязычные темы с нестандартной структурой страниц
Это может быть как относительно простая, но со вкусом оформленная страница ошибки 404, например, как на Гитхабе:
Ради интереса вы можете обратиться к поиску по картинкам Google, набрав простой поисковый запрос — 404. В ответ Вы найдете массу интересных и креативных картинок, которые используются для оформления страницы 404.
WordPress — 404 не работает…
Иногда вы можете столкнуться с такой ситуацией, что шаблон 404.php есть, но он почему-то не срабатывает, т.е. WordPress при возникновении ошибки 404 просто не подключает этот шаблон. Такое иногда случается и связано с настройками сервера.
Здесь имеется 4 разных блока настройки:
- Background decoration (оформление фона): можно выбрать цвет и текстуру для фона, а также изображение. Всего имеется 24 разных симпатичных иллюстрации для страницы.
- Useful Links — возможность добавить 5 полезных ссылок.
- Text and Font — для ввода надписей на странице (заголовок, текст), а также настройки шрифтов для них.
- Categories — выбираете категорию, из которой будет отображаться подборка полезных постов.
После задания всех опций, сохраняете изменения. Можете проверить что в итоге получилось.
Возможно, данный пример использования Custom 404 Error Page в дизайне Typo3 блога смотрится не совсем органично. Тем не менее, у вас все же имеются некоторый возможности для получения нужного результата. Во-первых, цвета шрифтов и фона можно выбрать не только из парочки по умолчанию, а указать любые. Во-вторых, добавьте сюда 24 варианта персонажей и 31 текстуру. Жаль, правда, их нельзя дополнить своими.
В целом, плагин Custom 404 Error Page весьма интересный. Будет особенно полезен начинающим пользователям, поскольку все изменения легко делаются в админке блога.
Понравился пост? Подпишись на обновления блога по RSS, Email или twitter!
Оцените статью:
Категории: Плагины;
Теги: интересные плагины, настройка блога, простые плагины, страницы сайта, улучшаем блог.
Для чего нужна страница ошибки 404, как правильно ее настроить и сделать максимально привлекательной для пользователя? Все эти вопросы не перестают быть актуальными для тех, кто создает свой сайт на WordPress, самостоятельно его настраивает и улучшает для своих клиентов и пользователей.
Настройка страницы 404 WordPress имеет некоторые нюансы, о которых пойдет речь в данной статье. Так для чего необходимо тратить драгоценное время и отдельно создавать страницу ошибки для своего сайта?
Какие функции выполняет страница 404 WordPress
Ошибка 404 означает, что серверу в данную секунду не удалось найти необходимую страницу по ссылке, которую указал пользователь. Существует несколько причин отсутствия страницы по указанному адресу. Или такую страницу никто никогда не создавал, осуществлен переход по битой ссылке, или же ее удалили. Во всех случаях система перенаправляет пользователя на специально подготовленную страницу ошибки.
Пример:
Чтобы не загонять пользователя в тупик после попадания на ошибочную страницу, важно ее оформить максимально понятно и правильно. В противном случае он просто покинет ваш сайт навсегда.
Стилизованная под общую тематику сайта, страница удерживает внимание пользователя и может рекомендовать использовать дополнительные ссылки, которые могут его заинтересовать.
Как сделать страницу 404 WordPress
Как сделать страницу 404 WordPress по всем правилам?
На странице ошибки, которую пользователи покидают реже, чем дефолтную:
— Не должно быть редиректа. Даже если нужной пользователю страницы нет, поисковым роботам необходимо видеть эту информацию. Таким образом ошибочная страница не будет индексироваться.
— Как уже говорилось выше, страницу ошибки рекомендуется оформлять в соответствии с общей тематикой сайта.
— Попросите своих читателей в случае нахождения ссылок, по которым невозможно попасть на нужные страницы, сообщать их вам по указанным координатам.
— На странице ошибки стоит в обязательном порядке указать ссылки и информацию, которая может заинтересовать пользователя. Также рекомендуется разместить форму поиска для удержания своих клиентов.
— Не стоит указывать на 404 странице слишком много технических моментов, лучше оформить и объяснить ситуацию пользователям в простой и понятной форме.
Итак, положим, вы уже работаете в админке WordPress. Чтобы создать страницу ошибки, перейдите в панель управления Внешний вид — Редактор.
Найдите в правом сайдбаре файл 404.php и нажмите на него для редактирования.
Шаг 1.
Шаг 2.
Внедряем форму поиска.
Для этого в код страницы просто нужно вставить следующий элемент кода:
Кстати, вы можете также вставить на страницу ошибки скрипты от Google или Яндекса. С их помощью пользователь сможет сделать запрос в поисковую систему прямо с вашей 404 страницы.
Шаг 3.
Если вы хотите дать возможность пользователям сразу со страницы ошибки перейти к разделам вашего сайта, вставьте следующие дополнительные строки в основной код страницы.
Я уже как-то писал небольшое руководство про ошибку 404, а сегодня решил его немного дополнить.
Как использовать страницу 404
В этих случаях вашим главным приоритетом является посетитель, чтобы он мог легко найти то, что он действительно ищет. Вы также можете добавить некоторый комфорт и легкость странице, сделав ее совместимой с общим видом вашего сайта, и принося искренние извинения.
Так какие же элементы следует добавить на страницу 404? Вы захотите дать своему посетителю несколько разных способов подключения к контенту, который он действительно хочет. Для этого вы можете начать с более общих рекомендаций, а затем попробовать что-то более детальное. Например, форма поиска является обязательной и предлагает пользователям широкий способ повторного обращения к вашему сайту. Убедитесь, что основная страница вашей темы существует на странице, также попадает в эту категорию.
Но самый важный аспект страницы 404 заключается в деталях. В этой статье я расскажу, как на самом деле настроить страницу 404 с помощью WordPress, с несколькими идеями и примерами, которые помогут вам начать работу. Я также поделюсь с вами трюком или двумя, чтобы еще больше улучшить страницу.
Настройка страницы 404
WordPress упрощает создание базовой страницы 404. По сути, он направляет все страницы, которые не найдены, в файл 404.php в каталоге вашей темы. Итак, если вы создаете файл с именем 404.php, вы уже настроили свою страницу 404.
Настройка страницы 404 в дочерней теме
Дочерняя тема строится поверх своей родительской темы и позволяет работать с любыми обновлениями темы, сохраняя при этом все пользовательские элементы, которые вы решили добавить. Я не буду вдаваться во все преимущества дочерней темы или как ее настроить. Для этого я рекомендую отличный пост на моем блоге по этой теме. В этом уроке я буду использовать дочернюю тему Divi, но код является взаимозаменяемым для любой темы.
Ничего особенного пока не происходит. Это всего лишь некоторый стандартный код для настройки вашей страницы. Он добавляет шапку сайта, футер и боковую панель WordPress, как и любая другая страница в вашей теме. В середине я добавил немного текста, извиняясь перед пользователем за ошибку, и предлагая ему попробовать поискать контент, который он хочет туда вставить. Убедитесь, что форма поиска доступна на вашей страницы 404, это важно и хорошее начало, но мы можем сделать лучше. Намного лучше.
Какой контент должен перейти на вашу страницу 404
Чтобы определить, какой контент вы должны добавить на свою страницу 404, сначала нужно оценить, какой тип сайта вы используете. Ваша цель — быстро получить доступ к релевантному контенту, не перегружая его слишком большим выбором. Поиск полезен, но если вы все делаете правильно, на каждой странице вашего сайта будет отображаться панель поиска. На странице 404 вы должны немного сузить круг.
GitHub, например, делает все очень просто. Их страница 404 имеет огромную панель поиска, которая выполняет поиск по всему сайту. Ниже они включили три ссылки в службу поддержки или получить статус GitHub, направляя своих пользователей на новую страницу.
Dropbox использует аналогичный подход, направляя пользователей в те области сайта, где они могут получить поддержку, или обратно на домашнюю страницу. Логические варианты, но не слишком много.
New York Times использует более комплексный подход. Помимо панели поиска и контактной ссылки, они также предоставляют список последних публикаций, которые особенно популярны, в надежде снова заинтересовать читателя.
Ключевые выводы таковы:
- Предоставьте посетителю извинения и полезную информацию
- Ссылка на поддержку или способ связаться с вами в случае возникновения проблем
- Добавьте популярный контент, который приспособлен к фокусу вашего сайта
- Добавьте немного стиля, который добавит впечатления
После того, как вы выяснили, что вы хотите поместить на страницу, следующим шагом будет ее реализация. Вместо того, чтобы заново изобретать колесо и жестко кодировать все наши дополнения с нуля, мы собираемся использовать встроенную функцию WordPress, которая существует уже довольно давно: Widget.
Добавление 404 в виджет sidebar
Другими словами, большинство строительных блоков на странице 404 представлены в виде виджетов. Если мы создадим отдельную область виджетов только для нашей страницы 404, то мы сможем легко добавлять изображения, текст и другой контент в простой визуальный интерфейс и вносить изменения на лету.
Настройка области виджетов
Это устанавливает простую функцию, которая регистрирует наш sidebar (боковую панель, но не обязательно) в WordPress и добавляет немного HTML по умолчанию.
Мы можем начать добавлять виджеты в эту область в админке WordPress, но они пока не появятся на нашей странице. Для этого мы должны добавить нашу новую область виджетов на страницу 404.
Добавление области виджетов на страницу
Давайте вернемся к нашему файлу 404.php. Прямо под блоком текста, который мы добавили, я просто добавлю одну строку кода:
Dynamic_sidebar — это функция, предоставляемая WordPress, которая позволяет отображать область виджета. Просто передайте ему имя, и все виджеты в области виджетов будут автоматически отображаться там, где был размещен код. Теперь пришло время начать добавлять на страницу.
Добавление виджетов на страницу
Моя тема уже включает в себя панель поиска и навигацию в заголовке и поиск на боковой панели, поэтому мне не нужно добавлять ни один из этих элементов. Если ваша тема не содержит этого, было бы неплохо добавить поисковый виджет.
Вы также можете использовать виджет текста, чтобы добавить изображение, которое делает страницу немного более доступной. В текстовом виджете оставьте поле заголовка пустым и используйте HTML, чтобы вставить изображение.
Когда вы добавляете контент, просто будьте лаконичны. Дайте пользователям несколько разных способов доступа к вашему наиболее важному контенту, возможно, добавьте имидж бренда, а затем уйдите с пути. С помощью всего лишь нескольких предложений и нескольких ссылок вы можете быть уверены, что пользователи получат гораздо больше от вашей страницы ошибок.
Пример страницы 404 выглядит немного лучше и содержит всю информацию, которая нужна заинтересованным посетителям.
Последний трюк
Теперь пользователи будут проинформированы о ссылке, которую они пытались посетить сразу.
Конечно, это только одна идея. С этой конкретной переменной можно сделать гораздо больше, например, отображать результаты поиска на основе URL-адреса страницы или использовать ее, чтобы попытаться угадать, какой может быть страница. Поскольку вы добавляете контент на свою страницу 404, стоит помнить об этом на случай, если это поможет.
Ну а я на этом буду заканчивать, до скорых встреч!
Жду вас через три дня!
Занимаюсь созданием сайтов на WordPress более 6 лет. Ранее работал в нескольких веб-студиях и решил делиться своим опытом на данном сайте. Пишите комментарии, буду рад общению.
Читайте также: