Установить класс html в зависимости от отображаемого контента в ModX Revo

В моем проекте modx revo у меня есть список ссылок на статьи, если я нажму на ссылку, соответствующая статья будет показана ниже. Эти ссылки можно стилизовать, а та, которая ссылается на отображаемую статью, должна быть оформлена по-другому. Поэтому мне нужно добавить к этой ссылке определенный класс html, например

<div>
    <a class="link">1st article</a>
    <a class="link">1nd article</a>
    <a class="link active">3rd article</a> <!-- this one was selected -->
    <a class="link">4th article</a>
</div>
<article>
    <!-- 3rd article text goes here -->
</article>

Каждая статья является контентом ресурса modx, а список ссылок является частью шаблона, в котором она открывается. Есть ли способ сделать это?


modx modx-revolution
person Voletcat    schedule 21.03.2018    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Самый простой способ — использовать дополнительные функции, такие как Wayfinder, для создания вашего меню, которое автоматически обрабатывает добавление «активного» класса в зависимости от того, какой ресурс вы просматриваете.

Вот пример Wayfinder из документации, который получает 1 глубину страниц под корнем сайта и автоматически добавляет класс «активный» к странице, которую вы просматриваете.

[[Wayfinder? &startId=`0`&level=`1`]]

По умолчанию он выводит неупорядоченный список всех элементов. Затем его можно настроить в соответствии с вашим сайтом, используя дополнительные параметры, в частности, externalTpl и rowTpl (дополнительная информация на странице документации для Wayfinder: https://docs.modx.com/extras/revo/wayfinder )

person Tony Klapatch    schedule 29.03.2018

arrow_upward
2
arrow_downward

Простым способом было бы создать навигацию с помощью дополнительных элементов, таких как pdoMenu (доступен в пакете pdoTools).

Используйте следующий вызов фрагмента: [[pdoMenu? &parents=`0` &level=`1`]]

Это создаст навигацию в соответствии с шаблонами по умолчанию. Активный элемент li будет иметь класс .active, поэтому вы можете соответствующим образом оформить его.

pdoTools также дает вам массу других полезных фрагментов, которые вы можете найти здесь.

person ezrarieben    schedule 03.04.2018