Главная » Новости

Улучшаем навигацию - хлебные крошки на WordPress!

Опубликовано: 23.08.2018

Хлебные крошки для WordPress

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

Хлебные крошки Wordpress без плагина - Константин Хмелев

Рекомендую к прочтению:

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

На данный момент работаю над своим авторским видео-курсом! Что за курс? Пока секрет! Не хочу говорить заранее, лучше покажу потом готовый вариант! Могу сказать лишь одно: он не совсем относится к моей тематике (не про создание блогов и сайтов)! Мои друзья и знакомые навели меня на мысль о создании этого курса, постоянно атакуя вопросами как/зачем/почему/помоги! В общем, работа кипит — уже записал пару уроков...

Еще, наконец-то, заказал у дизайнера свой авторский логотип — цена вопроса 1200 руб.! В этом моя ошибка... Нужно было изначально решить этот вопрос... Теперь придется переделывать все картинки, или может забить?! Как считаете?

Хотел изначально сам нарисовать что-нибудь, да что-то муза не пришла Пусть работает профи! Когда работа будет закончена — хочу услышать Ваше мнение (гуд или не гуд)! Все нарадоваться не могу декрету моей дорогой супруге — блинчики, фаршированные перцы, пельмешки — ммм... Жена в декрете — это Здорово! Так что, отправляйте своих жен в декрет А потом, вернемся к теме статьи, а именно к хлебным крошкам...

Что же такое — Хлебные крошки?

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

Многие вебмастера называют их навигационной цепочкой. Находится такая цепочка над заголовком статьи. Благодаря «хлебным крошкам» пользователь может быстро сориентироваться, в какой рубрике и в каком разделе находится данный пост. Например, если ваш сайт имеет сложную структуру, и на нем есть не только разделы, но и подразделы, то при обычной навигации одно звено цепочки будет потеряно и будет выглядеть так: «Главная — Подраздел — Статья». А вот если на вашем сайте установлены «хлебные крошки», то читатель увидит полную картинку, т.е. «Главная — Раздел — Подраздел — Статья».

Постраничная навигация WordPress не только удобна для посетителей, она также играет немаловажную роль в продвижении сайта (блога). «Хлебные крошки» улучшают перелинковку — поисковые роботы будут проще и быстрее индексировать страницы сайта.

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

Если вы решили воспользоваться плагином , то можете скачать специально разработанный для этой цели компонент BreadCrumb XT. Чтобы установить плагин BreadCrumb XT, откройте свою административную панель, выберите пункт «Плагины», далее перейдите в подпункт «Добавить новый». Скопируйте название плагина, вставьте его в поисковую строку и нажмите Enter. Увидели, установили и активировали. Все просто!

Переходим в меню «Настройки», опа, видим новый пункт Breadcrumb NavXT! Теперь можно настроить навигацию хлебных крошек — выбрать удобный для вас вариант пути, длину, ширину и так далее. Можно убрать из навигационной цепочки название статьи (записи), чтобы его не повторять.

Следующим шагом будет установка специального кода, который найдете в плагине — в файл header.php или single.php. Смотря где хотите разместить элемент навигации.

Кстати, хлебные крошки присутствуют и в плагине WordPress SEO by Yoast, который я недавно установил и настроил. Скоро напишу на него обзор! Подпишись и не пропустишь...

Хлебные крошки без плагина — кодом!

Для этого вам понадобится в файл functions.php своей вордпресс-темы внести такой код:

Чтобы вывести навигационную цепочку на страницы вашего сайта (блога), добавьте в файлы вашей темы следующий код:

<div class="navibreadsavme"><?php navibreadsavme(); ?></div>

После чего на страницах вашего веб-ресурса появятся «хлебные крошки». Но если вам необходимо придать навигационной цепочке более красивый вид, то потребуется прописать стили в файле css.

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

.navibreadsavme{float:left;margin:0;overflow:hidden;}

.navibreadsavme a{font-size:12px;color:#6699cc;text-decoration:none;}

.navibreadsavme > span{color:#555;}

Если все сделали правильно, то хлебные крошки на WordPress должны уже присутствовать и функционировать! Данный код проверил на своем блоге — все работает, как часы! Хотя, темы у всех разные, может у кого и не сработает... тогда используйте плагины!

А я Вам говорю — До свидания! До встречи в новой статье!