VM AirSlider - слайдер изображений, который позволит пользователю просмотреть все изображения товара, находясь в каталоге, не переходя в карточку товара.
Основные преимущества
![]() |
Поддержка Touch and Drag |
![]() |
Lazy Load для дополнительных изображений товара |
![]() |
Кроссбраузерность |
Установка
Плагин VM AirSlider устанавливается стандартно через менеджер расширений.
После установки в Менеджере плагинов появится новый плагин airslider. Настройки плагина на скрине ниже.
Опция Высота изображения устанавливает максимальную высоту для изображений, которые выводятся в слайдере.
Поскольку virtuemart пока не позволяет через админ. панель настроить количество выводимых изображений для товара в категории (выводится только первое изображение), поэтому нужно вручную внести некоторые правки в код файла /components/com_virtuemart/views/category/view.html.php.
Эти правки полностью безопасны и никак не повлияют на другой функционал. После каждого обновления virtuemart правки нужно вносить заново. Если вы забудете это сделать, то это никак не отразится на работе сайта, просто для каждого товара будет как и раньше показываться только одна картинка.
Для virtuemart 3.0.14+
замените
1 |
$imgAmount = VmConfig::get('prodimg_browse',1); |
на
1 |
$imgAmount = VmConfig::get('prodimg_browse'); |
Для virtuemart 3.0.12 - 3.0.14
замените
1 |
$productModel->addImages($this->products, VmConfig::get('prodimg_browse',1) ); |
на
1 |
$productModel->addImages($this->products); |
Для virtuemart 3.0.0 - 3.0.12
замените
1 |
$productModel->addImages($this->products,1); |
на
1 |
$productModel->addImages($this->products); |
Для virtuemart 2
замените
1 |
$productModel->addImages($products,1); |
на
1 |
$productModel->addImages($products); |
Если необходимо ограничить количество выводимых изображений для товара, то просто замените в коде цифру 1 на нужное количество.
Последняя замена, которую необходимо сделать - это изменение кода, выводящего изображение товара в категории.
Для virtuemart 3
В файле /components/com_virtuemart/sublayouts/products.php замените
1 2 3 4 5 |
<a title="<?php echo $product->product_name ?>" href="<?php echo $product->link.$ItemidStr; ?>"> <?php echo $product->images[0]->displayMediaThumb('class="browseProductImage"', false); ?> </a> |
на
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<div class="vm-trumb-slider"> <div> <a title="<?php echo $product->product_name ?>" href="<?php echo $product->link.$ItemidStr; ?>"> <?php echo $product->images[0]->displayMediaThumb('', false); ?> </a> </div> <?php for ($i = 1; $i < count($product->images); $i++){ ?> <div> <a title="<?php echo $product->product_name ?>" href="<?php echo $product->link.$ItemidStr; ?>"> <img data-lazy="<?php echo '/'.$product->images[$i]->getFileUrlThumb(); ?>"> </a> </div> <?php } ?> </div> |
Для virtuemart 2
В файле /components/com_virtuemart/views/category/tmpl/default.php замените
1 2 3 4 5 |
<a title="<?php echo $product->product_name ?>" href="<?php echo $product->link; ?>"> <?php echo $product->images[0]->displayMediaThumb('class="browseProductImage"', false); ?> </a> |
на
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<div class="vm-trumb-slider"> <div> <a title="<?php echo $product->product_name ?>" href="<?php echo $product->link.$ItemidStr; ?>"> <?php echo $product->images[0]->displayMediaThumb('', false); ?> </a> </div> <?php for ($i = 1; $i < count($product->images); $i++){ ?> <div> <a title="<?php echo $product->product_name ?>" href="<?php echo $product->link.$ItemidStr; ?>"> <img data-lazy="<?php echo '/'.$product->images[$i]->file_url; ?>"> </a> </div> <?php } ?> </div> |
Чтобы после обновления сохранить все правки, скопируйте эти файлы в папку с используемым шаблоном по адресу:
- /templates/имя_шаблона/html/com_virtuemart/sublayouts/ для virtuemart 3
- /templates/имя_шаблона/html/com_virtuemart/category/ для virtuemart 2
Если в данных папках уже есть эти файлы, то править нужно их.
Если с правкой файлов возникнут проблемы, то после покупки я бесплатно помогу установить и настроить плагин на любом шаблоне.
Информация о плагине
Версия: 1.1
Последнее обновление: 8.12.2016
Дата создания: 9.06.2016
Совместимость с Joomla: 2.5.x - 3.9.x
Совместимость с Virtuemart: 2.0.x - 3.6.x
70 комментариев
denis2015
Добрый день! А можно сделать так, чтобы при наведении мышкой картинка 1 сменялась на картинку 2 (как это происходит в Ваших ранних шаблонах), а если есть еще картинки 3 и 4, то появляются стрелочки этого слайдера?
admin
Здравствуйте!
Да, так можно сделать.
С доработкой помогу бесплатно.
Максим
Оплатил
Руслан
Оплатил, нужно помощь в установке
admin
Спасибо за покупку, ссылку и информацию для установки отправил.
admin
Вышла новая версия плагина.
Всем покупателям была отправлена ссылка на скачивание.
Если вам по какой-то причине ссылка не пришла, то напишите на admin@virtuemart.su
IsaeffSerge
Подскажите, а в плагине есть возможность выбора изображений, которые будут показываться в слайдере? Например, мне не надо, чтобы в слайдере показывались фото, которые в карточке товара, наоборот, мне нужно показать фото с примерами дизайна.
admin
Здравствуйте!
Слайдер может показывать только фото, которые прикреплены к товару в его настройках.
Настроек для выбора что именно показывать нет, но можно задать, чтобы в слайдере показывались только фото, начиная, например, с 4 по счету.
IsaeffSerge
Жаль ( Может тогда подскажете, что можно сделать в моей ситуации. У меня в магазине товары идут по производителю, а у каждого производителя идут коллекции. В коллекции по 10-15 наименований плитки, декора и бордюров. Но помимо этого, есть еще примеры дизайна для каждой коллекции. И вот фото этих примеров надо отображать в слайдере, на страничке, где все коллекции идут. В идеале надо чтобы при клике на фото вылезал слайдер с фотками дизайнов.
Вот страничка с коллекциями
http://terrakota63.ru/index.php/keramicheskaya-plitka/azori1
Делать вкладку на карточке товара не хочу, т.к. мне потом эти дизайны в каждую карточку вкладывать - задолбаюсь )))
IsaeffSerge
Как вариант, можно добавить дизайны в карточку товара, но так, чтобы привязать их ко все товарам одной коллекции. Чтобы в каждой карточке не вписывать
admin
Можете прислать пример, как это реализовано в других магазинах, чтобы точно понять что именно нужно сделать?
IsaeffSerge
К сожалению, нигде ничего подобного не встречал. Но могу пояснить. Вот у нас есть различные коллекции: Амати, Бохо и др. И надо, чтобы при клике на картинку она открывалась всплывающим окошком и в нем же (окошке) был слайдер. А при клике на заголовок, например, Коллекция Amati открывалась страничка с самими товарами из этой коллекции. Зайдите по этой ссылке, будет понятнее
http://terrakota63.ru/index.php/keramicheskaya-plitka/azori1
IsaeffSerge
А можно как здесь
http://plitka02.ru/keramicheskaya-plitka/azori/kiana
во вкладке ДИЗАЙН прикрутить слайдер?
admin
Добавить вкладки на страницу категории можно. Для каждой категории можно назначить свой модуль со слайдером, но тут airslider не подойдет, нужно использовать какой-то другое решение. Пошагово не смогу расписать, задача не стандартная. Готовых решений нет,нужно обращаться на фриланс.
IsaeffSerge
Спасибо! Да я вот весь инет перерыл и не нашел ничего подобного...
Дина
Подскажите, пожалуйста, а если у меня товары в категориях и в магазине выводятся с помощью стороннего компонента, то этот слайдер не будет работать?
Андрей
Отличный плагин, все работает как надо! Но есть один нюанс - как сделать так, чтобы изображения сменялись не только на странице категории, но и на главной странице virtumart?
admin
Здравствуйте!
Рад, что плагин оказался полезен.
Уточните, на главной странице товары выводятся в модулях или через настройки в Virtuemart > Настройки > Шаблоны?
Андрей
Второй вариант - Virtuemart > Настройки > Шаблоны. Вывод через пункт меню Virtuemart >Главная.
admin
В этом случае верстка товаров должна быть идентична категории. Возможно, у Вас это поведение переопределено в шаблоне.
Пришлите доступ к админке, доступ к сайту по ftp и ссылку на вопрос на admin@virtuemart.su, разберемся.
akkelman
Здравствуйте!
Подскажите как то можно настроить чтобы высота слайдера картинок товара была не 250 а по максимальной высоте картинок в слайдере? https://yadi.sk/i/RcSDXnuN3XnhwK
Высота самой картинки в этой в позиции 90 пикселей. Но блок растягивается до 250 из за чего много пустого пространства, стрелки посередине блока и точки где то внизу(картинку я уже поднял вверх, по умолчанию она посередине блока выставляется, где сейчас стрелки). Момент ещё такой - есть товары которые вертикально более длинные, вместе с ними идут картинки с обычным аспектом примерно как здесь (подрисовал примерно схемку где должен заканчиваться блок слайдера и начинаться блок с точками) https://yadi.sk/i/z9zi2dgQ3XnisK
https://seifmebel.ru/safes/vzlomostojkie-sejfi
https://seifmebel.ru/safes/oruzhejnye-sejfy
admin
Здравствуйте!
Изменить высоту блока с изображением можно в настройках слайдера во вкладке Настройка стилей.
Виктория
Оплачено) Жду) перерыла все - не нашла лучше)
admin
Спасибо за покупку, ссылку отправил.
Виктория
Плагин отличный, не подскажете, первая картинка отображается миниатюра товара, как можно это изменить?
admin
Здравствуйте!
Нужно выводить полную картинку?
Если да, то в файле /components/com_virtuemart/sublayouts/products.php замените
на
Childinov
Здравствуйте, нужно сделать так, чтобы картинки товаров в категории брались не из миниатюр, а из полноразмерного изображения.
В файле /components/com_virtuemart/sublayouts/products.php заменил displayMediaThumb на displayMediaFull.
То-же самое сделал и в файле templates/t3_bs3_blank/html/com_virtuemart/sublayouts/products.php
Это сработало только для первых картинок товара, но если листать изображения дальше то они снова берутся из миниатюр.
Вот пример: https://tentodel.ru/ulichnye-zonty
Про Вас помочь решить эту проблему.
Спасибо!
admin
Используйте этот код
Если не поможет, то пришлите доступ к админке, ftp на admin@virtuemart.su, разберемся.
Childinov
Большое спасибо! Помогло
admin
Хорошо.
Андрей
А что нужно сделать, чтобы он заработал с компонентом Custom Filters?
При выборе любого значения слайдер изображений товаров на странице категории пропадает.
Как я понял, происходит переопределение шаблона вывода страницы.
admin
Нужно смотреть непосредственно на сайте.
Пришлите доступ к админке, доступ к сайту по ftp и ссылку на вопрос на admin@virtuemart.su, разберемся.
Lemuba
Здравствуйте! А с помощью этого плагина я добьюсь такого результата как тут:
в карточке смогут пользователи перелистывать фото?
admin
Здравствуйте!
Данный плагин работает только в категории.
Чтобы добавить слайдер в карточке товара нужно использовать отдельный плагин, например, VM Zoomer или VM Swipe.
Lemuba
VM Swipe больше подходит, но судя по демо у него нет такой возможности как у Зумера а именно расположение превью например слева... Или есть?
admin
Нет, в VM Swipe только горизонтальное расположение миниатюр.
vaitnait
Здравствуйте! Нужно состыковать этот плагин и компонент CustomFilters, так как на страницах результатов фильтрации плагин работать не желает, что очень и очень печально. Можете помочь с этим?
admin
Здравствуйте!
Поправить можно. Пришлите доступ к админке, ftp и ссылку на вопрос на admin@virtuemart.su
vaitnait
Здравствуйте! написала Вам сегодня на почту. Все доступы в письме. Заранее признательна за помощь.
admin
Здравствуйте!
Ответил по почте.
acfxdd
аналогичная проблема, написал вам на почту
admin
Ответил на почту.
djbu
тоже жду ответа по этому вопросу
admin
Чтобы слайдер картинок корректно работал при ajax загрузке (например, в фильтре или при подгрузке товаров с категории) в файле /plugins/system/airslider/airslider.php закомментируте
и для вывода используйте код
Сергей
Может кому поможет:
У меня нужно было заменить код в /ваш-шаблон/html/com_virtuemart/sublayouts/products.php
Заменить этот блок:
На этот:
Сергей
Часть кода отсеклась в комментарии, попытка №2:
Сергей
Обрубает часть кода, поэтому скинул на Гитлаб:
https://gitlab.com/Telion/mtk/-/blob/main/backup_MTK/conflict-between-plugins-Airslider-and-Custom-Filters.md
Ксения
Здравствуйте!
1. А можно ли так сделать, чтобы при клике на картинку товара в этом слайдере не шло перенаправления на карточку товара, а фото товара выводилось во всплывающем (модальном/шедоубоксе) окне в оригинальном размере?
2. С плагином VM Quick View работать будет?
admin
Здравствуйте!
1. Сделать можно.
2. Все будет работать.
korvin222
Обнаружил проблему при включенном плагине airslider - в шаблоне jsn venture pro в мобильной версии сайта перестаёт работать всплывающее окно добавления в корзину. Вместо этого сразу переводит в саму корзину.
Joomla и виртуемарт самые новые. версия php тоже не влияет на результат.
admin
После отключения плагина проблема пропадает?
Если да, то пришлите доступ к админке, ftp на admin@virtuemart.su, будем разбираться.
Алексей
Здравствуйте!
Такой вопрос уже был
Можно ли сделать, чтобы при клике на картинку товара в этом слайдере не шло перенаправление на карточку товара, а фото товара выводилось во всплывающем (модальном/шедоубоксе) окне в оригинальном размере?
Вы сами под такой вариант можете доработать плагин. Или нужно купить плагин и Вы поможете с настройкой?
admin
Здравствуйте!
Отдельной версии с всплывающем окном не планировал.
Если купите плагин, то правки внесу.
acfxdd
оплатил
admin
Спасибо за покупку, ссылку отправил.
Vakeks
Оплатил.
admin
Спасибо за покупку, ссылку отправил.
Валерий
Добрый день.
В файле view.html написано следующее: $productModel->addImages($this->products['0'], 10 );
Изображений у в слайдере выходятся по 10 шт, т.е. как и нужно, но у новых товаров, выводятся все. 20 и более...
Есть идеи?
Валерий
https://mebelnovelti.ru/katalog/divani-novelti.html
admin
Здравствуйте!
Товары добавляются вручную или импортируются?
Если импортируются, то при пересохранении из админки проблема уходит?
Валерий
Вручную.
admin
Тут проблема не в плагине, а где-то в другом месте, поскольку плагин просто берет уже готовые данные.
Пришлите доступ к админке, ftp на admin@virtuemart.su, посмотрим в чем дело.
Aleksander
Подскажите плиз. У некоторых товаров 5-7 изображений. А в слайдере прокуручивается только 4 картинки.
admin
Скорее всего, при замене в файле /components/com_virtuemart/views/category/view.html.php установлено ограничение на 4 картинки.
Aleksander
Да нет. Прописано просто как в статье.
Aleksander
Нашёл где прописано 4 картинки в слайдере. В переопределённом файле. Прописал 6 картинок товара.
/templates/шаблон/html/com_virtuemart/sublayouts/products.php
Богдан
Здравствуйте. Вижу, что продажа прекращена, но в прошлом году люди оплачивали, а в шапке написано, что материалы доступны. На всякий случай уточню, хотя вопрос может показаться глупым: то есть всё, купить уже нельзя?
admin
Здравствуйте, ответил на почту.
Here to Stay
здравствуйте, Владимир! а можно и мне на почту ответить? спасибо.
kalinka
Добрый день!
Можно ли купить VM AirSlider сейчас? И, если можно, то будет ли он работать с включенным в категории плагином stockable custom fields? (Joomla! 3.9.26, VirtueMart 3.8.4).