Последнее обновление: 27 августа 2018
Слайдер изображений
Слайдер построен на стандартном функционале приложения «Фото».
Пример слайдера, Вы можете увидеть на главной странице демонстрационной версии шаблона «купить просто».
Для реализации слайдера, Вам необходимо:
- Установить приложение «фото» (в инсталере) и создать альбом с произвольным названием
- Закачать изображения для салайдера в созданный альбом (желательный размер изображений – ширина 740 px, высота 400px)
- Установить в настройках альбома в пункте «доступ» - «приватный». (необязательный пункт)
* Внимание! Для изображений - не нужно устанавливать "приватный" доступ
* Желательный размер изображений: ширина - 740 px, высота произвольная, но одинаковая для всех изображений слайдера
Разместить слайдер можно на любом типе страницы (витрина, каталог, информационная страница магазина и т.п.).
Для этого пропишите строку ( * в соответствующем файле темы "buysimply" приложения «магазин»)
{include file="`$wa_active_theme_path`/banner-slider.html" param='1'}
Где значение атрибута “ param” – идентификатор альбома приложения «фотогалерея»
* можно создавать неограниченное число слайдеров, НО! на одной странице можно разместить только один слайдер
Например, мы для сайта «Купить Просто», разместили слайдер на витрине магазина – файл home.html приложения Магазин -> Дизайн.
Сразу после строки {*insert banner*}, прописали
{include file="`$wa_active_theme_path`/banner-slider.html" param='1'}
* Идентификатор альбома для нашего слайда - 1.
Узнать идентификатор альбома, можно следующим образом: в приложении "фотогалерея" кликните на название альбома в блоке "альбомы", после клика Вы будете перенаправленны на страницу информации об альбоме, где в строке URL (в браузере верхняя адресная строка), Вы увидите примерно такую строку
site.ru/webasyst/photos/#/album/1/
где последняя цифра и будет являться идентификатором альбома.
Так же можно опубликовать отдельное изображение слайдера, как ссылку на любой произвольный URL. Для этого в редакторе изображения необходимо добавить описание, в качестве описание прописать необходимый URL.
* Редактировать содержимое слайдера можно в файле banner-slide.html в приложении «магазин» - вкладка «витрина» - раздел «Дизайн».
Комментарии (16)
Пару вопросов. Вы пишите:
"Например, мы для сайта «Купить Просто», разместили слайдер на витрине магазина – файл home.html приложения Магазин -> Дизайн. Сразу после строки {*insert banner*}, прописали {include file="`$wa_active_theme_path`/banner-slider.html" param='1'}",
1. я смотрю в файле home.html в исходном коде первая строчка:
"{*insert banner*}{if $wa->photos}{include file="`$wa_active_theme_path`/banner-slider.html" param='1'}{/if}"
т.е. по сути все уже прописано, нужно только удалить в конце этой строчки {/if}. Я правильно понял?
2. Где прописать баннер на главной странице сайта? В приложении сайт - дизайн - шаблоны? Какой файл соответствует главной странице? И вообще если на другой странице какой-нибудь захочу разместить как это сделать?
1) Нет, неверно - Вам требуется заменить параметр param на нужный/(созданный вами) идентификатор альбома в приложении Фото.
Если Вы создадите свой первый альбом в приложении фото, то в текущем варианте все само заработает, поскольку в этом параметре указан идентификатор 1.
2) Файл home.html является главной страницей приложения Магазин и для отображения слайдера на ней Вам всего лишь требуется создать альбом в приложении Фото и разместить в нем фотографии/изображения.
В приложении Сайт главной страницей является та, которая имеет адрес самого приложения Сайт.
Слайдер разработан для приложения Магазин и разместить его можно в приложении Магазин на любой из страниц в единичном экземпляре, прописав строку:
{if $wa->photos}{include file="`$wa_active_theme_path`/banner-slider.html" param='1'}{/if}
*где нужно заменить значение в параметре param
Как изменить время автопрокрутки изображений в слайдере с промо-изображениями на главной странице?
В файле banner-slider.html, приложения Магазин, в строке:
timeout: 5000,
замените значение 5000 на любое другое.
1000 ~ 1секунда
Эффекты для слайдера
перечислены здесь - http://jquery.malsup.com/cycle/browser.html
Для изменения эффекта, выберите в пердставленном списке одно из названий, и в файле "banner-slider.html".
в строке
fx: 'scrollHorz',
замените scrollHorz, на выбранное название эффекта
Получается галерею можно разместить только в приложении магазин на др страницах нельзя?
Все верно, слайдер промо-изображений основанный на приложении Фото сделан только для использования в приложении Магазин.
Подскажите как сделать так, чтоб слайдер на главной странице отображался, а в левой колонке блока "последние фото" не было?
В файле sidebar.html(Магазин - Витрина - Шаблоны) удалите строку:
{if $wa->photos && !empty($theme_settings.latest_photo)}{include file="`$wa_parent_theme_path`/last.photos.html" _index=$_index}{/if}
Добрый день. Как добавить подписи к фотографиям слайдера? На вашем примере есть подписи.
Подписи сделаны на самих фото.
Здравствуйте, Игорь.
Можно ли в данной теме выводить на слайдер, товары из каталога? Вместо фотографий из блока "ФОТО"
Спасибо
Здравствуйте
нет, только фото
на данный момент разрабатывается новая тема "Купить просто II"
Здравствуйте, вставил слайдер на страницу категории,продукта и он не работает. Показывает сразу все фото.
Здравствуйте
в файле index.html
замените строку
{if $wa_app == 'shop' && isset($action) && $action == 'default'}<script src="{$wa_theme_url}wm-site/jquery.cycle.all.min.js?v2.99"></script>{/if}
на
<script src="{$wa_theme_url}wm-site/jquery.cycle.all.min.js?v2.99"></script>
Спасибо, за оперативность. заработало