• Заметки

    • MODX. Хлебные крошки на сайте с использованием pdoCrumbs

    Опубликовано: 01 Декабря 2019

    Хлебные крошки — вид навигации на сайте, получивший свое название от знаменитой сказки Ганса Христиана Андерсена. В этой навигации на сайте отображается цепочка ресурсов, начиная от корневого каталога, до текущего отображаемого ресурса.

    В системе MODX, навигацию в стиле хлебных крошек (breadcrumbs), можно создать с помощью сниппета pdoCrumbs, который входит в состав компонента pdoTools.

    Простейший вызов хлебных крошек:

    Fenom
    Теги MODX
    {'pdoCrumbs' | snippet}

    [[pdoCrumbs]]
     

    Вызов с доп параметрами: 

    Fenom
    Теги MODX
    {'pdoCrumbs' | snippet : [
      'from' => '2',
      'tpl' => 'tpl.breadcrumbs',
      'tplWrapper' => 'tpl.breadcrumbs-wrap',
      'tplCurrent' => '',
      'tplMax' => '',
      'exclude' => '2,'~$_modx->resource.id
]}
 
    [[pdoCrumbs?
     &from=`2`
     &tpl=`tpl.breadcrumbs`
     &tplWrapper=`tpl.breadcrumbs-wrap`
     &tplCurrent=``
     &tplMax=``
     &exclude=`2,[[*id]]`
]]

     

    Документация сниппета pdoCrumbs

    pdoCrumbs ​

    pdoCrumbs ​

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

    Хорошо заменяет BreadCrumb, работает с документами из любых контекстов и позволяет указывать различные условия для выборки ресурсов.

    Сниппет обладает очень высокой скоростью работы, за счет выборки всех нужных элементов из БД за один запрос.

    Параметры ​

    Принимает все параметры pdoTools и некоторые свои:

    Параметр По умолчанию Описание
    &showLog 0 Показывать дополнительную информацию о работе сниппета. Только для авторизованных в контексте «mgr».
    &from 0 Id ресурса, от которого строить хлебные крошки. Обычно это корень сайта, то есть «0».
    &to Id ресурса для которого строятся хлебные крошки. По умолчанию это id текущей страницы.
    &exclude Список id ресурсов, которые нужно исключить из выборки.
    &toPlaceholder Если не пусто, сниппет сохранит все данные в плейсхолдер с этим именем, вместо вывода не экран.
    &outputSeparator \n Разделитель между крошками
    &tpl Имя чанка для оформления ресурса. Если не указан, то содержимое полей ресурса будет распечатано на экран.
    &tplCurrent Чанк оформления текущего документа в навигации.
    &tplMax Чанк, который добавляется в начало результатов, если их больше чем &limit.
    &tplHome Чанк оформления ссылки на главную страницу.
    &tplWrapper Чанк-обёртка, для заворачивания всех результатов. Понимает один плейсхолдер: [[+output]]. Не работает вместе с параметром &toSeparatePlaceholders.
    &wrapIfEmpty Включает вывод чанка-обертки &tplWrapper даже если результатов нет.
    &showCurrent 1 Выводить текущий документ в навигации.
    &showHome 0 Выводить ссылку на главную в начале навигации.
    &showAtHome 1 Показывать хлебные крошки на главной странице сайта.
    &hideSingle 0 Не выводить результат, если он один единственный.
    &direction ltr Направление навигации: слева направо «ltr» или справа налево «rtl», например для Арабского языка.

    Шаблоны ​

    Шаблон По умолчанию
    &tpl @INLINE <li><a href="[[+link]]">[[+menutitle]]</a></li>
    &tplCurrent @INLINE <li class="active">[[+menutitle]]</li>
    &tplMax @INLINE <li class="disabled">&nbsp;...&nbsp;</li>
    &tplHome
    &tplWrapper @INLINE <ul class="breadcrumb">[[+output]]</ul>

    Примеры ​

    Генерация хлебных крошек для текущей страницы:

    modx
    [[pdoCrumbs]]

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

    modx
    [[pdoCrumbs?
  &limit=`2`
]]

    Сниппет хорошо работает при вызове из pdoResources. Например, вот такой чанк:

    modx
    <h3>[[+pagetitle]]</h3>
<p>[[+introtext]]</p>
[[pdoCrumbs?
  &to=`[[+id]]`
  &showCurrent=`0`
]]

    Генерация микроразметки Schema.org в JSON-LD формате

    fenom
    {'!pdoCrumbs' | snippet : [
  'showHome' => 1,
  'tplWrapper' => '@INLINE
    <script type="application/ld+json">
      {
        "@context": "http://schema.org",
        "@type": "BreadcrumbList",
        "itemListElement": [ {$output} ]
      }
    </script>
  ',
  'tplHome' => '@INLINE
    {
      "@type": "ListItem",
      "position": {$idx},
      "item": {
        "@id": "{$link}",
        "name": "{$menutitle}"
      }
    },
  ',
  'tplCurrent' => '@INLINE
    {
      "@type": "ListItem",
      "position": {$idx},
      "item": {
        "@id": "{$link}",
        "name": "{$menutitle}"
      }
    }
  ',
  'tpl' => '@INLINE
    {
      "@type": "ListItem",
      "position": {$idx},
      "item": {
        "@id": "{$link}",
        "name": "{$menutitle}"
      }
    },
  ',
]}

    Демо ​

    Рабочий пример генерации хлебных крошек в результатах поиска mSearch2.

    Демо