Breadcrumb NavXT русская версия

Breadcrumb NavXT это самый продвинутый и популярный плагин "хлебных крошек" для блога на WordPress. У него всего один недостаток – нет никаких встроенных стилей оформления. Этот недостаток плагина вы можете исправить, взяв готовые к использованию стили из этой статьи. В плагине достаточно много тонких настроек, так что я перевел его на русский язык, чтобы в настройках могли разобраться даже новички. Также читайте как оформить панель "хлебных крошек" в разметке RDFa, которая поможет поисковикам найти и использовать эту панель при формировании сниппета.

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

Также "хлебные крошки" помогают в плане SEO – поисковики зачастую определяют навигацию в виде "хлебных крошек" и могут вывести ее в поисковом сниппете. Например, практически все движки форумов выводят "хлебные крошки" и поисковики используют их при оформлении сниппета:

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

Скачиваем плагин по ссылке в конце страницы и устанавливаем его:

1. Распаковываем архив.

2. Копируем папку breadcrumb-navxt в /wp-content/plugins/.

3. Заходим в админку блога на вкладку "Плагины" и активируем плагин.

Настроить плагин вы можете в "Параметрах\Breadcrumb NavXT". Я тут все перевел на русский язык и особых проблем с настройкой у вас возникнуть не должно. Тем более, что подавляющему большинству пользователей и не понадобится ничего настраивать - настройки по умолчанию вполне адекватны.

Кнопка "Помощь" в правом верхнем углу админки выведет перед вами маленькую памятку по использованию плагина: код вызова панели, пример оформления панели и некоторые другие вещи.

Из настроек по умолчанию я бы исправил лишь одну вещь – на вкладке "Текущая позиция" поставьте галку на "Постраничная навигация", чтобы в панели отображалась текущая страница. Во избежание ситуаций, когда вы просматриваете 50-ую страницу сайта, а в панели все еще показывается, что вы находитесь на главной странице сайта. Так выглядит логичнее:

Этой опции, кстати, нет ни в одном другом плагине "хлебных крошек", что с моей точки зрения является очевидным недостатком.

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

Вставьте в нужный файл шаблона вот этот код:

<ul class="breadcrumbs">
    <?php if(function_exists('bcn_display_list')) { bcn_display_list(); }?>
</ul>

После этого будет выведена довольно кривая панель "хлебных крошек":

Так она будет выглядеть потому, что вы не задали ей еще никакого оформления. Прежде чем начинать оформлять панель вы должны сделать еще одну настройку. Все свои примеры и скрины я делаю с изображением картинки "дома" для главной страницы. По умолчанию ее в плагине нет, но если вы хотите, чтобы у вас панель выглядела точно так, как у меня на скринах вы должны сделать следующее:

1. Скачайте картинку (правая кнопка мышки и "Сохранить как").
2. Закачайте ее себе на сайт куда-нибудь в папку images.
3. Измените в настройках плагина опцию "Шаблон ссылки на главную" на:

<a title="Перейти к %title%." href="%link%">
<img class="hm" src="http://www.site.ru/home.png" width="14" />%htitle%</a>

4. Опцию "Шаблон ссылки на главную (некликабельная)" поставьте:

<img class="hm" src="http://www.site.ru/home.png" width="14" />%htitle%

Где "http://www.site.ru/home.png" будет указывать на вашу картинку.

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

Теперь приступим к оформлению панели через css. Я не буду тут выкладывать код к каждому стилю оформления, только ссылку на архив. В архиве будет файл style.css и папка images. Содержимое файла style.css скопируйте в файл style.css вашего шаблона, а папку images скопируйте внутрь папки вашего шаблона (вполне возможно, что она уже там есть).

Эти стили подойдут к дизайну большинства шаблонов, но никто вам не мешает поиграться с цветами, чтобы получить что-то типа:

Breadcrumb NavXT это очень настраиваемый плагин. При желании можно настроить его так, чтобы он генерировал код "хлебных крошек" в соответствии с принятым гуглом стандартом RDFa. Такая разметка панели "хлебных крошек" не является гарантией того, что гугл применит их при формировании поискового сниппета, но шансы на это резко возрастут.

Как это сделать? Первым делом, поменяйте код вызова панели на:

<div xmlns:v="http://rdf.data-vocabulary.org/#">
<ul class="breadcrumbs">
    <?php if(function_exists('bcn_display_list')){ bcn_display_list(); } ?>
</ul>
</div>

Остальные изменения делаются путем редактирования настроек плагина. Каждая ссылка в панели "хлебных крошек" должна иметь вид:

<span typeof="v:Breadcrumb">
  <a href="http://www.wptest.ru" rel="v:url" property="v:title">Главная</a>
</span>

То есть шаблон ссылки в настройках плагина должен быть:

<span typeof="v:Breadcrumb">
  <a href="%link%" rel="v:url" property="v:title">%htitle%</a>
</span>

И так для каждой ссылки в панели навигации. Я не буду заставлять вас вручную менять каждую ссылку в настройках плагина - вот вам готовый файл экспорта настроек (правая кнопка мышки и "Сохранить объект как"). Нажмите "Помощь", затем кликните на "Импорт/Экспорт/Сброс" и выберите скаченный файл для загрузки и импорта. В данном файле экспорта использованы настройки плагина по умолчанию плюс RDFa разметка и ничего больше. При желании вы можете настроить плагин под себя, но не трогайте в настройках все, что относится к RDFa.

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

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

Кстати, формально плагин поддерживает разметку для "хлебных крошек". Но почему-то только в виджете и только разметку "schema.org". Однако поддерживает он ее криво - валидацию у гугла такая разметка не проходит:

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

К сожалению, на данный момент "хлебные крошки" не поддерживаются яндексом. Причем ни в каком виде – что в размеченном, что нет. Жаль, конечно, но тут ничего не поделаешь.

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

Breadcrumb NavXT
Автор плагина: John Havlik
Рассматриваемая версия: 4.0.2 от 17.02.2012
Текущая версия: 7.3.1 от 28.06.2024
Совместимость с версией WordPress: 5.8 и выше
Активных установок плагина: 900 000+
Скачать русский плагин версии 4.0.2
Скачать плагин версии 7.3.1 (всего скачено 14 804 099 раз)