Opencart, Заказ в 1 клик

15.10.2015 03:50

Сегодня мы за 5 минут внедрим в наш интерне-магазин кнопку "Заказ в 1 клик". Для начала, давайте разберём способы заказа в интернет-магазине:

  1. Стандартная кнопка "Добавить в корзину", после клика на неё человек продолжает просматривать магазин и сам переходит к оформлению заказа.
  2. Кнопка "Быстрый заказ", по нажатию на которую всплывает форма, в которой нужно заполнить имя и телефон, чтобы оператор мог перезвонить.
  3. Кнопка "Заказать и оформить", по нажатию на которую товар добавляется в корзину и пользователь перенаправляется на страницу оформления заказа.

Первый вариант реализован в стандартном функционале. Второй вариант, на мой взгляд, бесполезен, потому что дублирует модуль "Перезвоните мне", да и диктовать свои реквизиты по телефону+ ждать звонка оператора ещё то удовольствие. По этому реализовывать будем третий вариант.

Открываем шаблон товара: /catalog/view/theme/default/template/product/product.tpl Находим строчку с заголовком товара:

<h1><?php echo $heading_title; ?></h1>

И выше неё вставляем кнопку:

<input type="button" class="btn btn-primary btn-lg btn-block" value="Купить и оформить" id="oneclickbuy">

Далее, переходим вниз, к секции с яваскриптом и выше функции:

$('#button-cart').on('click', function() {

Вставляем следующий код:

$('#oneclickbuy').click(function()
  {
  $('#button-cart').trigger('click');
  setTimeout(function()
    {
    if($("div").is(".alert-success"))
      {
      location='/index.php?route=checkout/checkout';
      }
    }, 1000);
  });

Всё, готово.

op-1-click

Работает это следующим образом:

  • При клике на кнопку "Купить и оформить" вызывается событие "click" для стандартной кнопки "Добавить в корзину".
  • Ждём 1 секунду, чтобы отработал ajax запрос.
  • Проверяем, появилось ли сообщение об успешном добавлении товара в корзину, и, если появилось, перенаправляем пользователя на страницу оформления заказа.

Пример, как обычно, можно посмотреть на тестовом магазине: opencart.allwebstuff.info



Обзор форумных движков. "Взгляд верстальщика"

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

Peer authentication failed for user “postgres”

При разворачивании проекта на руби возникла ошибка: Peer authentication failed for user “postgres”. После недолгого гугления выяснилось, что приложение пытается подключаться к базе данных, используя логин и пароль, и не обращает внимание на то, что в настройках бд выставлено подключение в положение "peer"- не требующее вводить пароль при подключении, а проверяющее права пользователя операционной системы.


(12) Комментариев

Александр - 15.10.2015 05:52:40
- 0    + 0
Классно! Сегодня-завтра попробую, как раз искал это на Вашем сайте!)) Спасибо!
Илья - 15.10.2015 12:25:28
- 0    + 0
Спасибо. Очень приятно, когда кому-то нужна моя работа)
Илья - 05.11.2015 05:45:01
- 0    + 0
Все таки заказ в 1 клик это как раз попап форма в которой надо ввести имя и тел с отправкой менеджеру по нажатию кнопки отправить. На форме должно быть указано название товара. Потому как зачастую людям лень заполнять какие то поля в корзине ... из практики такие заказы прилетают почти каждый день
Александр - 09.11.2015 07:57:08
- 0    + 0
Спасибо! Полезная статья! У меня к вам вопрос близкий к теме) У нас опенкарт 2.0.2.0 , перенесли на новый домен и хостинг. Все гуд, все работает. Но появилась такая проблема - при нажатии на кнопку "Подтвердить заказ" в оформлении заказа, в кнопке остается текст "Loading..." и через 5-8 сек заказ оформляется (а должен почти моментально, как работало на старом хостинге). На новом хостинге техподдержка ответила таким образом:

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

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

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

Может быть вы что-то подскажете где и что посмотреть?)
Илья - 09.11.2015 08:24:55
- 0    + 0
Пока не посмотрю сам сайт- помочь точно не смогу. Нетронутый opencart, при оформлении заказа, отправляет всего 2 запроса на /index.php?route=payment/cod/confirm и на /index.php?route=checkout/success. Так что скорее всего у Вас стоит какой-то модуль оформления заказа и соответственно он поломался...
Александр - 09.11.2015 14:54:29
- 0    + 0
Оказывается, дело было в сервере, все поправили, спасибо!)
Сергей - 23.09.2016 09:03:00
- 0    + 0
Здравствуйте. Александр, а как исправили проблему на новом сервере?
Ринат - 21.02.2016 07:42:59
- 0    + 0
Спасибо, за ваши советы.
Возникли вопросы по этой статье.
Как сделать чтобы кнопка "Заказать и оформить" была в стиле шаблона? Сейчас это обычная серая кнопка. И как ее правильно спозиционировать? Хотелось бы ее прижать к правому краю контейнера. И главное, функция полностью не отрабатыватеся, т.е. кнопка просто добавляет товар в корзину.
Анастасия - 23.02.2016 18:30:36
- 0    + 0
Спасибо за полезную статью. А как сделать, чтобы ещё перенаправление на страницу оформления заказа шло?
Илья - 24.02.2016 01:18:11
- 0    + 0
Ринат, Если шаблон свёрстан правильно, то кнопка должна автоматически принимать стиль шаблона. В противном случае, придётся стилизовать кнопку вручную. Тоже самое и с позиционированием.

Анастасия, Если Вы всё сделали правильно, то редирект должен быть автоматический.


$('#oneclickbuy').click(function()
{
$('#button-cart').trigger('click');
setTimeout(function()
{
if($("div").is(".alert-success"))
{
location='/index.php?route=checkout/checkout';
}
}, 1000);
});


Этот кусочек кода редиректит на оформление заказа.
алекс - 07.04.2016 11:45:50
- 0    + 0
подскажите бесплатный модуль для 2.1.0.1 заказ в 1 клик, буду признателен
Илья - 07.04.2016 16:01:06
- 0    + 0
Если тут не найдёте, то значит таких нет.