Как добавить на Blogger хлебные крошки: Как правильно оформить хлебные крошки на Blogger

Как установить Хлебные крошки на Blogger

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

💡 Примечание: В Blogger нет встроенного гаджета крошек, поэтому код нужно добавлять вручную в шаблон.

Хлебные крошки (англ. breadcrumbs) — это навигационная цепочка в верхней части сайта. Она показывает пользователю, в каком разделе он находится, и позволяет легко вернуться на предыдущие страницы. Название произошло из сказки братьев Гримм, где дети оставляли крошки хлеба, чтобы найти дорогу домой.SE Ranking

Пошаговая инструкция по установки "крошек":

1. В панели управления Blogger перейдите в раздел Тема → Изменить HTML.
2. С помощью поиска Ctrl+F найдите в шаблоне строку:
   <data:post.body/>
3. Сразу после нее (или перед ней)  вставьте следующий код:
   <b:if cond='data:view.isPost'> <div class='breadcrumbs'> <a expr:href='data:blog.homepageUrl'>Главная</a> <b:loop values='data:post.labels' var='label'> <span class='separator'>›</span> <a expr:href='data:label.url'> <data:label.name/> </a> </b:loop> <span class='separator'>›</span> <span class='current'><data:blog.pageName/></span> </div> </b:if>

<!-- Этот тег нужен для того, чтобы «хлебные крошки» отображались только на страницах самих постов и автоматически скрывались на всех остальных страницах блога -->
<b:if cond='data:view.isPost'>...</b:if>

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

<!-- Код хлебных крошек -->
<div class='breadcrumbs'>...</div>
<data:post.body/>

4. В результате должно быть:
   Главная › Название Рубрики › Название статьи
5. Сохраните изменения в шаблоне Blogger и откройте любую статью блога. Хлебные крошки должны отображаться перед содержимым статьи (см. пример на моём блоге: вверху перед заголовком этой статьи появились «хлебные крошки»).