Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
  • Sign Up

[Поддержка] Анимация товара в корзину


Recommended Posts

Анимация товара в корзину


Чистый модуль для анимированного перемещения товара в корзину по нажатии на кнопку "купить".

Проверенно на версиях ocstore 1.5.3.1, 1.5.4.1, 1.5.5.1.2 на дефолтном шаблоне.

Для установки скопировать содержимое в корень сайта (модуль ничего не заменяет) в админке добавить модуль к нужным схемам. Можно добавлять на главную, при этом анимация будет у всех размещенных там модулей (при наличии конечно кнопки "купить").

В админке имеются некоторые настройки для недефолтных шаблонов, но для сильно недефолтных могут потребоваться допилы.

Для совместимости с filterpo v2.4.x в файле catalog/view/javascript/filterpro.min.js найти блок:

if (typeof(display) != "undefined") {        view ? display(view) : display("list");    }
 

и после него добавить:

if (typeof setAnimToCart == 'function') {      setAnimToCart();    }
 

Если в блоке с кнопкой купить находятся еще элементы с классом "button" (например быстрый посмотр, быстрый заказ и т.п.) то для работы модуля нужно чтобы эти элементы находились (в коде) после кнопки "купить".

!!! Пока не работает с зафиксированными корзинами (display:fixed;) !!!

Демо

Админка

Логин и пароль в админку - demo

Модуль проверен почти на всех версиях ОС (на текущий момент) и если все таки не работает, то скорее всего дело в кастомном шаблоне.

24/08/13

Добавлена версия с контролем наличия обязательных опций у товара. Т.о. анимация будет включаться только если обязательные опции товара выбраны. !! Если вы не используете в магазине опции то лучше брать версию без контроля опций.

30/01/14

В настройках добавлена возможность смещения для корзины по вертикали


  • Добавил
  • Добавлено
    05.06.2013
  • Категория
  • Системные требования
  • Метод активации
    Без активации
  • Ioncube Loader
    Нет
  • OpenCart
  • ocStore
  • OpenCart.Pro, ocShop
  • Обращение к серверу разработчика

 

  • +1 11
Link to post
Share on other sites

Здорово! +1

Link to post
Share on other sites

Плюсанул. После внедрения карусели и прочих изменений продукт.тпл перестала работать другая реализация, а данная работает превосходно, да ещё и настраивается в админке. Автор, молодчина. Вроде мелочь, а полезно)))

 

PS: Только заметил кое какую неприятность..

В списке\сетке, если товар имеет опции, то анимация начинается и прерывается переходом в карточку товара.

В самой карточке товара, если имеется необходимый выбор опций, то так же начинается анимация вместе с валидацией

С этим возможно бороться?

В этом варианте полёт срабатывал только при удачном добавлении товара в корзину.

Link to post
Share on other sites

Добрый день!

 

Подскажите пожалуйста - можно ли сделать так, чтобы координаты корзины автоматом подхватывались? т.е. где корзина расположена туда товар и летит??

Link to post
Share on other sites

baxabit, как из отпуска вернусь погляжу насчет опций

SonicEmp, а что у Вас корзина меняет местоположение? настройка смещения не помогает?

  • +1 1
Link to post
Share on other sites

baxabit, как из отпуска вернусь погляжу насчет опций

Оч большая просьба) На цветы женщине и мороженое детям скину в качестве благодарности))) в противном случае придётся отключить модуль(( в моём случае практически все товары имеют обязательные размер\цвет, а все как один сразу жмут "купить", не выбирая. Хотя, возможно, это повод задуматься..

Link to post
Share on other sites

Добрый день!

 

Подскажите пожалуйста - можно ли сделать так, чтобы координаты корзины автоматом подхватывались? т.е. где корзина расположена туда товар и летит??

Там есть такое https://opencartforum.com/files/file/1257-kw-flycart-–-настраиваемый-модуль-корзины-всплывающая/

да и опции тоже имеются

Link to post
Share on other sites

Модуль отличный, но не работает с этим дополнением  https://opencartforum.com/files/file/546-jv-quickorder-bystryi-zakaz-tovara/

 

А перекачайте, должно заработать...

з.ы. осенило блин в половине первого ночи, придумал как обойти наличие доп.кнопок в блоке с кнопкой купить...

  • +1 3
Link to post
Share on other sites

К сожалению пока не работает с зафиксированными корзинами, пока не придумал как решить...

  • +1 1
Link to post
Share on other sites

народ установил , но не работает ( в настройках нечего не трогал , кроме того как создал и вкличил , вот мой шаблон http://nova.azalia22.ru

Link to post
Share on other sites

А перекачайте, должно заработать...

з.ы. осенило блин в половине первого ночи, придумал как обойти наличие доп.кнопок в блоке с кнопкой купить...

Спасибо, все заработало. Отличный модуль.

Link to post
Share on other sites

народ установил , но не работает ( в настройках нечего не трогал , кроме того как создал и вкличил , вот мой шаблон http://nova.azalia22.ru

 

лично для Вашего шаблона animatetocart_1.5.3.1_1.5.4.1.zip

 

p.s. да, и не забудьте файлы шаблона по-умолчанию в папку defualt кладутся.. мало ли

  • +1 3
Link to post
Share on other sites

лично для Вашего шаблона attachicon.gifanimatetocart_1.5.3.1_1.5.4.1.zip

 

p.s. да, и не забудьте файлы шаблона по-умолчанию в папку defualt кладутся.. мало ли

то есть мне надо в архиве периименовать папку defualt в паку с именем моего шаблона и заливать ?

Link to post
Share on other sites

то есть мне надо в архиве периименовать папку defualt в паку с именем моего шаблона и заливать ?

ну можно так

Link to post
Share on other sites

большое спасибо , заработало , но только на странице котигорий , на странице товара анимации не происходит ( хотя установил позицию продукт

Link to post
Share on other sites

большое спасибо , заработало , но только на странице котигорий , на странице товара анимации не происходит ( хотя установил позицию продукт

замените animtocart.tpl вот здесь catalog\view\theme\вашатема\template\module

 

animtocart_tpl.zip

  • +1 1
Link to post
Share on other sites

 

замените animtocart.tpl вот здесь catalog\view\theme\вашатема\template\module

 

 

спасибо) но у меня нет прав чтобы скачать файл 

Link to post
Share on other sites

ура заработало ))) большое спасибо !!!  :eek:

Link to post
Share on other sites

ikarus, отдохнули? ))

Есть идеи по моему вопросу? )))

Link to post
Share on other sites

ikarus, отдохнули? ))

Есть идеи по моему вопросу? )))

в пнд подумаю что можно сделать, у Вас посложнее вопрос чем у прочих

  • +1 1
Link to post
Share on other sites

в пнд подумаю что можно сделать, у Вас посложнее вопрос чем у прочих

Я думаю многие опции задействуют..

до решения вопроса даже с опций "необходимость" снял.. ибо тупят посетители)))

Link to post
Share on other sites

Я думаю многие опции задействуют..

до решения вопроса даже с опций "необходимость" снял.. ибо тупят посетители)))

 

сделал, теперь при наличии у товара "необходимых" опций анимация не включается, на странице продукта также перед анимацией идет проверка по опциям.

 

но перед выкладыванием модуля надо все таки хорошенько его протестить, а у меня времени на это много нету... проверяйте, отписывайтесь, в демке модуль обновил

animtocart_options.zip

  • +1 2
Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Similar Content

    • By Leingard
      Модуль добавляет Preloader для Вашего магазина.
      Покупатели будут видеть анимационное изображение во время загрузки Вашего сайта. Повышает доверие и качество магазина.
       
      DEMO: http://gameshara.ru/module/
       
       
       
       
      10 видов самых популярных анимаций 2019 года 8 анимаций в SVG-формате (изображения состоят из кода и не нагружают Ваш сайт), 2 варианта сложных анимации в GIF Возможность установки любого цвета фона  
      Обновление 1.1
      Исправлено отображение прелоадера. Исправлены небольшие артефакты в версии OpenCart 3  
      Лицензия:
      Модуль продается с лицензией на сайт. Одна покупка = Один домен Покупая копию модуля вы получаете право на использование. Распространения модуль платно или бесплатно нарушает лицензию и грозит обнулением покупки, а так же уголовной ответственность предусмотренной статей 146 УК РФ (Нарушение авторских и смежных прав)  Автор оставляет за собой право изменят условия предоставления лицензии, изменения цены и стоков продления лицензии. Все доработки, переработки и изменения функционала не входят в стоимость модуля и оплачиваются отдельно по письменной договоренности с автором.  
      Тип распространения:
      Как есть
    • By Leingard
      750
      Скачать/Купить дополнение


      Preloader Pro - красивая загрузка Вашего магазина
      Модуль добавляет Preloader для Вашего магазина.
      Покупатели будут видеть анимационное изображение во время загрузки Вашего сайта. Повышает доверие и качество магазина.
       
      DEMO: http://gameshara.ru/module/
       
       
       
       
      10 видов самых популярных анимаций 2019 года 8 анимаций в SVG-формате (изображения состоят из кода и не нагружают Ваш сайт), 2 варианта сложных анимации в GIF Возможность установки любого цвета фона  
      Обновление 1.1
      Исправлено отображение прелоадера. Исправлены небольшие артефакты в версии OpenCart 3  
      Лицензия:
      Модуль продается с лицензией на сайт. Одна покупка = Один домен Покупая копию модуля вы получаете право на использование. Распространения модуль платно или бесплатно нарушает лицензию и грозит обнулением покупки, а так же уголовной ответственность предусмотренной статей 146 УК РФ (Нарушение авторских и смежных прав)  Автор оставляет за собой право изменят условия предоставления лицензии, изменения цены и стоков продления лицензии. Все доработки, переработки и изменения функционала не входят в стоимость модуля и оплачиваются отдельно по письменной договоренности с автором.  
      Тип распространения:
      Как есть Добавил Leingard Добавлено 17.04.2019 Категория Меню, дизайн, внешний вид Системные требования Метод активации Автоматическая активация Ioncube Loader Нет OpenCart 3.0
      2.3
      2.1 ocStore 3.0
      2.3
      2.1 OpenCart.Pro, ocShop Opencart.pro 2.3
      Opencart.pro 2.1
      OcShop 2.0.3.х Обращение к серверу разработчика Нет  
    • By Spojler
      Ребята, подскажите, как добавить вот такой скрипт анимации https://bobroed.ru/html-javascript/animaciya-dobavleniya-tovara-v-korzinu/ в ocStore 3.0.2.0?
      Куда прописать этот скрипт?
    • By serega-lomik
      Скачать/Купить дополнение


      Анимация при переключении табов. vQmod для 1.5 и OcMod для 2.0
      vQmod для 1.5 и OcMod для 2.0, добавляющие анимацию при переключении табов. Сам выбор анимации в xml файлах, разных видов 8 штук, но можно с лёгкостью добавить свой.
      Для 1.5 - распаковываете архив и закачиваете обе папки в корень сайта. Никакие файлы не перезаписываются.
      Для 2.0 - устанавливаете ocmod с помощью "установки дополнений в админке магазина."
      Поставляется как есть (as is), поддержка и адаптация к вашей теме и модулям - от 200руб.

      Демо 1.5: http://1.live-drive.ru/index.php?route=product/product&path=24&product_id=28
      Демо 2.0: http://oc2.oc-dev.ru/laptop-notebook/hp-lp3065
      Добавил serega-lomik Добавлено 18.06.2015 Категория Прочее  
    • By ghost298
      Меняем эффекты прокрутки стандартного слайдера в opencart 2.3
      1. Открываем /catalog/controller/module/slideshow.php
      2. Ищем:
      $this->document->addScript('catalog/view/javascript/jquery/owl-carousel/owl.carousel.min.js'); Меняем на:
      $this->document->addScript('catalog/view/javascript/jquery/owl-carousel/owl.carousel.js'); 3. Ниже добавляем:
      $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.transitions.css'); $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/animate.css'); В итоге должно получиться:
      $this->document->addScript('catalog/view/javascript/jquery/owl-carousel/owl.carousel.js'); $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.transitions.css'); $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/animate.css'); 4. Идем в папку /catalog/view/javascript/jquery/owl-carousel где открываем файл owl.carousel.js
      5. Ищем:
      support3d = (asSupport !== null && asSupport.length === 1); Меняем на:
      support3d = (asSupport !== null && asSupport.length >= 1 && asSupport.length <= 2); 6. Открываем /catalog/view/theme/ваша-тема/template/extension/module/slideshow.tpl
      7. Ищем блок похожий на:
      <script type="text/javascript"><!-- $('#slideshow<?php echo $module; ?>').owlCarousel({ items: 1, autoplay:true, autoplaySpeed:1500, autoplayHoverPause:true, loop: true, singleItem: true, nav: true, navText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'], dots: true }); --></script> 8. Перед items: 1, вставляем:
      animateOut: 'rollOut', animateIn: 'rollIn', 9. Скачиваем animate.css:
      Ищи внизу под выбором стиля анимации Download Animate.css
      10. Вставляем через FTP animate.css сюда:
      /catalog/view/javascript/jquery/owl-carousel/
      11. Переходим в /catalog/view/theme/ваша-тема/template/extension/module/slideshow.tpl
      12. Ищем:
      animateOut: 'rollOut', animateIn: 'rollIn', Меняем rollOut и rollIn на любую другую заставку.
      Названия эффектов можно посмотреть здесь:
      https://daneden.github.io/animate.css/
      Там же можно посмотреть и как он выглядит и как называется.
       
      Версия в которой я настраивал: opencart 2.3.0.2.2
       
      Сначала настраивал по аналогии как здесь:
      https://asterial.ru/saytostroenie/effekty-slaydera-owl-carousel-v-opencart-i-ocstore-2102-chto-delat-esli-slayder-ne
       
      Но по ходу были небольшие доработки.
      Теперь давайте подробнее объясню, что к чему.
      В пункте 3 я добавил строчку $this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/animate.css'); потому что в файле …owl.transitions.css'); прописаны не все эффекты и добавление одной этой строчки не достаточно. Там прописано по моему 4 или 5 эффектов. При подключении библиотек … animate.css'); все эффекты работали как положено. Файл animate.css скачивал с сайта https://owlcarousel2.github.io/OwlCarousel2/demos/animate.html, см. пункт 9. Там ниже под пунктом 1 ссылка на скачку.
      Далее расположение файла slideshow.tpl в opencart 2.3.0.2.2 лежит немного по другому пути. См. пункт 6.
      Строки animateOut и animateIn в файле slideshow.tpl как раз и отвечают за анимацию прокрутки.
      animateOut – означает каким эффектом будет убираться изображение.
      animateIn – каким эффектом будет появляться следующее за ним изображение и так по кругу.
      Кстати если не заморачиваться и в файле slideshow.tpl перед items: 1, вставить     animateOut: 'fadeOut', то у вас уже должна смениться анимация прокрутки так как этот эффект присутствует по умолчанию в библиотеке owl.transitions.css
      Надеюсь новичкам данный мануал будет кстати.
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.