Последнее обновление: 2 августа 2017

Слайдер / банер на главной странице магазина

Слайдер изображений/продуктов размещается в верху области содержания главной страницы приложения «магазин».

Может содержать в себе(один из двух вариантов):

  • список товаров
  • список изображений

Слайдер / банер списка изображений

Список изображений работает на стандартном функционале приложения «фото» и может формироваться из нескольких вариантов:

  • список изображений «альбома»
  • изображений по «тегу»

Для отображения в качестве слайдера списка изображений, необходимо в «настройках темы» ( магазин-витрина-оформление пункт 10.2 «слайдер изображений»), в поле «слайдер изображений» приписать одну из предложенных конструкций:

  • album/1 – сформирует список изображений, из изображений альбома идентификатор которого – 1.

    Узнать идентификатор альбома, можно следующим образом: в приложении "фотогалерея" кликните на название альбома в блоке "альбомы", после клика Вы будете перенаправленны на страницу информации об альбоме, где в строке URL (в браузере верхняя адресная строка), Вы увидите примерно такую строку
    site.ru/webasyst/photos/#/album/1/
    где последняя цифра и будет являться идентификатором альбома.
  • tag/мои слайды – сформирует список изображений из изображений содержащих «тег» «мои слайды».

* Если картинок не будет, то слайдер изображений не будет опубликован.
*примечание: баннер картинок имеет приоритет над баннером продуктов, если оба поля заполнены, то отобразится «слайдер изображений».
* ширина изображений должна быть 960px а высота на Ваше усмотрение, но одинаковая у всех изображений в слайдере

Так же можно опубликовать отдельное изображение слайдера, как ссылку на любой произвольный URL. Для этого в редакторе изображения необходимо добавить описание, в качестве описание прописать необходимый URL.

Слайдер / банер списка товаров

Список товаров может формироваться из нескольких вариантов: «категории товара», «товары по тегу» или «список товаров».

Для отображения в качестве слайдера списка товаров, необходимо в «настройках темы» ( магазин-витрина-оформление пункт 10.1 «слайдер товаров»), в поле «слайдер товаров» приписать одну из предложенных конструкций:

  • category/1 – сформирует список из продуктов категории идентификатор которой – 1.
    * Узнать идентификатор категории можно так – в приложении «магазин», вкладка «товары» кликните на нужной категории, Вы перейдете на страницу содержащую товары этой категории. В строке URL этой категории Вы увидите следующий параметр «category_id=1937», где цифровое значение и будет идентификатором категории
  • tag/планшет Samsung Galaxy – сформирует список продуктов содержащих «тег» «планшет Samsung Galaxy»
  • set/bestsellers – формирует список товара, из списков товаров магазина идентификатор которого «bestsellers».
    * Списки товаров магазина, размещаются в приложении «магазин» - вкладка «товары» - блок «списки». Идентификатор списка отображается следом за названием и выделен серым цветом и уменьшенным шрифтом.

* если продуктов нет, слайдер показан не будет

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

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

  • Игорь * Игорь * +0 7 ноября 2015 23:26 #

    Здравствуйте, возможно настроить отображение товаров в слайдере. По умолчанию сейчас фото не полностью отображается. Еще не видно прозрачных кружков

    1
  • Александр Тирон Александр Тирон +27 9 ноября 2015 13:11 #

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

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

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

    "Кружочки" не видно поскольку они белые, но можно сделать их любого цвета, например в цвет вашей темы оформления, добавив в пользовательские стили правила:

    .slider-homepage .bx-wrapper .bx-pager.bx-default-pager a:hover, .slider-homepage .bx-wrapper .bx-pager.bx-default-pager a.active {

    background-color: #E91E63;

    }

    .slider-homepage .bx-wrapper .bx-pager.bx-default-pager a {

    border-color:#E91E63;

    }

    1
  • Дмитрий Л. Дмитрий Л. +0 16 января 2016 14:49 #

    Здравствуйте. У меня на слайдере полностью не помещается название товара (названия разные, есть и длинные). Можно сделать так, чтобы оно переносилось на другую строку? А если места на слайдере все равно не будет хватать, то чтобы подгонялся размер шрифта?

    1
    • Александр Тирон Александр Тирон +27 16 января 2016 15:00 #

      Попробуйте в блок пользовательских стилей добавить правило:

      .da-slide h2 {
          font-size: 30px;
      }

      *где размер шрифта измените на свое усмотрение

      *в две строки разместить нельзя, поскольку элементы позиционированы абсолютно и в какой то момент блок с названием товара налезет на блок с его ценой.

      2
    • Дмитрий Л. Дмитрий Л. +0 16 января 2016 14:49 #

      1
    • Дмитрий Л. Дмитрий Л. +0 16 января 2016 15:33 #

      Спасибо за оперативность. Шрифт уменьшил и дописал в Ваше правило одну строку :

      .da-slide h2 {

      font-size: 20px;

      white-space: normal;

      }

      Получилось именно так, как хотел.

      1
    • Мария Шахова Мария Шахова +0 7 июля 2017 10:30 #

      ДОбрый день!

      Как добавить в слайдер карточки (не список) Промо (promocards)?

      1
    • Игорь Колмаков Игорь Колмаков +31 7 июля 2017 11:54 #

      Здравствуйте!

      не понял

      добавить в слайдер изображения из списка карточек промо?


      1
    • Иван Тарасевич Иван Тарасевич +0 2 августа 2017 13:54 #

      Добрый день!

      Хочу доработать слайдер изображений на главной: необходимо сделать так. чтобы каждое изображение задерживалось на 5 секунд. Сейчас, по умолчанию, 2-3 секунды. И вдогонку вопрос: можно ли осуществить смену слайдов не просто сдвижением изображений, а каким-либо другим эффектом?

      1
      • Александр Тирон Александр Тирон +27 2 августа 2017 14:02 #

        1) Если вы используете слайдшоу с изображениями, то в файле banner.images.html(Магазин-Витрина-Шаблоны) замените число:

        4000

        на число:

        5000

        *что увеличит интервал ожидания перед сменой слайда до 5 секунд, 1000 ~ 1 сек.

        Для смены эффекта переключения слайдов замените строку:

        'slideInRight,slideInLeft'

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

        sliceDown,sliceDownLeft,sliceUp,sliceUpLeft,sliceUpDown,sliceUpDownLeft,fold,fade,random,slideInRight,slideInLeft,boxRandom,boxRain,boxRainReverse,boxRainGrow,boxRainGrowReverse

        2) Если вы используете слайдшоу с продуктами, то изменить можно лишь время задержки переключения слайдов. В файле banner.products.html заменить число:

        5000

        по аналогии с предыдущей рекомендацией

        2

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

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

        Контакты

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

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

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

        Internet Explorer

        от Microsoft

        Chrome

        от Google

        Safari

        от Apple

        Opera

        от Opera Software

        Firefox

        от Mozilla

        Вверх