Как сделать красивую страницу 404 для WordPress

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

Давайте же рассмотрим как сделать красивую страницу 404 для WordPress.

Ошибка 404 или Not Found информирует о том, что сервер не может найти данные согласно запроса.

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

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

До сегодняшнего дня текстовое содержание данной страницы моего блога выглядело следующим образом:

Красивая страница 404 для WordPress. Как ее сделать?

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

Увидев страницу подобного содержания, читатель с большой долей вероятности просто уйдет с ресурса, что допускать крайне нежелательно.

Именно по этой причине я и решил сделать для своего блога красивую страницу 404.

Как сделать красивую страницу 404 для WordPress?

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

Для начала я определю то, что нам нужно отобразить на странице 404:

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

Таков фронт работ, переходим от слов к делу.

Для проведения манипуляций с файлом 404.php я воспользуюсь доступом к файлам на хостинге посредством FTP.

О том, как настроить FTP-клиент для доступа к файлам на хостинге я писал здесь.

Вы также можете воспользоваться внутренним редактором WordPress, который доступен в админ-панели по вкладке Внешний видРедакторШаблон ошибки 404 (404.php).

Я сразу приведу код моего файла 404.php, который вы можете использовать у себя на сайте:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php get_header(); ?>
<div id="content">
<div class="entry">
<img src="http://ваш сайт/wp-content/themes/название темы/images/404.jpg">
<p><?php _e('Попробуйте найти интересующую Вас страницу с помощью формы поиска:', 'название темы_lang'); ?></p>
<p><?php get_search_form(); ?></p>
<?php wp_reset_query(); ?>
<p><?php _e('Или воспользуйтесь разделом ', 'название темы_lang'); ?><a title="Все статьи блога" href="http://ваш сайт/karta-sajta" target="_blank">все статьи блога</a><?php _e(', где Вы найдете очень много полезной информации!', 'название темы_lang'); ?></p>
<p><?php _e('А это самые свежие статьи блога:', 'название темы_lang'); ?></p>
<ul>					
<?php query_posts('post_type="post"&post_status="publish"&showposts=10'); ?>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<li><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
<?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_query(); ?> 
</ul>
<p style="text-align: right;">С уважением, <a href="http://ваш сайт.ru/" target="_blank" rel="nofollow">Имя</a>!</p>				
</div>
</div>			
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Теперь разберем подробно за что отвечает каждый фрагмент кода.

Нас интересуют следующие строки:

  • строка 4 — вставка изображения. Конечно это не обязательно, но с картинкой данная страница будет выглядеть гораздо красивее. Кстати, именно посредством картинки я реализовал информирование читателя о том, что запрошенная страница не найдена. Не забудьте закинуть файл картинки на хостинг и прописать верный путь к этому файлу.
  • строка 5 — вставка текстового фрагмента.
  • строка 6 — код формы поиска.
  • строка 7 — конструкция, которая аннулирует данные последнего запроса.
  • строка 8 — вставка текстового фрагмента и ссылки на карту сайта.
  • строка 9 — вставка текстового фрагмента.
  • строки 10-17 — конструкция, отвечающая за вывод последних (по дате публикации) записей блога. Конструкция showposts=10 определяет количество выводимых записей. Я задал 10, вы можете выбрать любое другое количество.
  • строка 18 — вставка текстового фрагмента и ссылки.

Не забудьте везде в коде заменить название темы и ваш сайт на свои.

В конечном итоге у меня получилась вполне себе красивая страница 404 для WordPress:

Красивая страница 404 для WordPress. Как ее сделать?

Согласитесь, по сравнению с исходным вариантом стало гораздо красивее и информативнее.

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

Наша цель достигнута!

Комментарии 5

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

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

Adblock
detector