Как создать вложенную структуру HTML, показанную ниже, с помощью компонента WCM Menu/Nav?
Я проектирую карусель с тремя изображениями. Мне нужно внедрить следующий код с помощью WCM. Я могу проектировать с одним результатом дизайна. Пожалуйста, объясните мне, как получить три ссылки в наборе. Все изображения находятся в одной области сайта.
<div class="subBox">
<div class="set">
<div class="images"><img src='slide1.jpg' alt='' /></div>
<div class="images"><img src='slide2.jpg' alt='' /></div>
<div class="images"><img src='slide3.jpg' alt='' /></div>
</div>
<div class="set">
<div class="images"><img src='slide4.jpg' alt='' /></div>
<div class="images"><img src='slide5.jpg' alt='' /></div>
<div class="images"><img src='slide6.jpg' alt='' /></div>
</div>
<div class="set">
<div class="images"><img src='slide7.jpg' alt='' /></div>
<div class="images"><img src='slide8.jpg' alt='' /></div>
<div class="images"><img src='slide9.jpg' alt='' /></div>
</div>
</div>
2 ответа
Используйте представление списка в меню / навигаторе - в зависимости от того, нужно ли сохранить порядок. Установите максимальное количество 9.
Заголовок:
<div class="subBox">
<div class="set">
Макет элемента:
[Plugin:Matches pattern="(3|6)" text="[Placeholder tag='listnum']"]
</div>
<div class="set">
[/Plugin:Matches]
<div class="images">[Element type="content" context="autofill" key="img"]</div>
Footer:
</div>
</div>
Таким образом, у вас есть одна область сайта, под которой есть набор контента.
Там нет ничего из коробки может сделать это для вас.
Первое решение (с использованием Javascript)
- визуализировать все изображения в одном скрытом Div
- добавьте код java-скрипта для создания своего HTML
Второе решение (Создание собственного плагина)
Создайте пользовательский плагин и передайте ему индекс номера элемента и элемента подсписка, и он отображает его тело только в том случае, если ("index" mod "Номер элемента подсписка" равен нулю), вы можете получить индекс из [Placeholder tag="listnum" htmlencode="ложь"], а в вашем случае "Количество элементов списка" равно 3
В дизайне меню
header ="<div class="subBox"><div class="set">"
в дизайне для каждого результата визуализируйте ваш элемент, затем используйте ваш собственный плагин для рендеринга " " -> будет отображать каждые 3 элемента дизайна для нижнего колонтитула"</div></div>"