如何在Broadleaf-Ecommerce上创建旋转图像的轮播类型横幅。

Question

我想在Broadleaf电子商务模板的主页上制作旋转图像的旋转木马式横幅。我无法弄清楚如何实现这一目标。请指导我。

我尝试在home.html中使用以下代码，但没有显示任何内容。

<blc:content contentType="Homepage Banner Ad" />       
        <div id="banners" th:if="${contentItem !=null and contentItem['targetUrl'] != null and contentItem['imageUrl'] != null}">
           <ul>
             <li th:each="contentItem : ${contentItems}">
                <a th:href="@{${contentItem['targetUrl']}}"><img th:src="@{${contentItem['imageUrl']}}" style="width:100%;"/></a> 
            </li>

           </ul> 
        </div>

我通过管理面板添加了3个横幅图片，优先级为1,2和3

Answer 1

对于轮播，您需要使用javascript或任何其他等效的客户端脚本。我更喜欢jCarousel和Jssor Slider。