Главная » Ведение блога » Что такое хлебные крошки и как их сделать на сайте wordpress без плагина

Что такое хлебные крошки и как их сделать на сайте wordpress без плагина

хлебные крошки на сайте это

Здравствуйте, уважаемые друзья!
Продолжаю писать для вас посты, а так как завтра Николая и я буду праздновать, то решил написать и сегодня smile. В данной статье вы узнаете, что такое хлебные крошки и для чего они нужны, а также я поделюсь с вами кодом, с помощью которого можно вывести красивые хлебные крошки для wordpress.

Когда я впервые столкнулся с определением «хлебные крошки» то честно сказать сам не знал что же это такое. И действительно название не очень подходящее. Но потом узнал, что это всего лишь простой элемент навигации сайта. На моем блоге крошки выглядят следующим образом:

как сделать хлебные крошки в wordpress

Думаю, теперь уже стало понятно, что такое хлебные крошки. А сейчас я напишу, для чего они нужны:

  1. Улучшают навигацию сайта. Если разместить хлебные крошки на сайт, то посетитель сразу увидит в какой категории он находиться, а также в любой момент может подняться на уровень выше. Для сайтов с большим количеством вложенных страниц советую обязательно использовать хлебные крошки, это очень важный элемент внутренней оптимизации сайта.
  2. Улучшают внутреннюю перелинковку. Если взглянуть на хлебные крошки, которые размещены на моем сайте, то сразу видно, что со всех страниц идет ссылка на главную и на рубрику, таким образом, эти страницы получают наибольший вес, что очень хорошо. Категорию можно продвинуть по какому-нибудь ключевому слову. А что касается главной страницы, то я считаю, что ее нужно обязательно продвигать по высокочастотному запросу.
  3. Улучшают индексацию сайта. Хлебные крошки – это всего лишь внутренние ссылки. Если робот перейдет на страницу сайта, то он будет «ходить» по этим ссылкам. Таким образом можно сделать вывод, что поисковик будет быстрее находить другие посты вашего ресурса и индексировать их.
  4. Влияют на URL-ы в выдаче. Если на сайте присутствуют хлебные крошки, то поисковые системы иногда показывают их в выдаче. А это позволяет увеличить CTR и соответственно посещаемость вашего ресурса.
  5. Улучшают релевантность страницы. Практически все оптимизаторы прописывают ключевое слово в заголовке H1. Так вот, если сделать хлебные крошки, то этот заголовок будет дублироваться на странице, и соответственно будут дублироваться ключевые слова smile.

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

Делаем хлебные крошки без плагина

Для того, чтобы сделать хлебные крошки без плагина в wordpress, нужно сначала открыть файл functions.php и вставить туда вот такой код, который я нашел в интернете:

function dimox_breadcrumbs() {
  $showOnHome = 0;
  $delimiter = '»';
  $home = 'Главная';
  $showCurrent = 1;
  $before = '<span class="current">';
  $after = '</span>';
  global $post;
  $homeLink = get_bloginfo('url');
  if (is_home() || is_front_page()) {
    if ($showOnHome == 1) echo '<div id="menn"><a href="' . $homeLink . '">' . $home . '</a></div>';
  } else {
    echo '<div id="menn"><a href="' . $homeLink . '">' . $home . '</a> ' . $delimiter . ' ';
    if ( is_category() ) {
      global $wp_query;
      $cat_obj = $wp_query->get_queried_object();
      $thisCat = $cat_obj->term_id;
      $thisCat = get_category($thisCat);
      $parentCat = get_category($thisCat->parent);
      if ($thisCat->parent != 0) echo(get_category_parents($parentCat, TRUE, ' ' . $delimiter . ' '));
      echo $before . single_cat_title('', false). $after;
    } elseif ( is_day() ) {
      echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
      echo '<a href="' . get_month_link(get_the_time('Y'),get_the_time('m')) . '">' . get_the_time('F') . '</a> ' . $delimiter . ' ';
      echo $before . get_the_time('d') . $after;
    } elseif ( is_month() ) {
      echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
      echo $before . get_the_time('F') . $after;
    } elseif ( is_year() ) {
      echo $before . get_the_time('Y') . $after;
    } elseif ( is_single() && !is_attachment() ) {
      if ( get_post_type() != 'post' ) {
        $post_type = get_post_type_object(get_post_type());
        $slug = $post_type->rewrite;
        echo '<a href="' . $homeLink . '/' . $slug['slug'] . '/">' . $post_type->labels->singular_name . '</a> ' . $delimiter . ' ';
        if ($showCurrent == 1) echo $before . get_the_title() . $after;
      } else {
        $cat = get_the_category(); $cat = $cat[0];
        echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
        if ($showCurrent == 1) echo $before . get_the_title() . $after;
      }
    } elseif ( !is_single() && !is_page() && get_post_type() != 'post' && !is_404() ) {
      $post_type = get_post_type_object(get_post_type());
      echo $before . $post_type->labels->singular_name . $after;
    } elseif ( is_attachment() ) {
      $parent = get_post($post->post_parent);
      $cat = get_the_category($parent->ID); $cat = $cat[0];
      echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
      echo '<a href="' . get_permalink($parent) . '">' . $parent->post_title . '</a> ' . $delimiter . ' ';
      if ($showCurrent == 1) echo $before . get_the_title() . $after;
    } elseif ( is_page() && !$post->post_parent ) {
      if ($showCurrent == 1) echo $before . get_the_title() . $after;
    } elseif ( is_page() && $post->post_parent ) {
      $parent_id  = $post->post_parent;
      $breadcrumbs = array();
      while ($parent_id) {
        $page = get_page($parent_id);
        $breadcrumbs[] = '<a href="' . get_permalink($page->ID) . '">' . get_the_title($page->ID) . '</a>';
        $parent_id  = $page->post_parent;
      }
      $breadcrumbs = array_reverse($breadcrumbs);
      foreach ($breadcrumbs as $crumb) echo $crumb . ' ' . $delimiter . ' ';
      if ($showCurrent == 1) echo $before . get_the_title() . $after;
    } elseif ( is_search() ) {
      echo $before . 'Результаты поиска по запросу "' . get_search_query() . '"' . $after;
    } elseif ( is_tag() ) {
      echo $before . 'Записи с тегом "' . single_tag_title('', false) . '"' . $after;
    } elseif ( is_author() ) {
      global $author;
      $userdata = get_userdata($author);
      echo $before . 'Статьи автора ' . $userdata->display_name . $after;
    } elseif ( is_404() ) {
      echo $before . 'Error 404' . $after;
    }
    if ( get_query_var('paged') ) {
      if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ' (';
      echo __('Page') . ' ' . get_query_var('paged');
      if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ')';
    }
    echo '</div>';
  }
} // end dimox_breadcrumbs()

После этого нужно вставить еще один кусочек кода туда, где вы хотите видеть крошки на своем сайте. Как правило это файл single.php или index.php:

<?php if (function_exists('dimox_breadcrumbs')) dimox_breadcrumbs(); ?>

Ну и, конечно же, нужно прописать стили для хлебных крошек. У меня они выглядят так:

#menn {
font-size: 11px;
border: 1px solid #E6E6DF;
border-radius: 7px 7px 7px 7px;
margin-bottom: 25px;<br />color: #64A42B;
margin-top: -7px;
padding: 10px; }

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

Делаем хлебные крошки с помощью плагина Breadcrumb NavXT

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

Для начала скачайте плагин по этой ссылке потом необходимо распаковать его и активировать. Если хотите произвести настройки плагина, то зайдите в Панель управления — Настройки — Breadcrumb NavXT. Здесь я советую перейти на вкладку «основные» и поставить галочку напротив надписи: «Показывать текущую позицию в виде ссылки». Это позволит улучшить внутреннюю перелинковку. Для того чтобы в хлебных крошках отображалась ссылка на главную страницу, нужно вставить свой шаблон рядом с надписью «шаблон ссылки на главную». Я вставил вот такой код:

<a title="Перейти на главную" href="http://vachevskiy.ru/" class="vachevskiy">Vachevskiy.ru</a>

Вам нужно здесь изменить анкор и ссылку на главную страницу своего сайта: красивые хлебные крошки для wordpress Ми сделали все настройки, теперь нужно вставить еще один кусочек кода, для того, чтобы вывести крошки на сайт:

<div class="menn">
<?php
if(function_exists('bcn_display'))
{
 bcn_display();
}
?>
</div>

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

#menn {
font-size: 11px;
border: 1px solid #E6E6DF;
border-radius: 7px 7px 7px 7px;
margin-bottom: 25px;<br />color: #64A42B;
margin-top: -7px;
padding: 10px; }

Получилось вот так:

хлебные крошки в вордпресс

Как видите, разницы нет, как делать хлебные крошки. Можно с помощью функции, а можно с помощью плагина Breadcrumb NavXT. Но я все же советую воспользоваться первым вариантом, так как он требует меньше ресурсов.

На этом все на сегодня. До встречи в следующих постах.

vachevskiy 18 декабря 2013

Отвечаю здесь всем ;)