Изменить вывод галереи товара
Добрый день!
Стоит minishop2 2.2.0-pl2, на странице товаров картинки выводятся через bx slider. Это не оч хорошо. Во-первых, как правило, у наших товаров одна картинка, а bx-slider упорно в гугл-хроме выводит две превьюшки (в эксплорере одну). Во-вторых, он вообще странный) Отображается маленькая превьюшка, большая картинка по клику — а хотелось бы, чтобы была большая средняя картинка, совсем большая выводилась в лайтбоксе, а если изображений больше одного, еще маленькие бы превьюшки для них были сбоку по вертикали.
Я хочу отказаться от bx slider в пользу чего-нибудь другого. Посоветуйте, пожалуйста, куда идти.
На самом сайте еще стоит Gallery, но там вывод другой — рядами средние превьюшки идут. В товарах нужно не такой вывод.
У меня сейчас в tpl.msGallery.outer стоит
Стоит minishop2 2.2.0-pl2, на странице товаров картинки выводятся через bx slider. Это не оч хорошо. Во-первых, как правило, у наших товаров одна картинка, а bx-slider упорно в гугл-хроме выводит две превьюшки (в эксплорере одну). Во-вторых, он вообще странный) Отображается маленькая превьюшка, большая картинка по клику — а хотелось бы, чтобы была большая средняя картинка, совсем большая выводилась в лайтбоксе, а если изображений больше одного, еще маленькие бы превьюшки для них были сбоку по вертикали.
Я хочу отказаться от bx slider в пользу чего-нибудь другого. Посоветуйте, пожалуйста, куда идти.
На самом сайте еще стоит Gallery, но там вывод другой — рядами средние превьюшки идут. В товарах нужно не такой вывод.
У меня сейчас в tpl.msGallery.outer стоит
<ul class="bxslider">
[[+rows]]
</ul>
<script type="text/javascript">
$('.bxslider').bxSlider({
pager: true,
controls: false,
auto: true,
minSlides: 1,
maxSlides: 1,
slideMargin: 0,
slideWidth: 358,
slideHeight: 540
});
</script>
Комментарии: 8
Поставьте fotorama.io — в новой версии минишопа автор именно его и использует как основной «из коробки».
Устанавливается крайне легко.
Устанавливается крайне легко.
Я в фотораме такого вывода не вижу. Надо что-то еще поискать. Мне надо как вот здесь, чтобы самые большие открывались еще и в лайтбоксе.
http://sotamebel.ru/catalog/prixozhie/gotovyie-komplektyi/nabor-mebeli-dlya-malenkoj-prixozhej-duet-2-chr.html
Ну, сейчас немного разобралась, осталось выбрать скрипт подходящий… или с этого сайта списать…
http://sotamebel.ru/catalog/prixozhie/gotovyie-komplektyi/nabor-mebeli-dlya-malenkoj-prixozhej-duet-2-chr.html
Ну, сейчас немного разобралась, осталось выбрать скрипт подходящий… или с этого сайта списать…
там стоит обычный lightbox
В новом Minishop2 я так сделал
<img src="{$files.0.url}" alt="" class="uk-thumbnail uk-margin-small-bottom">
<div data-uk-slideset="{ animation: 'scale', medium: 3 }">
<div class="uk-slidenav-position">
<ul class="uk-grid uk-grid-small uk-slideset uk-margin-bottom">
{foreach $files as $file}
<li>
<a href="{$file['url']}" target="_blank" data-uk-lightbox="{ group:'my-group' }">
<img src="{$file['small']}" alt="" title="" class="uk-thumbnail">
</a>
</li>
{/foreach}
</ul>
</div>
<ul class="uk-slideset-nav uk-dotnav uk-flex-center">...</ul>
</div>
.
Все сделала как хотела через фотораму. Я поняла: tpl.msGallery.outer — отвечает за внешний вывод слайдера, а в tpl.msGallery.row можно приписать картинке открытие в лайтбоксе по клику. Спасибо всем!
Да у меня-то старый пока minishop! Я теперь уже на github смотрю изначальный код моей версии и на него ориентируюсь. Я сделала так:
tpl.msGallery.outer
tpl.msGallery.outer
<div id="msGallery" class="pull-right">
<ul class="fotorama" data-width="200" data-height="350">
[[+rows]]
</ul>
</div>
tpl.msGallery.row<ii><a class="fancybox" rel="external" href="[[+url:default=`/assets/components/minishop2/img/web/ms2_big.png`]]" data-image="[[+url]]">
<img src="[[+194x347]]" alt="" title="[[+name]]" width="194" height="347">
</a>
</ii>
То что хотела! Если бы я лучше понимала синтаксис, я бы, конечно, быстрее добилась результата. А то все было как-то методом тыка и мата) Но понимание приходит постепенно.
А у вас ссылочки идут с миниатюр — это непривычно. Я сделала с больших картинок. Зато у вас тема красивая. У меня картинки все разнобоистые, не получится так хорошо.
Листать можно полноэкранные изображения. Хоть мышкой, хоть стрелочками на клавиатуре.
Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.