Как добавить мини-плавающую тележку в свой интернет-магазин?

Опубликовано: 2023-09-14

Ищете более плавное и приятное путешествие по магазинам? Откройте для себя удобство нашей мини-плавающей тележки — идеального спутника в покупках.

Добавьте на свой сайт электронной коммерции мини-плавающую тележку ajax, которая предоставит покупателям удобный, удобный и привлекательный способ взаимодействия с корзиной на протяжении всего пути к покупкам. Решая общие проблемы и упрощая процесс, это может повысить вероятность того, что пользователи завершат свои покупки.

Оглавление

Что такое мини-плавающая тележка?

Мини-плавающая корзина для покупок — это часто используемая функция на веб-сайтах электронной коммерции, направленная на улучшение пользовательского опыта. Он предлагает пользователям легкий доступ к просмотру товаров, которые они выбрали для покупки, и позволяет им вносить изменения в свой выбор, продолжая делать покупки.

Преимущества добавления мини-плавающей тележки

Давайте рассмотрим некоторые преимущества мини-плавающей корзины, которые позволят вам узнать, как легко использовать этот плагин после его установки на свой сайт.

  • Позволяет пользователям легко просматривать выбранные элементы без необходимости перехода на отдельные страницы.
  • Добавление скидочных/промокодов непосредственно в корзину упрощает процесс покупок, помогая пользователям совершать покупки и экономить без особых усилий.
  • Изменяйте количество продуктов и удаляйте ненужные товары прямо из удобной мини-плавающей тележки.
  • Вы можете создавать неограниченное количество корзин и отображать каждую из них на отдельных страницах.
  • Измените размер кнопок и значков, цвета кнопок и текста в соответствии с имиджем вашего бренда.
  • Выбирайте из множества значков открытия/закрытия корзины.

Добавьте мини-плавающую тележку в свой интернет-магазин

Теперь, когда вы осознали важность интеграции мини-плавающей корзины в ваш интернет-магазин для улучшения пользовательского опыта, давайте обрисуем простой процесс добавления плагина на ваш сайт WordPress.

Если вы уже знакомы с WooCommerce, вы можете приступить к установке плагина мини-плавающей корзины . Однако, если вы новичок в этом, мы рекомендуем подробное пошаговое руководство для вашего понимания.

Шаг 1. Установите плагин WooCommerce

WooCommerce — это плагин для электронной коммерции с открытым исходным кодом, который легко интегрируется с WordPress, удовлетворяя потребности онлайн-торговцев, от малого бизнеса до крупных предприятий. Этот широко известный плагин известен своими разнообразными функциями, которые различными способами улучшают веб-сайты электронной коммерции.

Если вы еще не интегрировали Woo Commerce на свой веб-сайт, первым делом установите этот инструмент.

Шаг 2. Выберите совместимую тему

Выберите тему WordPress, совместимую с WooCommerce. Мини-тележка Ajax совместима практически со всеми темами.

Шаг 3. Установите плагин WooCommerce Mini Floating Cart

Чтобы улучшить функциональность вашей корзины и удобство ее использования, рассмотрите возможность установки специализированного плагина мини-корзины WooCommerce. Здесь мы покажем вам, как установить плагин мини-корзины AJAX.

В этом уроке мы собираемся использовать плагин Mini Ajax Cart WooCommerce в качестве ссылки на корзину.

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

  • Перейдите в панель управления WordPress.
  • Перейдите в «Плагины» > «Добавить новый».
  • Найдите «Мини - тележка AJAX» .
  • Нажмите «Установить сейчас », а затем активируйте выбранный плагин.
добавить мини-плавающую тележку

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

  • Перейдите в панель управления WordPress
  • Перейдите в Mini Ajax Cart > Основные настройки .
  • Добавить название корзины
  • Включите кнопку «Включить мини-корзину ».
  • Обязательно «Опубликуйте/обновите» все необходимые изменения, которые вы внесли.

Нужно отображать корзину только на выбранных страницах? Не нужно беспокоиться. Вы можете выборочно отображать или скрывать корзину только на отдельных страницах. Настройте для него опцию «Показать/Скрыть на странице» по мере необходимости. Также отображайте корзину либо на всех устройствах, либо выборочно на настольном компьютере, планшете или мобильном телефоне.

Зайдите на свой сайт электронной коммерции, и вы увидите, что мини-плавающая тележка видна для удобства пользователя.

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

Шаг 4. Настройте мини-корзину

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

i) Корзина корзины/Настройки кнопок

Этот раздел позволяет вам персонализировать внешний вид кнопки корзины покупок на вашем сайте электронной коммерции. Среди различных вариантов значков корзины выберите тот, который лучше всего соответствует вашим предпочтениям. Кроме того, у вас есть возможность изменить форму кнопки в соответствии с вашими предпочтениями в дизайне и определить ее размещение на странице.

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

ii) Панель тележки

В этом разделе настроек у вас есть возможность точно настроить анимацию и увидеть видимые изменения на вашем веб-сайте электронной коммерции. Выберите анимацию, которая соответствует стилю вашего бренда.

iii) Содержимое корзины

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

Обратите внимание на поля купонов на скидку, поскольку они играют решающую роль, когда вы хотите предложить заманчивые предложения своим уважаемым клиентам. Покупатели могут легко ввести промокод, чтобы получить товары по сниженной цене. Если вам не нужна эта функция, вы можете просто отключить поле купона.

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

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

Шаг 5: Настройте внешний вид

Большинство плагинов мини-плавающих тележек допускают некоторую степень настройки цветов, стилей и макета. Давайте посмотрим подробнее, какие настройки вы можете сделать.

Дизайн

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

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

Кроме того, у вас есть возможность выбирать цветовые схемы для различных элементов, таких как типографика кнопок, кнопка «Купон», кнопка «Продолжить покупки», кнопка «Корзина/Оформить заказ» и кнопка «Удалить продукт» в макете сетки.

Шаг 6. Проверьте мини-тележку

Прежде чем разместить плавающую мини-корзину на действующем веб-сайте, крайне важно провести тщательную проверку качества. Убедитесь, что все работает безупречно, как и ожидалось: добавляйте и удаляйте продукты, корректируйте количество и убедитесь, что кнопка «Добавить в корзину» реагирует и полностью работоспособна.

Следуя этим шагам и используя правильное сочетание WooCommerce, совместимой темы и плагина мини-корзины, вы можете легко добавить мини-корзину AJAX на свой веб-сайт электронной коммерции WordPress без необходимости кодирования.

Разблокируйте премиум-функции

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

Давайте посмотрим на некоторые особенности Pro-версии:

  • 15+ готовых шаблонов для удобного импорта
  • Опция оформления заказа Ajax на панели корзины
  • 3 различных макета панели корзины: выдвижная, плавающая, всплывающая.
  • Дополнительные элементы для настройки корзины: заголовок, товары в корзине, купон, панель доставки, кнопки, предлагаемые товары.
  • Настраиваемые значки для корзины/кнопки корзины
  • 11 различных форм кнопок корзины
  • Различные анимации кнопок корзины, включая анимацию наведения и состояния ожидания.
  • Анимация панели корзины и анимация входа/выхода
  • Настраиваемые положения кнопок корзины
  • Совместимость Elementor с более чем 15 элементами Ajax Cart
  • Импорт/экспорт настроек между корзинами
  • Запуск панели корзины из разных элементов веб-сайта, используя имена классов
  • Возможность скрыть корзину, когда корзина пуста.
  • Открыть панель корзины при добавлении товара в корзину
  • Показать/скрыть и настроить необычную полосу прокрутки
  • Отображение активных кодов купонов и формы купонов
  • Настройка столбцов макета сетки для элементов корзины
  • Удалить все товары из корзины одной кнопкой
  • Настройте значки и текст, когда корзина пуста
  • Стеклянный фон морфизма для кнопки корзины и панели корзины
  • Пользовательский вариант CSS для дальнейшего оформления.

Плавающая тележка Mini Ajax имеет минимальные функции, и вы можете продолжать ее использовать, если она вас устраивает. Однако, если вам нужны дополнительные функции, вы можете перейти на премиум-версию, чтобы максимально эффективно использовать этот плагин.

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

Купить Премиум-версию