Последнее обновление: 25 октября 2017

Слайдер изображений

Слайдер построен на стандартном функционале приложения «Фото».

Пример слайдера, Вы можете увидеть на главной странице демонстрационной версии шаблона «купить просто».

Для реализации слайдера, Вам необходимо:

  • Установить приложение «фото» (в инсталере) и создать альбом с произвольным названием
  • Закачать изображения для салайдера в созданный альбом (желательный размер изображений – ширина 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 в приложении «магазин» - вкладка «витрина» - раздел «Дизайн».

Эта статья была полезна? Да Нет

Комментарии (13)

  • Илья Юрасов Илья Юрасов +0 6 июля 2015 17:08 #

    Пару вопросов. Вы пишите:

    "Например, мы для сайта «Купить Просто», разместили слайдер на витрине магазина – файл 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
  • 1) Нет, неверно - Вам требуется заменить параметр param на нужный/(созданный вами) идентификатор альбома в приложении Фото.

    Если Вы создадите свой первый альбом в приложении фото, то в текущем варианте все само заработает, поскольку в этом параметре указан идентификатор 1.

    2) Файл home.html является главной страницей приложения Магазин и для отображения слайдера на ней Вам всего лишь требуется создать альбом в приложении Фото и разместить в нем фотографии/изображения.

    В приложении Сайт главной страницей является та, которая имеет адрес самого приложения Сайт.

    Слайдер разработан для приложения Магазин и разместить его можно в приложении Магазин на любой из страниц в единичном экземпляре, прописав строку:

    {if $wa->photos}{include file="`$wa_active_theme_path`/banner-slider.html" param='1'}{/if}

    *где нужно заменить значение в параметре param

    1
  • 24 июля 2015 13:22 #

    Как изменить время автопрокрутки изображений в слайдере с промо-изображениями на главной странице?

    1
  • Александр Тирон Александр Тирон +14 24 июля 2015 14:05 #

    В файле banner-slider.html, приложения Магазин, в строке:

    timeout: 5000,

    замените значение 5000 на любое другое.

    1000 ~ 1секунда

    1
  • Игорь Колмаков Игорь Колмаков +17 19 ноября 2015 14:55 #

    Эффекты для слайдера

    перечислены здесь - http://jquery.malsup.com/cycle/browser.html

    Для изменения эффекта, выберите в пердставленном списке одно из названий, и в файле "banner-slider.html".

    в строке

    fx: 'scrollHorz',

    замените scrollHorz, на выбранное название эффекта

    1
  • Иван петров Иван петров +0 28 декабря 2015 13:32 #

    Получается галерею можно разместить только в приложении магазин на др страницах нельзя?

    1
    • Александр Тирон Александр Тирон +14 28 декабря 2015 14:04 #

      Все верно, слайдер промо-изображений основанный на приложении Фото сделан только для использования в приложении Магазин.

      1
    • Вадим Вадим +0 20 января 2016 14:20 #

      Подскажите как сделать так, чтоб слайдер на главной странице отображался, а в левой колонке блока "последние фото" не было?

      1
      • Александр Тирон Александр Тирон +14 9 января 2017 12:27 #

        В файле sidebar.html(Магазин - Витрина - Шаблоны) удалите строку:

        {if $wa->photos && !empty($theme_settings.latest_photo)}{include file="`$wa_parent_theme_path`/last.photos.html" _index=$_index}{/if}

        1
      • Илья Юрасов Илья Юрасов +0 7 января 2017 19:02 #

        Добрый день. Как добавить подписи к фотографиям слайдера? На вашем примере есть подписи.

        1
      • Алексей Алексей +0 25 октября 2017 07:43 #

        Здравствуйте, Игорь.

        Можно ли в данной теме выводить на слайдер, товары из каталога? Вместо фотографий из блока "ФОТО"


        Спасибо

        1

        Добавить комментарий

        Чтобы добавить комментарий, зарегистрируйтесь или войдите

        Контакты

        Дорогие друзья!

        К сожалению, Ваш браузер не поддерживает современные технологии используемые на нашем сайте.

        Пожалуйста, обновите браузер, скачав его по ссылкам ниже, или обратитесь к системному администратору, обслуживающему Ваш компьютер.

        Internet Explorer

        от Microsoft

        Chrome

        от Google

        Safari

        от Apple

        Opera

        от Opera Software

        Firefox

        от Mozilla

        Вверх