hi all,
I need to do in my shop exactly something like that (http://row.jimmychoo.com/en/women/shoes/anouk/black-patent-leather-pointy-toe-pumps-ANOUKPAT001.html?cgid=women-shoes#start=1).
simply put, use main images carousel.
can anyone advise me how to do it?
thx
"Open additional images in the main position" option makes images work similarly. If you want to make it look exactly like on that page, it's a matter of template/customization. Would need to write some custom JS and CSS.
Here is basic Bootstrap carousel example for VM:
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<?php $i = 0; foreach($this->product->images as $image){ ?>
<li data-target="#carousel-example-generic" data-slide-to="<?php echo $i ?>"<?php if ($i == 0){?> class="active"<?php }?>></li>
<?php $i++;}?>
</ol>
<div class="carousel-inner" role="listbox">
<?php $i = 0; foreach($this->product->images as $image){ ?>
<div class="carousel-item<?php if ($i == 0){?> active<?php }?>">
<img src="<?php echo $image->file_url ?>" alt="<?php echo $image->file_meta ?>">
</div><?php $i++;}?>
</div>
<a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
<span class="icon-prev" aria-hidden="true"></span>
<span class="sr-only"><?php echo JText::_('JPREV')?></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
<span class="icon-next" aria-hidden="true"></span>
<span class="sr-only"><?php echo JText::_('JNEXT')?></span>
</a>
</div>http://v4-alpha.getbootstrap.com/components/carousel/
thx, i try this :)