newjey

Спасибо за ответ, но надо что бы блок 4 на мобильных был тоже в конце.

В карточке товара не получается один блок выровнять 4ый блок почему-то ровняется по 2му блоку и получается не красиво. Как его подтянуть выше, под 3ий блок? margin пробовал, но при просмотре на мобильном блоки наезжают друг на друга. Сейчас разметка имеет такой вид <div class="row" style="margin-top:-13px;"> <?php echo $column_left; ?> <?php if ($column_left && $column_right) { ?> <?php $class = 'col-sm-6'; ?> <?php } elseif ($column_left || $column_right) { ?> <?php $class = 'col-sm-9'; ?> <?php } else { ?> <?php $class = 'col-sm-12'; ?> <?php } ?> <div id="content" class="<?php echo $class; ?>"><?php echo $content_top; ?> <div class="row"> <div class="col-xs-12 col-sm-12 col-md-5 col-lg-4 visible-lg visible-md nopad" style="float:right;"> логотип </div> <div class="col-xs-12 col-sm-12 col-md-7 col-lg-8" style="float:left;"> 1ый блок </div> <div class="col-xs-12 col-sm-12 col-md-5 col-lg-4" style="float:right;"> 3ий блок </div> <div class="col-xs-12 col-sm-12 col-md-7 col-lg-8" style="float:left;"> 2ой блок </div> <div class="col-xs-12 col-sm-12 col-md-5 col-lg-4" style="float:right;"> 4ый блок </div> </div> </div> </div>

Понял, спасибо. Будем разбираться. С наступающим вас.

Зайдём с другого боку) Вывел главное фото слайдером + кнопки под главным фото для переключения слайдов. Вопрос теперь как вместо этих кнопок (точек) выести превьюшки (дополнительные фото)?

делаю к примеру так: <div id="owl-demo" class="owl-carousel owl-theme"> <div class="item"><li><a class="thumbnail" href="<?php echo $popup; ?>" title="<?php echo $heading_title; ?>"><img src="<?php echo $thumb; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a></li></div> </div> <script> $(document).ready(function() { $("#owl-demo").owlCarousel({ navigation : true, slideSpeed : 300, paginationSpeed : 400, items : 1, itemsDesktop : false, itemsDesktopSmall : false, itemsTablet: false, itemsMobile : false }); }); </script> <style> #owl-demo .item img{ display: block; width: 100%; height: auto; } </style> Но основное фото как выводилось так и выводится, нет слайдера( что я не так делаю?

Я не специалист в програмировании просто, не хватает навыков. Я так понимаю за вывод доп изображений отвечает: <?php if ($images) { ?> <?php foreach ($images as $image) { ?> <li class="image-additional"><a class="thumbnail" href="<?php echo $image['popup']; ?>" title="<?php echo $heading_title; ?>"> <img src="<?php echo $image['thumb']; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a></li> <?php } ?> <?php } ?> а вывод основного изображения это: <?php if ($thumb) { ?> <li><a class="thumbnail" href="<?php echo $popup; ?>" title="<?php echo $heading_title; ?>"><img src="<?php echo $thumb; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a></li> <?php } ?> Верно я понимаю?

Не выходит вообщем ничего( наверное руки не из того места ростут. Получается или вывести доп изображения слайдером или основное без дополнительных изображений(

Точнее мне надо реализовать миниатюры в карточке товара.

Вас можно попросить платно сделать? Сколько это будет стоить?

нашёл вот такой ещё способ сайт. но он тоже не работает(

Теперь точно запутался.

В slideshow.tpl указанно: var pafinatorsLink = $('.owl-controls .item-link'); $.each(this.owl.userItems, function (i) { $(pafinatorsLink[i]) // i - counter // Give some styles and set background image for pagination item .css({ 'background': 'url(' + $(this).find('img').attr('src') + ') center center no-repeat', '-webkit-background-size': 'cover', '-moz-background-size': 'cover', '-o-background-size': 'cover', 'background-size': 'cover' }) // set Custom Event for pagination item .click(function () { owl.trigger('owl.goTo', i); }); в стилях прописаны классы: .owl-theme .owl-controls .item-link { position: relative; display: block; width: 100px; height: 40px; margin: 0 2px; border-bottom: 4px solid #ccc; outline: none; } .owl-theme .owl-controls .active .item-link { border-bottom: 4px solid #cc4895; } но не выводится ничего(

Сделал так же как у вас, но миниатюры не появились. В чём может быть проблема?

Это понятно. Знать бы просто куда смотреть что бы подправить. Или со стилями проблема или скрипт какой-то не подключен.

Перечитал, установил мод и сделал по переведённой выше инструкции. Но миниатюры не появились(.

Сделал, так же, не помогло.

Слёзно прошу, подскажите как их добавить?) Спасибо.

Осталось значит вывести миниатюры под главным фото. Как это можно сделать?

Спасибо размер увеличил, всё ок. Но почему нет всех превьюшек под главным фото?

Нашел вот такой файл, установил его галерея изменилась, но очень странно выводится. а дополнительные изображения отсутствуют под главным фото, но в галерее они есть и выведены в маленьком разрешении: Может где-то конфлик или не подключен скрипт какой-то? carousel_product_img.ocmod.xml

Сейчас вывод главного фото и дополнительных реализован таким образом: <?php if ($thumb || $images) { ?> <ul class="thumbnails"> <?php if ($thumb) { ?> <li><a class="thumbnail" href="<?php echo $popup; ?>" title="<?php echo $heading_title; ?>"><img src="<?php echo $thumb; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a></li> <?php } ?> <?php if ($images) { ?> <?php foreach ($images as $image) { ?> <li class="image-additional"><a class="thumbnail" href="<?php echo $image['popup']; ?>" title="<?php echo $heading_title; ?>"> <img src="<?php echo $image['thumb']; ?>" title="<?php echo $heading_title; ?>" alt="<?php echo $heading_title; ?>" /></a></li> <?php } ?> <?php } ?> </ul> <?php } ?> Как его подправить для вывода через owl ?

Что-то последнее время люди на форуме вроде вымерли(

Я так понимаю что это owl carousel, как её подключить вместо стандартной?

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

Добрый день. Подскажите как перенести кнопку купить под фото, то есть над описанием. Сейчас она выводится под описанием. Это надо только в разрешении под мобильные устройства (xs). Спасибо.