Как настроить страницу 404 WordPress?

страница 404 для сайта

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

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

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

Интересная страница 404 способна удержать пользователя на сайте и увести его в увлекательное путешествие по другим страницам. Как настроить страницу 404?

    Содержание статьи

  1. Секрет идеальной страницы 404
  2. Как настроить страницу 404 WordPress?
  3. Где в WordPress страница 404?
  4. Идеальная страница 404 для сайта: добавляем виджеты
  5. Как сделать 404 страницу с помощью плагина «404page»?

Секрет идеальной страницы 404

    Привлекательная страница 404 может содержать несколько незаменимых элементов.

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

Вот несколько примеров оригинальных страниц ошибки 404.

Справка Scout − надпись и картинка с юмором
Kualo − браузерная игра
MailChimp − удачная анимация

А вот как реализована эта страничка на нашем сайте.

Как настроить страницу 404 WordPress?

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

Стандартная страница 404 выглядит очень скромно, но её можно сделать намного приветливее.

Почти каждая тема WordPress содержит шаблон страницы 404.php. Файл 404.php вы можете найти в папке установленной темы.

Где в WordPress страница 404?

Где в Вордпрессе страница 404? «Внешний вид» — «Редактор» — правая колонка «Шаблоны» — «404.php».

Скачайте этот файл на компьютер, сохраните его копию в отдельной папке и отредактируйте код на свой вкус, следуя нашим подсказкам.

Как сделать страницу ошибки 404, если в теме WordPress нет файла 404.php?

  1. Создайте пустой файл 404.php.
  2. Откройте его на редактирование.
  3. Вставьте готовый код, представленный ниже.
  4. Задайте путь к своему собственному изображению в строке #8.
  5. Измените заголовок в строке #9.
  6. Напишите своё обращение к посетителям в строке #11.
  7. Сохраните изменения.

Готовый код выглядит так:

<?php get_header(); ?>
<div id="main-content">
<div class="container">
<div id="content-area" class="clearfix">
<div id="left-area">
<article id="post-0" <?php post_class
( 'et_pb_post not_found' ); ?>>
<img src="/image.jpg">
<h1><?php esc_html_e('Страница не найдена','WP Loop'); 
?></h1>
<p><?php esc_html_e(' О, нет! Страница, которую вы открыли не существует. Пожалуйста, воспользуйтесь ссылками ниже, чтобы перейдите в более безопасное место.', 'WP Loop'); ?></p>
</article> <!-- .et_pb_post -->
</div> <!-- #left-area -->
<?php get_sidebar(); ?>
</div> <!-- #content-area -->
</div> <!-- .container -->
</div> <!-- #main-content -->
<?php get_footer(); ?>

Как сделать страницу ошибки 404, если в теме WordPress есть готовый файл 404.php?

Скачайте файл на компьютер и откройте его в Блокноте.

В стандартной теме Twenty Eleven в файле 404.php содержится вот такой код.

<?php
/**
 * Template for displaying 404 pages (Not Found)
 *
 * @package WordPress
 * @subpackage Twenty_Eleven
 * @since Twenty Eleven 1.0
 */
get_header(); ?>
	<div id="primary">
		<div id="content" role="main">
			<article id="post-0" class="post error404 not-found">
				<header class="entry-header">
					<h1 class="entry-title"><?php _e( 'This is somewhat embarrassing, isn’t it?', 'twentyeleven' ); ?></h1>
				</header>
				<div class="entry-content">
					<p><?php _e( 'It seems we can’t find what you’re looking for. Perhaps searching, or one of the links below, can help.', 'twentyeleven' ); ?></p>
					<?php get_search_form(); ?>
					<?php the_widget( 'WP_Widget_Recent_Posts', array( 'number' => 10 ), array( 'widget_id' => '404' ) ); ?>
					<div class="widget">
						<h2 class="widgettitle"><?php _e( 'Most Used Categories', 'twentyeleven' ); ?></h2>
						<ul>
						<?php wp_list_categories( array( 'orderby' => 'count', 'order' => 'DESC', 'show_count' => 1, 'title_li' => '', 'number' => 10 ) ); ?>
						</ul>
					</div>
					<?php
					/* translators: %1$s: smilie */
					$archive_content = '<p>' . sprintf( __( 'Try looking in the monthly archives. %1$s', 'twentyeleven' ), convert_smilies( ':)' ) ) . '</p>';
					the_widget( 'WP_Widget_Archives', array( 'count' => 0, 'dropdown' => 1 ), array( 'after_title' => '</h2>' . $archive_content ) );
					?>
					<?php the_widget( 'WP_Widget_Tag_Cloud' ); ?>
				</div><!-- .entry-content -->
			</article><!-- #post-0 -->
		</div><!-- #content -->
	</div><!-- #primary -->
<?php get_footer(); ?>

Вы можете сделать страницу 404 WordPress намного функциональнее. После изменений код будет выглядеть примерно вот так.

<?php
/**
 * Template for displaying 404 pages (Not Found)
 *
 * @package WordPress
 * @subpackage Twenty_Eleven
 * @since Twenty Eleven 1.0
 */
get_header(); ?>
	<div id="primary">
		<div id="content" role="main">
			<article id="post-0" class="post error404 not-found">
				<header class="entry-header">
					<h1 class="entry-title"><?php _e( 'This is somewhat embarrassing, isn’t it?', 'twentyeleven' ); ?></h1>
				</header>
				<div class="entry-content">
<img src="https://foxyforex.ru/wp-content/uploads/2023/06/free-404-error.jpg">
<div>Упс! Мы просмотрели всё, но эта страница пропала из видимости. Попробуйте вернуться на базу, на <a href="https://foxyforex.ru/">Главную</a>, или отправиться в путешествие по одной из ссылок.</div> 
<ul id="so"><li><a href="https://foxyforex.ru/zarabotok-v-internete/kak-zarabotat-na-etxt-ru-novichku">"Как заработать на Etxt.ru новичку?"</a></li>
<li><a href="https://foxyforex.ru/motivatory-pro-uspeh">"Мотиваторы на успех"</a></li>
<li><a href="https://foxyforex.ru/sozdanie-saita/kak-sdelat-soderzhanie-stati-na-sajte">"Как сделать содержание для статьи на сайте?"</a></li>	</ul>				</div>
					<?php get_search_form(); ?>
					</div>
				</div><!-- .entry-content -->
			</article><!-- #post-0 -->
		</div><!-- #content -->
	</div><!-- #primary -->
<?php get_footer(); ?>

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

Так как настроить страницу 404 в этом случае? Откройте файл 404.php с помощью Блокнота, выберете команду «Сохранить как», отметьте вариант «Все файлы», задайте кодировку UTF-8 и подтвердите изменения. После обновления файла на сайте, у вас появится сообщение на русском языке.

Идеальная страница 404 для сайта: добавляем виджеты

сделать 404 страницу

Вы успешно создали простой шаблон страницы 404. На странице 404 вы увидите иллюстрацию, приветственное сообщение и стандартные колонтитулы, присутствующие и на других страницах.

Пока страничка 404 далека от совершенства. На ней нет виджетов.

Чтобы добавить новые виджеты специально для страницы 404, создайте новую расширенную область для размещения виджетов.

В некоторых темах WordPress можно создавать новые расширенные области прямо на панели мониторинга. Проследуйте по пути: «Внешний вид» -> «Виджеты». Если вам повезет, вы сможете создать эту область одним щелчком. Если такой возможности нет, давайте пойдём другим путём.

Скачайте и откройте на редактирование файл functions.php. О том, как это сделать аккуратно и без риска для сайта читайте в этой статье.

В конце содержимого файла вставьте код:

function widget_area_404() {
register_sidebar( array(
'name' => '404 Page',
'id' => '404',
'description' => __( 'Widgets for 404 error page.' ),
'before_widget' => '<div class="et_pb_post">',
'after_widget' => '</div>',
'before_title' => '<h4 class="widgettitle">',
'after_title' => '</h4>',
) );
}
add_action( 'widgets_init', 'widget_area_404' );

Сохраните изменения и закачайте файл на сервер.

Скачайте и откройте 404.php файл.

Скопируйте следующую строчку кода и поместите её в то место, где вы хотите вывести новые виджеты, например, под приветственным обращением к посетителям.

<?php dynamic_sidebar( '404'); ?>

Сохраните изменения и закачайте файл на сервер.

Вы создали в WordPress новую область виджетов. Теперь добавьте в неё нужные виджеты.

Пройдите по пути «Внешний вид» -> «Виджеты». Выберите «Свежие записи», «Популярные публикации» или другой виджет, который вы хотели бы видеть на своей странице 404.

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

Вы выполнили все рекомендации? Поздравляем! Теперь у вас появилась новая страница 404. Она будет загружена любому посетителю при попытке перехода на несуществующую страницу.

Как сделать 404 страницу с помощью плагина «404page»?

страница 404 для сайта как сделать

Благодаря плагину «404page» каждый вебмастер может с лёгкостью сделать 404 страницу с интересными возможностями.

Плагин имеет 100 000 активных установок и почти идеальный рейтинг – 4,9 звезды из 5. В этих обстоятельствах разработчик плагина заслуживает особой признательности!

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

страница 404 для сайта как сделать

Настройка плагина «404page»

Установите и активируйте плагин.

Создайте страницу 404 так же, как вы делаете остальные страницы вашего сайта.

На панели управления WordPress перейдите в раздел «Внешний вид» -> «Страница ошибки 404» и выберите страницу, которую вы только что создали, для обработки ошибки 404.

Теперь вы знаете, как сделать страницу ошибки 404. Вы можете оформить её в стиле вашего сайта и разместить на ней ссылки на самые интересные статьи.

 

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