Домой / WordPress / Полезное / Страница 404 и страница текст не найден
Страница 404
Страница 404

Страница 404 и страница текст не найден

По просьбе читателей пишу это небольшую статью, в которой объединю 2 момента:

1. Создание, так называемой, страницы ошибки 404 - это случай, когда по введённому адресу страница не найдена.
2. Создание страницы для случая, когда не найден текст, введённый через поисковую форму сайта.

По первому случаю в Сети достаточно информации, так-как ошибка 404 одна из наиболее узнаваемых в Интернет. Дело в том, что именно с ней сталкиваются пользователи при попытке посетить нерабочие (битые и мёртвые) ссылки. А такие ситуации возникают довольно часто ибо ничто не вечно в этом тленном мире и статьи могут быть удалены или перемещены на другой адрес. Большинство веб-серверов, при этом, по умолчанию выводят страницы HTML, на которых отображен код 404 и фраза «Not Found», различные системы могут интерпретировать эту фразу как, например: «Страница не найдена».

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

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

Ну и давайте уже перейдём к делу. Сделаем эти страницы применительно к WordPress.

Если набрать в поиске фразу «страница 404 wordpress», то на выходе получим множество рекомендаций по созданию правильных страниц ошибки 404, но вот про вторую часть - «Текст не найден» я что-то ничего не нашёл. Может плохо искал, но, в принципе, не особо и старался. Однако, всё по порядку.

Страница 404 WordPress

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

Важно!

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

За вывод 404 страницы отвечает одноименный файл 404.php. У меня он изначально был таким:

Страница не найдена

У Вас будет так или почти так. Обратите внимание, что изменению или замене подлежит только одна строчка! Без знания особенностей движка WordPress остальные элементы страницы желательно не трогать.

Но тут возникает вопрос, что-же вставить вместо этой самой строки? Особенно актуально этот вопрос звучит для тех, кто далёк от всякого кодирования будь то PHP, CSS или просто HTML-разметка. И вот тут очень полезным окажется совет, который я увидел на замечательном блоге Анжелики $оковой. Суть его сводится к тому, что надо просто создать новую запись, оформить её так, как должна по Вашему мнению выглядеть страница 404, со всеми картинками, ссылками и прочим. Естественно, что запись эту публиковать не надо. Когда все будет готово, переходите с визуального редактора на редактор текста, копируете весь код оттуда и вставляете вместо той самой строки в файл 404.php.

Вот каким файл получился у меня:

Страница не найдена

Если надо вставить на эту страницу форму поиска по сайту, то обратите внимание на код подсвеченный зелёным цветом.

Собственно сама форма вставляется кодом <?php get_search_form(); ?>

 Но я предпочел вставить её с тем DIV-ом, в который она была вставлена у меня в сайдбаре. Это для того, чтобы не потерять форматирование формы. Какой именно блок используется у Вас можете посмотреть в файле Вашей темы - это может быть что-то из набора sidebar.php, sidebar-left.php и т.д... либо, если форма размещена в хидере, header.php.

 

 

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

Но... у каждого свой вкус - кому-то дело, а кому-то рюшечки...

И вот теперь настал момент поговорить о другой странице, той самой, которая появляется когда на сайте просто не найден искомый текст.

Страница «Текст не найден»

На описание создания этой страницы уйдёт всего пару слов, поскольку для неё актуально буквально все, что говорилось о странице ошибки 404. За исключением того, что за её вывод отвечает файл search.php и ещё одного нюанса.

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

Схематично это выглядит так:

Если поиск дал результат

         Вывести результаты

иначе

       Вывести сообщение, что текст нет найден

В коде моего шаблона это выглядит так (в своём смотрите по аналогии):

<?php get_header(); ?>
<div class="outer" id="contentwrap">
    <?php get_sidebars('left'); ?>
	<div class="postcont">
		<div id="content">

	<?php if (have_posts()) : ?>

		<h2 class="pagetitle">Результаты поиска</h2>

		<?php while (have_posts()) : the_post(); ?>

			<div <?php post_class('post') ?>>
                <h2 class="title"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
				<div class="postdate"><img src="<?php bloginfo('template_url'); ?>/images/date.png" /> <?php the_time('F jS, Y') ?> <img src="<?php bloginfo('template_url'); ?>/images/user.png" /> <?php the_author() ?> <?php if (current_user_can('edit_post', $post->ID)) { ?> <img src="<?php bloginfo('template_url'); ?>/images/edit.png" /> <?php edit_post_link('Edit', '', ''); } ?></div>
				<div class="entry">
                    <?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { the_post_thumbnail(array(200,160), array("class" => "alignleft post_thumbnail")); } ?>
					<?php the_excerpt() ?>
                    <div class="readmorecontent">
						<a class="readmore" href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">Read More &raquo;</a>
					</div>
				</div>
        	</div>

		<?php endwhile; ?>

		<div class="navigation">
			<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); } else { ?>
			<div class="alignleft"><?php next_posts_link('&laquo; Older Entries') ?></div>
			<div class="alignright"><?php previous_posts_link('Newer Entries &raquo;') ?></div>
			<?php } ?>
		</div>

	<?php else : ?>

<h2>Записей не найдено. Попробуйте использовать поиск.</h2>
	<?php get_search_form(); ?>

	<?php endif; ?>

		</div>
	</div>

<?php get_sidebars('right'); ?>
</div>
<?php get_footer(); ?>

 

В данном случае менять можно то, что заключено между строк 36 - 38... Посмотрите на картинке - подсвечено жёлтым.

Что можно менять

У Вас код может быть несколько иным, но принцип остаётся тот-же.

И вот что я вставил у себя вместо этих двух строчек:

<div id="content">    
    <h1 class='headline4'>Не нашли то, что искали?</h1>
    <table border="0">
    <tbody>
    <tr><td>
    <p><img title="Не найден текст?" alt="Не найден текст?" src="http://s013.radikal.ru/i325/1404/3c/40ce8421b015.jpg" width="166" height="164" /></p>
    <div id="topsearch">
       <?php get_search_form(); ?>
    </div>
    </td><td>
    <p><span style="color: #003366; font-size: large;"><em>Ну раз Вы здесь, то что-то пошло не так и искомый текст не найден.</em></span></p>
    <p><span style="color: #003366; font-size: large;"><em>Однако это совсем не означает, что здесь нет того, что Вы ищете, попробуйте другое словосочетание...</em></span></p>
    </td></tr>
    </tbody>
    </table>
    <div><div><p><span style="color: #003366; font-size: 14px;"><em>Если все-же не получится - перейдите на<strong> <a href="//obg.kz/"><span style="color: #003366;">Главную страницу</span></a></strong>, там отображаются все новые статьи или <strong>, изменив искомую фразу, воспользуйтесь поиском еще раз...</strong>.
   </div></div></em></span></p>
</div>            		

 

Посмотреть результат можно если в поисковую форму вбить какую-либо бессмыслицу...

Что еще остаётся добавить? Думаю, что обе страницы одинаково важны, но всё-же хотелось бы, чтобы они оказались как можно менее востребованными, а посетители как можно более терпеливыми.

Удачи Вам и до встречи на моём блоге!

Смотрите также

Огни большого города http://obg.kz

Как масштабировать изображения в CSS

В этой статье поделюсь способом как масштабировать изображения в css.    Конечно-же придуман этот способ …

Огни большого города http://obg.kz

Как по клику на кнопке открыть страницу в новой вкладке

Как по ссылке открыть страницу в новой вкладке знают все. Добавляем в ссылку атрибут target="_blank" …

38 комментариев

  1. Отличная статья, спасибо)) 404  страничка у меня есть, а вот ошибка в поиске по сайту не очень привлекательно выглядит, надо над этим поработать и очень поможет Ваша статья, Александр

    • Это Вам спасибо! Я вообще забыл про эти страницы за текучкой дел… И если-бы не Вы и не Ваша статья про аудит, то и не вспомнил-бы. По крайней мере очень долго …

  2. Нет действительно спасибо. Давно хотел сделать эту страницу, но не знал как. Теперь воспользуюсь Вашей статьей и попробую осуществить данное деяние. Спасибо еще раз. С уважением Андрей.

  3. Евгений

    Классная статья, спасибо тоже себе надо отредактировать 404 страницу

    • Евгений, спасибо!

      Главное не смущаться, если код Вашего шаблона будет иным. По структуре они все одинаковы и разобраться в нем по смыслу можно.

      • Евгений

        Всё отлично, отредактировал свою страницу 404, да немножко по другому код был, ну всё понятно в принципе  быстро всё сделал)))

        • Посмотрел Вашу страничку — отлично получилось!
          Да, Вы правы, даже если код шаблона разный, то базовая структура у них всех одинаковая — разобраться можно.
          Удачи!

  4. Александр, у меня возник к вам вопрос: если у меня стоит поиск от Google, там никак не получится сделать нечто подобное, когда пользователь вводит неправильное слов? Чтобы не просто писалось «результатов нет», а как-то поинтересней.
    Я, кстати, тоже сделала себе страницу 404, но не такую лаконичную, как у вас. Мне кажется, что все зависит от тематики блога. И все-таки страница 404 должна быть интересной, ведь вы сами писали, что она должна быть привлекательной и удержать человека на блоге. А лаконичность и рюшечки, это, как на мой взгяд, две не очень привлекательные крайности. Можно обойтись и без рюшечек, но дать человеку понять, что ему здесь рады. 
    Хотя, не могу не согласиться, что нет ничего более отталкивающего, чем рюшечки на сайте 😉

    • Ольга, не совсем понял, что Вы имеете в виду. Вот у меня, как раз на 404 странице, стоит поиск от Яндекс. Он сам все исправляет, как надо.

      Если Вы не об этом, тогда поясните, о чём…

       Вашу 404 страницу я видел — очень удачно Вы её сделали… Насчет лаконичности… Я останусь при своём мнении — никто текстов не читает. Особенно когда много букв, особенно, когда попал не туда.

      Вы посмотрите на это с другой стороны — посетитель уже понял, что искомого тут нет, у него подсознательно уже сложилось — 2 или 3 секунды на окончательное осознание провала миссии (не чтение текста, он в это время смотрит внутрь себя) и еще пол-секеунды на прощальный взгляд на страницу перед уходом.

      И вот в этот момент ему и надо дать короткие как выстрел команды — тебе сюда или вот сюда. Более длинную структуру предложения он практически не воспримет и изящным текстом тут его не пронять. Я бы сказал — 85% посетителей поступают именно так.

  5. Спрашивал почти где только мог. Конкурс на 404 страницу проводится где-то у кого-то. Буду благодарен за информацию. Сам найти не смог.

    • Алексей, к сожалению я про такие конкурсы ничего не знаю, да и не участвую я в них…

      А Вы хотите поучаствовать?

      • Хочу. Пока у меня 404 страница на «отвали» сделана. А вот идея есть классная для 404 ошибки, просто стимула не хватает, так как времени надо много затратить 🙁

        • Забил в поиск «конкурс страницы 404» и тоже ничего не нашёл. Только старые конкурсы… А кто Вам мешает самому такой конкурс организовать? Думаю, желающие поучаствовать-бы нашлись…

          • Может еще так и сделаю. Но тематика немного другая. Мне конкурсы по фотографии делать нужно, чтобы блог продвигать. Но может еще и сделаю, если не найду

  6. Евгений

    Этот пост о том как изменить внешний вид страницы «Ничего не найдено».
    А как сделать чтобы страница «Ничего не найдено» полноценно отдавало 404 ошибку сервера???
    Вот у вас страница «Ничего не найдено» отдает ответ сервера HTTP/1.1 200 OK

    • Здесь я менял шаблон и та страница, о которой речь в статье не работает. Я её несколько позже восстановлю… Вроде там сервер и отдаёт конкретно 404 ошибку.

    • Хотя, чего это я? И сейчас возвращает ошибку 404 HTTP/1.1 404 Not Found

      • Евгений

        Не совсем так, это страница 404 отдает правильный ответ сервера https://obg.kz/ошибка
        А вот страница “Ничего не найдено” отдает 200 ок.
        К примеру чтобы получить страницу “Ничего не найдено” наберем в поиске по сайту 777777777777777 и получим ответ что ничего не найдено, копируем ссылку в браузере https://obg.kz/?s=777777777777777 и проверяем ответ сервера.

        • Евгений, просто Вы путаете понятия. 404 ошибка возникает только тогда, когда не найдена запрашиваемая страница. Отсутствует конкретно заданный URL. Что я и показал. А то, о чём Вы говорите — это поиск вхождения текста в статьях… Тут Вы не запрашиваете конкретный адрес страницы и ответ сервера 404 не может быть сформирован ни при каких условиях.

          • Евгений

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

          • Я, кстати, как раз и есть программист… 06

            Технически, как Вы и говорите, решить-то можно, только стратегически такой подход в корне неверен.

            А главное — ЗАЧЕМ?

            20

          • Евгений

            Для чего это надо?!!! Таким образом избежать недоброжелателей которые могут ссылаться на вас. К примеру если в поиск Яндекса недоброжелатель добавит страницу http://сайт.ри/?s=порно и т.д. (где порно может быть все что угодно) то Яндекс посчитает за существующую страницу на сайте. Ответ сервера 404 позволяет отдавать информацию Яндексу что страница не существует.

        • Евгений, ну вот я забил в поиск Яндекса Ваш пример…

          И чем-же мне навредит подобный запрос?

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

          Вы, по-моему, не с тем боретесь…

          • Евгений

            Александр, это на своих сайтах хочу сделать а на вашем просто привожу пример. Можете подсказать кусочком кода19 (в долгу не останусь).
            Нет, ПС адекватно относится (индексирует только те страницы которые отдают 200 ok). Но в индекс ПС легко попадут такие страницы как указаны выше, по той причине что отдают 200 ok заместо 404.
            В вашем случае можно за 1-2 недели скормить ссылку ПС чтобы он ее проиндексировал и стал учитывать, поэтому выше в посте я не стал делать ссылку активной.
            Я написал вам письмо в ЛС, можете помочь?

          • Евгений, я ответил Вам на письмо. Там есть ссылки, поищите решения. Вот нет возможности у меня этим заниматься. Если честно, то и желания…

          • Евгений

            Странно, письмо не получил. Я писал в форму связи в верху справа на странице. Можете продублировать на почту? только не на эту которая в комментариях)))

          • Переслал то-же письмо ещё раз…

  7. Александр, а у Вас есть статья про robots.txt? Я его несколько месяцев назад поменяла по совету одного веб-мастера, а сейчас смотрю,что стало только хуже. Много страниц теперь робот вообще не читает. И 404 страницы появились.(((

    • Ирина, про robots.txt у меня статьи нет. Когда-то взял за правило не писать о том, о чём уже писано-переписано в Сети… Ничего нового здесь сказать не могу, поэтому и не пишу…

      • Это конечно правильно,просто думала,может у Вас еще поучусь.Что-то мне мой не особо нравится, а что с ним делать не знаю(. Ну нет, так нет. Буду разбираться. Спасибо за ответ).

  8. Александр, а я не Ваш скопировала))))). Просмотрела несколько и выбрала,который понравился). Посмотрю, что будет.

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

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