Навигация WordPress Хлебные крошки — плагин Prime Strategy Bread Crumb

Итак, давайте рассмотрим как же работает вышеозначенный Wordpress плагин Хлебные крошки.

Начинаем как всегда с установки. Я предпочитаю более простой путь и устанавливаю плагин из хранилища WordPress. Для этого нужно перейти в административной панели по адресу Плагины | Добавить новый и указать в строке поиска название Prime Strategy Bread Crumb. После того как плагин будет найден, достаточно нажать кнопку Установить, и система автоматически его установит.

Здесь же есть возможность загрузить файлы плагина, если по каким-то причинам вы не хотите брать его непосредственно из каталога. И наконец, вы можете скопировать папку с плагином prime-strategy-bread-crumb в папку WordPress /wp-content/plugins/ при помощи файлового менеджера хостинга или по FTP.

Добавить плагин

Какой бы способ вы не выбрали, плагин необходимо активировать. Сделать это можно на странице установленных плагинов.

Плагин Strategy Bread Crumb очень прост. Настолько прост, что не имеет даже страницы настроек в админке, но вместе с тем гибок, поскольку функция его вызова может принимать ряд параметров. Для использования со всеми параметрами по умолчанию достаточно поместить в шаблон WordPress код, указанный ниже

<?php if ( function_exists( 'bread_crumb' ) ) { bread_crumb(); } ?>

1	<?php if ( function_exists( 'bread_crumb' ) ) { bread_crumb(); } ?>

С дефолтными параметрами будет выводиться html такого вида

<ul class="bread_crumb">
 <li class="level-1 top"><a href="http://www.example.com/">Home</a></li>
 <li class="level-2 sub"><a href="http://www.example.com/?post_type=seminar">Seminar</a></li>
 <li class="level-3 sub"><a href="http://www.example.com/?area=tokyo">Tokyo</a></li>
 <li class="level-4 sub tail current">WordBench Tokyo</li>
</ul>

<li class="level-2 sub"><a href="http://www.example.com/?post_type=seminar">Seminar</a></li>

<li class="level-3 sub"><a href="http://www.example.com/?area=tokyo">Tokyo</a></li>

<li class="level-4 sub tail current">WordBench Tokyo</li>

</ul>

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

Обратите внимание, что в примере, внутри функции bread_crumb() перечислено несколько параметров, их можно указывать отделяя друг от друга с помощью знака &.

 type=string&home_label=Главная&joint_string=

1	type=string&home_label=Главная&joint_string=

Альтернативная форма записи переменных — в виде массива

<?php
 $args = array(
 'home_label' => 'Главная',
 'joint_string' => '',
 'type' => 'string'); 
 if (function_exists('bread_crumb')) bread_crumb($args);
?>

<?php

$args = array(

'home_label' => 'Главная',

'joint_string' => '',

'type' => 'string');

if (function_exists('bread_crumb')) bread_crumb($args);

Преимуществом именно Strategy Bread Crumb являются богатые возможности вывода хлебных крошек на страницах разных типов будь то архивы, страница поиска, страница вложения, страница автора и т.п. Если вам нужно, чтобы они отображались во всех подобных случаях, лучше поместить тег bread_crumb(); в файл header.php шаблона и указать условие для главной страницы, поскольку на главной странице выводить breadcrumbs не имеет никакого смысла.

 <?php
 if (!is_home()){
 $args = array(
 'home_label' => 'Главная',
 'joint_string' => '',
 'type' => 'string'); 
 if (function_exists('bread_crumb')) bread_crumb($args);}
?>

<?php

if (!is_home()){

$args = array(

'home_label' => 'Главная',

'joint_string' => '',

'type' => 'string');

if (function_exists('bread_crumb')) bread_crumb($args);}

Помещаем этот код в конце файла header.php, в примере (шаблон Twenty Twelve) после открывающего тега элемента wrapper

Параметры, которые принимает тег Bread Crumb

type

По умолчанию list (список ul). Если вы укажете тип string — вывод строки вместо списка, т.е. хлебные крошки в виде строчных элементов — a и strong.

<a href="http://www.example.com/">Home</a> > <a href="http://www.example.com/?post_type=seminar">Seminar</a> >
 <a href="http://www.example.com/?area=tokyo">Tokyo</a> > <strong class="current">WordBench Tokyo</strong>

1 2	<a href="http://www.example.com/">Home</a> > <a href="http://www.example.com/?post_type=seminar">Seminar</a> > <a href="http://www.example.com/?area=tokyo">Tokyo</a> > <strong class="current">WordBench Tokyo</strong>

home_label

Как в навигационной цепочке отображается главная страница. По умолчанию: home.

search_label

Текст, отображаемый в результатах поиска. По умолчанию: Search Results of «%s» (%s : строка поиска)

404_label

Текст, отображаемый на странице 404. По умолчанию: 404 Not Found

category_label

Текст,отображаемый на страницах категории. По умолчанию: %s ( %s — название категории)

tag_label

Текст на странице тегов. По умолчанию: %s (%s — название тега)

taxonomy_label

Текст, отображаемый на страницах таксономий. Default: %s (%s — название таксономии)

author_label

Текст на авторской странице. По умолчанию: %s (%s — имя автора)

attachment_label

Текст, отображаемый для страниц вложений. По умолчанию: %s (%s — название вложения)

year_label

Текст, отображаемый на страницах годовых архивов. По умолчанию: %s (%s -год)

month_label

Текст, отображаемый на страницах месячных архивов. По умолчанию: %s (%s — месяц)

day_label

Текст, отображаемый на страницах архивов за день. По умолчанию: %s (%s — день)

post_type_label

Текст на страницах для произвольных типов записей. По умолчанию: %s (%s — произвольный тип записи, его название)

joint_string

Если вы указали параметр type как string (строка) , то этот параметр будет задавать разделители между текстом. Если указать пустое значение — разделителя не будет. По умолчанию знак: > ( > )

navi_element

Название элемента-обертки. Можно выбрать теги <div> или <nav>, в которые будут заключены хлебные крошки. По умолчанию: отсутствует.

elm_class

Имя класса элемента-обертки. Если он отсутствует и выбран тип (type) список (list), будет отображаться класс элемента ul. По умолчанию: bread_crumb

elm_id

Имя id элемента-обертки. По умолчанию : нет.

li_class

Название класса, добавляемого к li, если тип (type) вывода хлебных крошек список (list). По умолчанию: нет класса.

class_prefix

Префикс, который можно добавить в каждый из классов. По умолчанию: префикса нет.

current_class

Название класса, добавляемого к текущей странице в breadcrumbs. По умолчанию: current

echo

Выводить результат или нет. По умолчанию: true (вывод). Если вы определите 0 или false — сохранение в переменной PHP(breadcrumbs не будут выводиться на страницу).

С настройкой вывода данных в Strategy Bread Crumb более менее разобрались. Осталось решить вопрос с оформлением полученных хлебных крошек. Разработчики предлагают нам такие простые, базовые стили для улучшения внешнего вида этой навигации. Их удобно использовать в качестве основы для своих стилей.

.bread_crumb {
 margin:0;
 border-bottom:1px solid #eee;
 padding:0.8em 0 0.5em;
 clear: both;
 height: 20px;
 background: #f8f8f8;
 }
 .bread_crumb li {
 font-size:12px;
 color:rgb(180,180,180);
 float:left;
 /*margin-right:1em;*/
 list-style: none outside none;
 }
 .bread_crumb li:after {
 content : '>';
 padding-left:10px;
 margin-right:10px;
 }
 .bread_crumb li:last-child:after {
 content : '';
 }
 .bread_crumb li a {
 color:rgb(120,120,120);
 }
 .bread_crumb li.current {
 }