• Тип – выпадающая AJAX корзина для VirtueMart 2, 3.

Ajax Dropdown Cart for VirtueMart (от JEYAM Templates) – это адаптивный русскоязычный модуль корзины VirtueMart 3, 2 с возможностью отображения изображений, описаний и атрибутов товаров. Расширение достаточно простое в плане настройки как функционирования, так и внешнего вида (в рамках штатных опций).

В предыдущих статьях «Обзор One page checkout для VirtueMart 3. Оформление заказа» и «Обзор плагина быстрого заказа VirtueMart 3 для Joomla» уже были рассмотрены расширения, позволяющие упростить процесс оформления заказа и настроить его под Ваши потребности, выходя за рамки обычных возможностей VirtueMart. Также в этом разделе есть другие инструменты, позволяющие расширить возможности компонента интернет-магазина. А модуль Ajax Dropdown Cart for VirtueMart (рисунок ниже) призван заменить стандартную корзину VirtueMart без правки исходного кода.

Ajax Dropdown Cart for VirtueMart

Пример работы модуля корзины можно посмотреть на демонстрационном сайте разработчика.

В обзоре будет участвовать последняя, на момент написания статьи 11.10.2018, русскоязычная версия Ajax Dropdown Cart for VirtueMart 1.0.1 (от JEYAM Templates) в Joomla 3.8.13, VirtueMart 3.4.2.9966 и шаблоном сайта JM Computers and Electronics VirtueMart Storeу 1.11. Для приведения модуля корзины в соответствие с шаблоном были добавлены некоторые CSS стили.

На официальном сайте расширений Joomla 1 отзыв, расширение добавлено 9 ноября 2017.

  • Общий рейтинг – 94 из 100.
  • Функциональность – 94 из 100.
  • Простота использования – 94 из 100.
  • Документация – 94 из 100.
  • Поддержка – 94 из 100.
  • Соотношение ценакачество – 100 из 100.

На 12.10.2018 модуль стоит 25$ (техническая поддержка на один год для одного домена). Код расширения не зашифрован. По заявлению разработчиков ограничений на использование и обновление модуля нет.

Видео обзор

В данном видео показаны некоторые моменты, описанные в статье.

Видео лучше просматривать с качеством 720 HD. Этот и другие видео уроки можете найти на каналах сайта Aleksius.com в YouTube, Rutube и Mail.ru.

Основные возможности и особенности

Часть пунктов из списка ниже основываться на заявлении разработчика.

  • Поддержка Joomla 3 и 2.5, VirtueMart 3 и 2.
  • Адаптивный дизайн (рисунок ниже).
  • Переведён на русский и английский языки. Включая всплывающие подсказки к настройкам.
  • Базируется на AJAX. А это значит, что изменения в корзине (добавление/удаление товаров, пересчёт цены) будут происходить без перезагрузки страницы.
  • Возможность ограничения количества отображаемых товаров в спадающем списке корзины.

Корзина VirtueMart 3

  • Возможность активации прокрутки списка товаров в корзине (рисунок ниже).
  • Возможность показать/скрыть в спадающем списке корзины такие элементы: название товара, цену, атрибуты, описание и изображение товара.
  • Возможность задавать ограничение на количество символов в названии и описании товара.

Модуль корзины VirtueMart 3

  • Возможность настройки размера изображения товара в корзине.
  • Более 30 эффектов анимации для раскрытия списка товаров.
  • Более 30 иконок корзины и кнопки удаления товара их корзины.
  • Поддержка шрифтов Google.
  • Настройка ширины и цветового оформления разных элементов корзины (рисунок ниже).
  • Поддержка SEF (ЧПУ) URL-адресов товаров и страницы оформления заказа.
  • Не замедляет скорость работы сайта.

Настройка корзины VirtueMart 3

  • Отсутствие ошибок в коде. Модуль полностью проверен, в том числе в плане безопасности.
  • Простая настройка и установка.
  • Поддержка работы в таких браузерах как: Mozilla Firefox, Google Chrome, Opera, Safari, Internet Explorer 9-11, Microsoft Edge. Также я его тестировал в Яндекс.Браузер 18.9.1.954 (Windows 10 x64) и мобильной версии Google Chrome 69.0.3497.100 (Android 7.0.0).
  • Отсутствие ограничения на период обновления и использования на разных сайтах.
  • Наличие англоязычной справки и технической поддержки.

Настройка корзины VirtueMart

Все опции модуля Ajax Dropdown Cart for VirtueMart, помимо обычных настроек модулей Joomla, разделены на три вкладки:

  1. Настройки.
  2. Дизайн.
  3. Лицензия. Тут Вам нужно указать 16-ти символьный лицензионный ключ для получения технической поддержки от разработчика. Отсутствие ключа никак не влияет на функциональность модуля.

Вкладка Настройки (рисунок ниже). В основном, тут собраны опции, влияющие на функционирование модуля корзины. Например, можно показать изображение товара в корзине и настроить его размеры. У всех параметров вполне понятные описательные русскоязычные названия и у некоторых есть расширенные всплывающие подсказки. Рассмотрим только наиболее интересные, на мой взгляд, настройки.

Настройки

Количество товаров. Позволяет ограничить количество отображаемых товаров в спадающем списке корзины. Пользователь может добавлять сколько угодно товаров, но в списке будут показываться только несколько первых, согласно указанному Вами количеству.

Показывать описание. Позволяет отображать описание товара в спадающем списке корзины (рисунок ниже). Описание товара берётся из настроек товара во вкладке Описание – Краткое описание. Длину описания можно ограничить, задав количество символов в настройках корзины в поле Макс. кол-во символов описания. Если описание больше, чем указанное значение, то после него будет отображаться указанное в поле Текст после описания.

Описание товара в корзине

Показывать атрибуты. Позволяет отображать атрибуты товаров в корзине (рисунок ниже).

Атрибут товара в корзине

Для этого Вам нужно создать настраиваемое поле и активировать опцию Атрибут корзины (любую из них). Это можно сделать в VirtueMart – Настраиваемые поля (рисунок ниже).

Настраиваемые поля

А затем нужно прикрепить поле к товару. Это можно сделать в настройках товара на вкладке Настраиваемые поля (рисунок ниже).

Прикрепление настраиваемого поля к товару

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

Модуль корзины VirtueMart 3

Надпись на кнопке корзины. Тут можно задать текст, который будет показан на кнопке корзины. Другие надписи можно переопределить в Расширения – Языки – Переопределение констант. Немного подробнее об этом можно прочесть тут. В файле локализаций в корне сайта в «language/ru-RU/ru-RU.mod_vmajaxdropdowncart.ini» есть такие строки, влияющие на перевод элементов модуля корзины во фронтальной части сайта:

При необходимости можете их изменить.

Вкладка Дизайн (рисунок ниже). В основном, тут собраны опции, влияющие на цветовое оформление модуля. У всех параметров вполне понятные описательные русскоязычные названия, у некоторых есть расширенные всплывающие подсказки. Рассмотрим только одну опцию.

Настройка корзины VirtueMart 3

Название шрифта Google. Позволяет изменить шрифт всех текстовых надписей в корзине на один из шрифтов Google. Для этого вам необходимо перейти на сервис, выбрать нужный шрифт и скопировать в поле Название шрифта Google только часть URL адреса шрифта (рисунок ниже)

Выбор шрифта Google

В моём примере я выбрал шрифт «Amatic SC» с жирным начертанием (700). Из URL адреса шрифта «
» я скопировал только «Amatic+SC:700». Также не забывайте, что при выборе шрифта нужно помнить, что не все они поддерживают кириллицу. В сервисе Google, в панели слева, для опции Languages стоит выбрать Cyrillic.

Как видите, данный модуль корзины VirtueMart 3 является хорошей заменой стандартному модулю. А учитывая возможность использования и обновления расширения без ограничений, рекомендую рассмотреть Ajax Dropdown Cart for VirtueMart в качестве альтернативы штатной корзине.

Из этого туториала Вы узнаете, как решить проблему с кнопкой ‘Добавить в корзину’ после обновления компонента VirtueMart.

Откройте админ панель и перейдите на вкладку VirtueMart -> Настройка (Configuration).

Откройте вкладку Шаблоны (Templates).

Прокрутите вниз к разделу Активировать стили Css и скрипты Java (Activate Css Styles & Javascripts). Активируйте настройку Использовать Fancybox (Use Fancybox ) и сохраните изменения.

Обновите страницу. Вы решили проблему с кнопкой ‘Добавить в корзину’.

Вы можете также ознакомиться с детальным видео-туториалом ниже:

Сколько лет прошло, а стандартная корзина в virtuemart по-прежнему не работает нормально. Да, в virtuemart 3 в настройках появилась опция одностраничной корзины, но все равно для заполнения данных покупателя нужно переходить на отдельную страницу, что во многих случаях нежелательно.

Конечно, есть сторонние плагины:

  • VP One Page Checkout — лучший, на мой взгляд, плагин корзины.
  • One Page Checkout — тяжеловесный, но тоже хороший плагин.
  • VirtueMart One Page Checkout — бесплатный, но мало настроек.

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

Основные настройки для корзины находятся в Virtuemart > Настройки > Оформление заказа.

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

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

Все шаблоны корзины находятся в папке /components/com_virtuemart/views/cart/tmpl/. Если ниже не будет указан полный путь к файлу, значит он находится в этой папке. Как обычно, чтобы все изменения сохранились при обновлении, нужно скопировать все измененные шаблоны в папку /templates/имя_шаблона/html/com_virtuemart/cart/.

defaulp.php — это основной шаблон корзины, в котором подключаются все остальные шаблоны.

Форма для ввода логина и пароля