Главная » WordPress » WooCommerce: Перенос формы купона на странице оформления заказа

WooCommerce: Перенос формы купона на странице оформления заказа

Задача. По умолчанию форма ввода купона на странице оформления заказа выводится вверху, перед формой самой оформления заказа. Необходимо вывести (перенести) поле для ввода купона после итоговой суммы, перед выбором оплаты.

Решение. Форма купона выводится хуком 'woocommerce_checkout_coupon_form' в файе checkout/form-checkout.php (в зависимости от того, в теме или самим Woocommerce) в месте хука 'woocommerce_before_checkout_form'. В Интернете можно встретить решение, где предлагают удалить вывод купона в одном месте remove_action('woocommerce_before_checkout_form', 'woocommerce_checkout_coupon_form', 10); и вывести через другой хук. Но такой вариант не будет работать — при применении купона будет перенаправлять сразу на оплату. Это происходит из-за того, что в HTML купон и оформление заказа — это две формы form. Но формы не могут быть вложены друг в друга.

Решение 1. Способ в Код №1 заключается в скрытии основной формы купона через CSS и добавлении кастомной в нужном месте. А данные купона будут передаваться от кастомной в основную через JavaScript. Результат в Изображение 1.

Код №1: Перенос формы купона на странице оформления заказа
Форма купона на странице оформления заказа
Изображение 1: Пример вывода формы купона после итога перед оплатой

Решение 2. Вариант Кода №2 позволяет вывести сразу поле ввода купона и кнопку без ссылки «Нажмите, чтобы ввести свой код» (Изображение 2).

Код №2:
Вывод поля ввода купона WC на странице оформления заказа
Изображение 2: Пример вывода формы купона без ссылки показать поле.
5 1 голос
Рейтинг статьи
Подписаться
Уведомить о
guest

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.

0 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии