No Image

Супер быстро сделать хлебные крошки для wordpress блога.

СОДЕРЖАНИЕ
10
29 января 2019

хлебные крошки без плагина
Приятного времени суток всем читателям на wpsovet.ru. Сейчас будет не очень большая статья, в которой разберем так называемые хлебные крошки для wordpress блогов. Для начала разберемся что такое, и зачем нужно, это путь до данной статьи, который показывается наглядно, обычно, в теле статьи, у меня это выглядит так.
внешний вид хлебных крошек

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

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

Создаем php файл.

Ничего сложного просто заходим в свой любимый редактор кода, я выберу natepad++, создаем новый файл и вставляем туда вот такой код.





<div class="breadcrumbs">
   <?php if (is_home()) { ?>  
 
  <?php } elseif (is_single()) { ?>
      <a href="<?php echo get_option('home'); ?>">Главная</a> »            
      <?php foreach((get_the_category()) as $cat) { $cat=$cat->cat_ID; 
      echo(get_category_parents($cat, TRUE, ' » ')); } ?>
 
     <?php } ?>
</div>




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

На скриншоте ниже показано как это сделать. Заходим в “Файл”, далее “Новый”, у вас появиться пустая область, вот и вставляем в нее весь код. Далее опять идем в “файл” и нажимаем “сохранить”, и прописываем название “breadcrumbs”. В выпадающем списке выбираем расширение “php”, ну и сохраняем.
куда закачивать

Не забываем сохранять в кодировке “UTF-8 без бом”

После загружаем на хостинг наши хлебные крошки вот сюда “wp-content > themes > активная тема вашего сайта”, для ясности скриншот.
прописываем путь до файла
Если не хотите создавать файл то можете взять его у меня, что избавит от возни со вставкой и сохранением.
скачиваем исходники

Вывод на самом сайте.

Для отображения хлебных крошек надо в вордпрессе, а точнее в шаблоне, просто в любое место вставить вот этот код.

<?php include (TEMPLATEPATH. '/breadcrumbs.php'); ?>

Я поставил перед выводом статей в файл single.php, у меня это выглядит так, смотрите снимок.
вывод хлебных крошек в статьях

Прописываем стили, чтобы было красиво.

И последнее осталось настроить внешний вид, для этого заходим в редакторе в style.css и прописываем там вот это.

.breadcrumbs{
font:14px Arial;
background:#E6E6E6;
padding:5px 10px;
border: solid 1px #fff;
border-radius:10px;}

Если вы хоть маленько разбираетесь в CSS, то вам эти строчки понятны, если нет то разъясню. Первая задается сам стиль, вторая размер рифта и семейство, третья цвет фона, четвертая внутренние отступы, пятая обводка хлебных крошек и шестая скругление углов. Конечно ва м будет нужно будет настроить все под себя, для подбора цвета фона могу посоветовать программу Colormania.

Другие способы.

Если у вас стоит плагин WordPress Seo by Yoast, то там есть специальная функция, вывода этих самых крошек, но там будут сложности с настройкой внешнего вида. Да и вообще их очень много этих плагинов, например Breadcrumb NavXT, очень хороший, но это не нужно вообще, мой способ очень прост и не нагрузит ваш любимый блог.

P.S. Ну что, как вам эта интересная функция? Понравилось, в любом случае отпишитесь в комментариях. до встречи в следующих статьях.

 

Читать еще
Комментировать
10
  • http://tredon.ru/ Всё о зубах

    Спасибо! Всё понятно.

    • https://wpsovet.ru Лифанов Валентин

      Не за что буду рад помочь.

      • http://maskova-blog.ru MaskoVa

        Ура!!! Спасибо, получилось! :-)

        • https://wpsovet.ru Лифанов Валентин

          Ура, пожалуйста.

  • http://in4wp.ru/ Денис Тумилович

    а я кодом от камы пользовался когда-то.

    • https://wpsovet.ru Лифанов Валентин

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

  • http://moikomputer.ru Валерий

    А вот когда пишешь статью в WordPress там есть Метки, это не хлебные крошки?

    • https://wpsovet.ru Лифанов Валентин

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

      • http://moikomputer.ru Валерий

        Значит метки не нужно использовать имея рубрики?

        • https://wpsovet.ru Лифанов Валентин

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