Для вывода дополнительных изображений в элементах инфоблока необходимо создать дополнительное свойство типа «ФАЙЛ» с кодом «MORE_PHOTO».
Детальное редактирование.
Далее копируем код из шаблона каталога для вывода изображений в шаблон новостей catalog.top:
<div class="clearfix" style="max-width:441px;"> <ul id="image-gallery<? echo $arElement['ID'];?>" class="gallery list-unstyled cS-hidden"> <?foreach($arElement["DISPLAY_PROPERTIES"]["MORE_PHOTO"]["FILE_VALUE"] as $PHOTO):?> <li data-thumb="<?=$PHOTO["SRC"]?>" width="<?=$PHOTO["WIDTH"]?>" height="<?=$PHOTO["HEIGHT"]?>"> <img src="<?=$PHOTO["SRC"]?>" width="440" height="330" /> </li> <?endforeach?> </ul> </div>
Незабываем подключить скрипт слайдера (конкретно вашего):
$(document).ready(function() { $("#content-slider").lightSlider({ loop:true, keyPress:false }); $('#image-gallery').lightSlider({ gallery:true, item:1, thumbItem:9, slideMargin: 0, speed:500, auto:false, loop:false, onSliderLoad: function() { $('#image-gallery').removeClass('cS-hidden'); } }); });
После этого подгруженные изображения будут отображаться при выводе элемента каталога. Это всего лишь шаблон, поэтому необходимо совместить его со своей версткой, чтобы изображения выводились корректно.
В итоге при добавлении элемента каталога просто выбираем изображения:
На этом все. Пользуйтесь и добавляйте в свои шаблоны.
Минимальная стоимость создания сайта: от 10990 руб.