Smarty-функция для вывода карусели товаров

В самом шаблоне Smarty можно создавать примитивные функции, которые помогут настроить внешний вид какого-либо стандартного виджета, которые можно будет вызывать одной строчкой, передавая данные для вывода и нужные параметры.


Рассмотрим на примере Bootstrap Carousel:

{* 
 * Функция вывода Bootstrap Carousel
 *
 * $carousel_name - уникальное имя для id элемента
 * $data - массив данных, в котором хранятся данные товара
 * $size - сколько товаров будет выводиться одновременно на страницу
 * $interval - интервал перелистывания карусели, миллисекунды
 *}
{function name=carousel}
  <div id="{$carousel_name}-item-carousel" class="carousel slide" data-ride="carousel" data-interval="{$interval}">
    <div class="carousel-inner">
      <div class="item active">
        {foreach $data as $product}
        <div class="col-sm-{(12/$size)|ceil}">
          {* Подключаем шаблон карточки товара *}
          {include "tiny_products.tpl"}
        </div>
        {if $product@iteration % $size == 0 and $product@last !== TRUE}</div><div class="item">{/if}
        {/foreach}
      </div>
    </div>
    {if $data|count > $size}
      <a class="left carousel-item-control" href="#{$carousel_name}-item-carousel" data-slide="prev">
        <i class="fa fa-angle-left"></i>
      </a>
      <a class="right carousel-item-control" href="#{$carousel_name}-item-carousel" data-slide="next">
        <i class="fa fa-angle-right"></i>
      </a>
    {/if}
  </div>
{/function}

Подключим вывод акционных товаров в виде карусели:

{get_discounted_products var=discounted_products limit=16}
{carousel data=$discounted_products carousel_name=discounted size=4 interval=5000}

Кнопки навигации не выводятся, если реальное количество товара помещается в один вывод. Ширина ячейки рассчитывается исходя из указанного $size.