Стильный слайдер товаров Woocommerce


С помощью плагина – Woocommerce Products Slider, вы сможете добавить в свой онлайн магазин woocommerce, стильный слайдер товаров. В настройках плагина можно указать количество товаров в слайдере, количество колонок, показ навигации, скорость скольжения слайдов. У вас будет на выбор четыре стиля слайдера, можно выбрать или задать фон для слайдера. Можно включить или выключить отображение изображения, заголовка, отрывка, категории, цены, рейтинга и т.д.

 

скриншот слайдер

 

Установить плагин вы сможете прямо из админ-панели wordpress. Перейдите на страницу: ПлагиныДобавить новый, введите название плагина в форму поиска, нажмите Enter, установите и активируйте плагин.

 

плагин woocommerce

 

После установки и активации плагина, перейдите на страницу: WCPSNew WCPS, чтобы создать новый слайдер. На странице настроек слайдера, вверху, укажите любое название для слайдера. На вкладке Shortcode у вас будет отображаться шорткод и php код для вставки слайдера на сайт.

 

скриншот настройки

 

Options

Slider Total Items, количество товаров в слайдере.

Slider Column Number, количество колонок в слайдере, для отображения на компьютере, планшете и мобильном.

Slider Auto Play, авто-прокрутка слайдера, по умолчанию включена.

Slider Stop on Hover, остановка при наведении курсора мыши, по умолчанию включена.

Slider Navigation, навигация в слайдере, по умолчанию включена, отображается вверху справа.

Slider Pagination, пагинация в слайдере, по умолчанию включена, можно задать цвет и фон пагинации.

Slide Speed, скорость слайдера.

Pagination Slide Speed, скорость пагинации слайдера.

Slider Touch Drag Enabled, сенсорный слайдер с поддержкой перетаскивания, включён.

Slider Mouse Drag Enabled, перетаскивание с помощью мыши, включено.

 

настройки слайдер

 

Style

Themes for slider, выберите стиль слайдера. На скриншоте в начале записи показан стиль по умолчанию.

Slider Ribbon, слайдер лента, оставьте по умолчанию.

Container options, опции контейнера слайдера. Можно указать размер обивки слайдера, выбрать цвет фона или изображение фона слайдера.

Items Options, параметры элементов.

 

настройки скриншот

 

Content

Empty Thumbnail, здесь указано изображение по умолчанию для товаров без изображений.

Query order, сортировка товаров, по умолчанию указано – по убыванию.

Query orderBy, по какому признаку сортируются товары.

Hide out of stock items, оставьте по умолчанию.

Filter Slider Content, фильтр слайдер контента. По умолчанию в слайдере отображаются последние опубликованные товары.

Items sort, можно скрыть или настроить элементы товара в слайдере.

После настройки слайдера, нажмите на кнопку – Опубликовать.

 

настройки скриншот

 

На вкладке Custom CSS расположены стили слайдера. Далее, перейдите на вкладку Shortcode и скопируйте шорткод слайдера для вставки на страницу или в запись. Вы так же можете воспользоваться php кодом для вставки слайдера в файлы header.php или footer.php.

 

шорткод слайдера

 

Откройте страницу редактирования записи или страницы, куда вы хотите добавить слайдер. Вставьте на страницу шорткод слайдера и обновите страницу.

 

страница редактирования

 

После публикации или обновления страницы слайдер появится на вашем сайте. Остались вопросы ? Напиши комментарий !

 






info-effect.ru
Стильный слайдер товаров Woocommerce обновлено: Май 11, 2018 автором: Илья Журавлёв

10 комментариев

  • Александра 21.10.2016 Ответить

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

    • Илья Журавлёв 21.10.2016 Ответить Автор

      Попробуй тогда здесь поискать – Рубрика Слайдер. Обычные слайдеры для woocommerce тоже подходят.

  • Алексей 31.01.2017 Ответить

    Здравствуйте! Скажите,а как добавлять определенный товар в слайд. Выбрать товар для слайда

    • Илья Журавлёв 31.01.2017 Ответить Автор

      Здравствуйте, посмотрите параметр “Filter Slider Content” на вкладке “Content”. Есть другие слайдеры для Woocommerce.

  • Анна 09.05.2017 Ответить

    Добрый день! Отсутствуют кнопки прокрутки, а в настройках галочки проставлены правильно. Как поправить?

    • Илья Журавлёв 09.05.2017 Ответить Автор

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

      Навигация может не отображаться, если у вас к примеру всего 3 товара и на странице тоже 3 отображается, прокрутка в таком случае не нужна.

  • Андрей 10.05.2018 Ответить

    Добрый день.
    А как настроить слайдер для товаров с определённой меткой из разных категорий ?
    Я не нашел такой опции в этом слайдере.
    Или такая вообще не предусмотрена ?

    • Илья Журавлёв 11.05.2018 Ответить Автор

      Здравствуйте. Такие функции есть в плагине AS woocommerce with owl carousel. Ещё посмотрите плагин Carousel Slider, там тоже есть выбор категорий и меток.

  • Андрей 12.05.2018 Ответить

    Спасибо!
    Carousel Slider у меня не заработал. А AS меня смущает тем, что не обновлялся 2 года. С текущей версией я его проверю, но , как он поведет себя в будущем у заказчика при регулярных обновлениях WP, я поручиться не смогу.

    • Илья Журавлёв 12.05.2018 Ответить Автор

      Посмотрите ещё плагин Woo Product Slider and Carousel with category, я его не разбирал, но, там тоже есть функция “Сортировать по категориям”.

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

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Нажимая на кнопку Отправить комментарий, вы соглашаетесь с Политикой конфиденциальности и Пользовательским соглашением сайта info-effect.ru


Обратная связь

Политика конфиденциальности - Пользовательское соглашение

Стрелка вверх