Прокрутка изображений в карточке товара

  • 88 Ответов
  • 10131 Просмотров

0 Пользователей и 1 Гость просматривают эту тему.

*

KrEvM

  • Новичок
  • *
  • 2
  • 0
Здравствуйте! Подскажите пожалуйста как реализовать что-то типа этого

*

Linfuby

  • Живу я здесь
  • ******
  • 1240
  • 174
  • Всё просто...
Я в свое время пользуясь шаблонами от YooTheme использовал их Widgetkit/Slideshow для этого.
Вам для реализации подобного нужно либо использовать возможности своего шаблона, либо сторонние компоненты.
Судя по тому, что Вы не знаете что это, и просто хотите такую фишку на свой шаблон, то Вам прямая дорога в Институт на соответствующую профессию.
Простите, если это грубо прозвучало, я сегодня расстроен...
А если серьезно, то Вам действительно нужно побольше изучить php и HTML чтобы воспользоваться такими фишками, либо платить тем, кто это сделает.
Немного воображения и логики, и любая проблема становится решенной.
Кривые решения - дают кривой результат!
Решения для JoomShopping
Благодарности и поддержка принимаются по след. реквизитам:
Яндекс.Деньги - 41001751720054

*

nevigen

  • Moderator
  • *****
  • 8832
  • 754
  • http://n*****n.com
1. найти скрипт пример
2. прикрутить его к шаблону
3. поправить сам шаблон нужным образом.
« Последнее редактирование: 25.12.2012, 23:56:41 от nevigen »
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !

*

KrEvM

  • Новичок
  • *
  • 2
  • 0
1. найти скрипт пример
2. прикрутить его к шаблону
3. поправить сам шаблон нужным образом.
Спасибо! Будем пробывать.

*

justAnn

  • Захожу иногда
  • **
  • 11
  • 0
  • Ctrl + Alt + Del + мозг
1. найти скрипт пример
2. прикрутить его к шаблону
3. поправить сам шаблон нужным образом.
Не получается прикрутить. Вот, что я наделала :
В начале файла \components\com_jshopping\templates\default\product\product_default.php вставила код

Код
<script type="text/javascript">
$("#foo2").carouFredSel({
 circular: false,
 infinite: false,
 auto    : false,
 prev    : {
 button  : "#foo2_prev",
 key     : "left"
           },
 next    : {
 button  : "#foo2_next",
 key     : "right"
           },
 pagination  : "#foo2_pag"
});
</script>

Потом вставила

Код
<div id='list_product_image_thumb'>
 
 <div class="image_carousel">
              <div id="foo2">

     <?php if ( (count($this->images)>1) || (count($this->videos) && count($this->images)) ) {?>
          <?php foreach($this->images as $k=>$image){?>
               <a class="lightbox" href="<?php print $this->image_product_path?>/<?php print $image->image_full;?>">
                    <img class="jshop_img_thumb" src="<?php print $this->image_product_path?>/<?php print $image->image_thumb?>" alt="<?php print htmlspecialchars($image->_title)?>" title="<?php print htmlspecialchars($image->_title)?>" />
               </a>
          <?php }?>
     <?php }?>
          </div>
               <div class="clearfix"></div>
               <a class="prev" id="foo2_prev" href="#"><span>prev</span></a>
               <a class="next" id="foo2_next" href="#"><span>next</span></a>
               <div class="pagination" id="foo2_pag"></div>
           </div>

           </div>
Ну и в файл ксс залила необходимые стили.  Может, сжалится кто-нибудь  и подскажет, что не так ?

*

justAnn

  • Захожу иногда
  • **
  • 11
  • 0
  • Ctrl + Alt + Del + мозг
так как же все-таки вставить в скрипт галереи генерирующиеся джумшоппингом изображения ?

*

DEADover

  • Новичок
  • *
  • 3
  • 0
1. найти скрипт пример
2. прикрутить его к шаблону
3. поправить сам шаблон нужным образом.
Нужно такое для шаблона на DIVах. Какова цена вопроса?

*

denben777

  • Осваиваюсь на форуме
  • ***
  • 157
  • 75
1. найти скрипт пример
2. прикрутить его к шаблону
3. поправить сам шаблон нужным образом.

Вариант с двумя стрелками и пагинацией (jQuery подключена):
Скачиваете по вышеуказанной ссылке скрипт, распаковываете, копируете файл (сейчас (02/05/2013) jquery.carouFredSel-6.2.1-packed.js) в папку http://ваш_сайт/components/com_jshopping/js/
Далее открываете файл  http://ваш_сайт/components/com_jshopping/templates/ваш_шаблон/product/product_deafult.php и в самый низ вставляете:
Код
<script type="text/javascript" src="<?php print JURI::base();?>/components/com_jshopping/js/jquery.carouFredSel-6.2.1-packed.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
// Using custom configuration
jQuery('#foo2').carouFredSel({
auto: false,
prev: '#prev2',
next: '#next2',
pagination: "#pager2",
mousewheel: true,
swipe: {
onMouse: true,
onTouch: true
}
});
});
</script>

затем ищем такой блок:
Код
<span id='list_product_image_thumb'>
<?php if ( (count($this->images)>1) || (count($this->videos) && count($this->images)) ) {?>
        <?php foreach($this->images as $k=>$image){?>
            <img class="jshop_img_thumb" src="<?php print $this->image_product_path?>/<?php print $image->image_thumb?>" alt="<?php print htmlspecialchars($image->_title)?>" title="<?php print htmlspecialchars($image->_title)?>" onclick="showImage(<?php print $image->image_id?>)" />
        <?php }?>
    <?php }?>
</span>
и меняем его на:
Код
<div id='list_product_image_thumb' class="list_carousel">
<?php if ( (count($this->images)>1) || (count($this->videos) && count($this->images)) ) {?>
        <ul id="foo2">
        <?php foreach($this->images as $k=>$image){?>
            <li><img class="jshop_img_thumb" src="<?php print $this->image_product_path?>/<?php print $image->image_thumb?>" alt="<?php print htmlspecialchars($image->_title)?>" title="<?php print htmlspecialchars($image->_title)?>" style="max-width:50px;max-height:50px;" onclick="showImage(<?php print $image->image_id?>)" /></li>
        <?php }?>
        </ul>
    <?php }?>           
    <div class="clearfix"></div>
    <a id="prev2" class="prev" href="#">&lt;</a>
    <a id="next2" class="next" href="#">&gt;</a>
    <div id="pager2" class="pager"></div>
</div>
Добавляем CSS (меняем под свои нужды):
Спойлер
[свернуть]
Проверил на JS 3.14.0 с дефолтным шаблоном -> работает, с lightbox не конфликтует.

*

Biss

  • Завсегдатай
  • *****
  • 760
  • 79
При переключении или выборе атрибута слетает скрипт и перекидывает на первое фото товара.
Такое происходит и без использования скрипта. Как фото товара может конфликтовать с атрибутами или это просто баг.
может кто знает решение проблемы
Version 3.13.2

Для себя нашел ответ в этой теме http://joomlaforum.ru/index.php/topic,196782.60.html
« Последнее редактирование: 08.06.2013, 19:58:31 от Biss »

*

avantyrist

  • Давно я тут
  • ****
  • 221
  • 3
Таже проблема
Biss поделитесь плииз решением

*

Biss

  • Завсегдатай
  • *****
  • 760
  • 79
В настройках JS снять галку Дополнительные параметры для атрибутов.

*

koshsh

  • Давно я тут
  • ****
  • 278
  • 8
Спасибо, все работает

*

yurykom

  • Осваиваюсь на форуме
  • ***
  • 40
  • 0
А что может быть не так, если при подобной карусельке при наличии только одной фотографии товара перестают работать некоторые другие скрипты на странице. Если же фотографий больше одной, то все нормально (и каруселька работает, и все остальное на странице)?

*

skyrec

  • Давно я тут
  • ****
  • 383
  • 10
  • Люблю я детей !!!
Вариант с двумя стрелками и пагинацией (jQuery подключена):
Подскажите пожалуйста, как грамотно подключить к такому варианту Hightslide вместо lightbox ? Без карусели получается, а с каруселью ну никак не могу заставить его работать...

*

avantyrist

  • Давно я тут
  • ****
  • 221
  • 3
А как же заставить работает ети карусели, Если НЕОБХОДИМО использовать дополнительные параметры для атрибутоов ? Может раскроет ктонить наконец етот секрет ?

*

Mitriy-Bug

  • Осваиваюсь на форуме
  • ***
  • 91
  • 1
  • Верстка сайтов на Joomla
очень помогло с прокруткой изображений, только скрипт слайдера пришлось искать отдельно :) потому что сайт не открывался почему что
Вольный работник

*

shurakana

  • Завсегдатай
  • *****
  • 793
  • 43
Я думаю вот этот прикрутить, http://www.starplugins.com/thumbelina, 1.5 kb в сжатом виде, понимает тачпады отлично..
Эта подпись отображается внизу каждого Моего сообщения. Я также могу использовать BB код и смайлы.

*

diana1975

  • Осваиваюсь на форуме
  • ***
  • 149
  • 1
Я думаю вот этот прикрутить, http://www.starplugins.com/thumbelina, 1.5 kb в сжатом виде, понимает тачпады отлично..
Хотела бы узнать, получилось ли у Вас прикрутить, 2 день не получается. а каруселька нравится, может, дадите краткую инструкцию как ее на сопутствующие товары натянуть?
пока что такая картина:http://prntscr.com/4ulnac

*

yurykom

  • Осваиваюсь на форуме
  • ***
  • 40
  • 0
А как же заставить работает ети карусели, Если НЕОБХОДИМО использовать дополнительные параметры для атрибутоов ? Может раскроет ктонить наконец етот секрет ?
Тот же вопрос! Есть решение?? Поделитесь, пожалуйста!

*

yurykom

  • Осваиваюсь на форуме
  • ***
  • 40
  • 0
Пожалуйста, кто в теме, поделитесь мыслями, как заставить работать карусель изображений в карточке товара при использовании дополнительных значений атрибутов.  !

*

nevigen

  • Moderator
  • *****
  • 8832
  • 754
  • http://n*****n.com
\components\com_jshopping\templates\default\product\block_image_thumb.php
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !

*

yurykom

  • Осваиваюсь на форуме
  • ***
  • 40
  • 0
\components\com_jshopping\templates\default\product\block_image_thumb.php
хм, если это ответ на мой вопрос, то я в растерянности. У меня даже такого файла нет...

*

nevigen

  • Moderator
  • *****
  • 8832
  • 754
  • http://n*****n.com
тогда у вас старая версия либо ЖШ либо шаблона.
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !

*

yurykom

  • Осваиваюсь на форуме
  • ***
  • 40
  • 0
Вы правы, не самая новая. Joomla 2.5, JS 3.15.
Я правильно понял, что в новой версии такой проблемы нет?
Обновлять JS - все переделки полетят.....

*

nevigen

  • Moderator
  • *****
  • 8832
  • 754
  • http://n*****n.com
нет на старой тоже наверное можно...
не уверен просто не помню уже
та и делать для старого варианта смысла нет.
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !

*

yurykom

  • Осваиваюсь на форуме
  • ***
  • 40
  • 0
nevigen, проблема в том у меня еще, что обновление JS видимо ничего не даст, поскольку шаблон-то старый останется. Или я что-то не так понимаю?

*

nevigen

  • Moderator
  • *****
  • 8832
  • 754
  • http://n*****n.com
если оставите то да.
а если внесете все правки которые внесены по версии, то будет новая версия и обновленный шаблон со старым дизайном.
в новой версии просто вынесено в отдельный файл все, в старой по моему на уровне библиотеки делалось.
но не уверен.
Профессиональные / Бесплатные решения для JoomShopping
Не лечи бесплатно, ибо тот, кто лечится бесплатно, рано или поздно перестает ценить свое здоровье,
а тот, кто лечит бесплатно, рано или поздно перестает ценить результаты своего труда/ (с) Гиппократ?
Не ищите ответов, ищите решение !

*

dmitry_stas

  • Профи
  • ********
  • 9653
  • 929
в новой версии просто вынесено в отдельный файл все, в старой по моему на уровне библиотеки делалось.

так и есть. при смене атрибута в новых версиях используются файлы шаблона, а в старых - function.php
Тут дарят бакс просто за регистрацию! Успей получить!
Все советы на форуме раздаю бесплатно, то есть даром. Индивидуально бесплатно консультирую только по вопросам стоимости индивидуальных консультаций

*

yurykom

  • Осваиваюсь на форуме
  • ***
  • 40
  • 0
а если внесете все правки которые внесены по версии, то будет новая версия и обновленный шаблон со старым дизайном.
в новой версии просто вынесено в отдельный файл все, в старой по моему на уровне библиотеки делалось.
Обновил магазин, закинул в используемый шаблон файл product_default и файл block_image_thumb.php из шаблонов компонента. Но ничего не изменилось. В block_image_thumb.php нужно какие-то изменения вносить?

*

dmitry_stas

  • Профи
  • ********
  • 9653
  • 929
а что должно было изменится? волшебным образом карусель должна была сама по себе заработать, или что? конечно, надо вносить изменения. примерно такие же, как и в карточке товара вносили для того, чтобы карусель работала. block_image_thumb.php всего лишь дает возможность сделать это в шаблоне не затрагивая ядра компонента, как было в предыдущих версиях ЖШ. и не более.
Тут дарят бакс просто за регистрацию! Успей получить!
Все советы на форуме раздаю бесплатно, то есть даром. Индивидуально бесплатно консультирую только по вопросам стоимости индивидуальных консультаций