Привет! Сегодня я покажу вам как добавить на страницу товара Woocommerce кнопку Купить в один клик. Покупатель жмёт на кнопку, появляется popup окно с формой. Он указывает своё имя, телефон, дополнительную информацию и жмёт отправить. Вам приходит письмо на email с контактами покупателя и информацией. Плюс, в письме вы сразу видите, какой товар хотят купить в один клик, его название и ссылка на страницу товара.
Я хочу предложить вам альтернативу плагину Buy one click WooCommerce. У многих он глючит, люди пишут мне, жалуются. Я покажу вам как сделать очень простой, удобный и надёжный заказ товара. Всё очень просто! Смотрите далее!
Кнопка Купить в один клик товар Woocommerce
Вам понадобится плагин Contact Form 7.
И плагин Easy FancyBox. Установите их на свой сайт и активируйте.
Далее, переходим: Настройки – Медиафайлы. В настройках Media, поставьте галочку напротив параметра Inline content. Сохраните изменения.
Обратите внимание! Уберите галочку напротив Images, если у вас уже стоит плагин для просмотра изображений в лайтбокс окне.
Далее, перейдите на страницу создания/редактирования формы. Вы можете добавить в форму любые поля! Обязательно поставьте защиту reCaptcha от спама!
Далее, вверху перейдите на вкладку Письмо. Обратите внимание на тело письма! Обязательно добавьте шорткоды полей, они выводят информацию, которую указывает покупатель в форме. Ещё добавьте:
- [_post_title] – выводит в письме название товара, на странице которого нажали на кнопку Купить в один клик;
- [_post_url] – выводит в письме ссылку на заказанный товар.
- Сохраните изменения!
Далее, перейдите на страницу: Внешний вид – Редактор, справа откройте для редактирования файл functions.php. В самый низ файла вставьте специальный код функции, которая выводит кнопку на страницу товара. Сохраните изменения. Ниже вы можете скопировать данный код!
В коде замените шорткод контактной формы Contact Form 7 на свой!
Здесь вы можете скопировать код:
//Купить в один клик add_action( 'woocommerce_single_product_summary', 'return_policy', 30 ); function return_policy() { global $product; if ( !$product->is_in_stock() or !$product->get_price_html()) { } else{ ?> <p class="buy-one-click"><a class="fancybox-inline single_add_to_cart_button button alt" href="#contact_form_pop_question">Купить в один клик</a></p> <div class="fancybox-hidden" style="display: none;"> <?php echo '<div id="contact_form_pop_question">'.do_shortcode('[ваш шорткод contact form 7]').'</div>'; ?> </div> <? } }
Всё готово! Вот так просто и быстро вы можете добавить на страницу товара кнопку Купить в один клик.
Как добавить в форму защиту от спама reCaptcha
Как изменить внешний вид формы Contact Form 7
Остались вопросы? Напиши комментарий! Удачи!
Спасибо Вам за сайт и собранную информацию, очень помогает!
Вопрос по кнопке покупки в один клик: а как ее разместить справа от кнопки “в корзину”, а не под ней?
Пожалуйста! Есть два варианта: 1 – создать php функцию., 2 – Добавить CSS стили. Может помочь плагин – SiteOrigin CSS, параметр Margin.
Если закрыть лайтбокс и затем снова открыть, то вместо формы вылезает ошибка:
The requested content cannot be loaded.
Unexpected response.
В чем может быть причина и как исправить?
Вы точно всё сделали правильно, по инструкции?
Здравствуйте.
Устанавливать не пробовал но сразу вопрос.
Товар в корзину добавляется для оплаты?
Спасибо за статью.
Здравствуйте.
Устанавливать не пробовал но сразу появился вопрос.
Товар в козину добавляется для оплаты ?
Спасибо за статью, полезно.
Здравствуйте. Нет конечно. Это заказ в один клик, с помощью одной формы. Клиент оставляет свои реквизиты, вы ему перезваниваете и оформляете заказ по телефону. Добавление в корзину есть в Woocommerce по умолчанию.
Задача в следующем.
Нужно от клиента получить данные при оформлении заказа, нашел плагин где можно редактировать поля в Woocommerce но нет возможности отправить фото.
Получается клиент оформляет заявку на размещение объявлений, я получаю данные, оплачивает товар в корзине, я запускаю данные в работу.
Пример формы есть /obyavka.by/rassyilka-obyavleniy-uslugi-gruzoperevozki-na-20-dosok/
Нужно завязать с формой оформления заказа, что бы не писать сложную инструкцию. Типа заполните там, перейдите сюда и заполните еще раз.
Есть плагин специальный WooCommerce Uploads, чтобы загружать файлы при оформлении заказа.
Спасибо. Буду пробовать.
Кнопки рассказать друзьям не нашел, кликнул по рекламе!
Как изменить размер окна, когда нажимаешь кнопку? (Где поля имя, телефон… а то широкое получается)
Разве поле не адаптивное у вас? Есть плагин SiteOrigin CSS. Можно вручную изменить CSS стили. Только все стили переносите на WordPress – Внешний вид – Настроить – Дополнительные стили, прямо туда копируйте. В поле плагина не оставляйте. Так они быстрее грузятся и без глюков.
Здравствуйте, а как добавить в список товаров такую кнопку и что работало как следует?
Добрый день. Вам лучше обратится к разработчику. Чтобы работало как следует, это как?
Уважаемый админ вы сами та пробовали этот скрипт ???
Там фатальная ошибка, зачем нерабочие варианты скидывать людям ?!
Здравствуйте. Да, конечно пробовал. Неужели по скриншотам не видно? Вот сайт где стоит такой же скрипт и всё работает – prezentgold.ru, сам лично устанавливал. Значит где-то вы ошибку допустили, либо ваш сайт несовместим с данным скриптом. На WordPress это обычное дело. Если у кого-то работает, не факт что у всех будет работать.
Спасибо за статью! А что делать если у меня несколько товаров на странице?
Здравствуйте. Вы хотите, чтобы кнопка отображалась в каталоге товаров?
Да, мне тоже интересно, как сделать, чтобы кнопка отображалась в каталоге товаров )
Супер спасибо! Подскажите как вывести такую же кнопку в товар которые без цен? Сейчас она отображается только где есть цена! Очень нужно
Товары в наличии, у которых цен нет? В настройках должно быть отмечено что они в наличии.
В настройка отмечено что они в наличии. У меня сайт полиграфии. Ваш пример хочу использовать под заказать просчёт. На сайте не на всех товарах есть цена. Вот под теми что без цены, к сожалению нет этой кнопки.
Значит этот код не подходит для товаров без цен. Нужно доработку делать.
Здравствуйте! У меня немного сложная задача — имеются разные категории товаров, в которых цена товаров по запросу, и нужно, чтобы для товаров из разных категорий при нажатии на ссылку «цена по запросу» всплывала своя контактная форма в зависимости от категории товара (отправка запроса на разные адреса), проще говоря, своя контактная форма на товар из конкретной категории. Если можно, пришлите код на почту. Спасибо!
Добрый вечер. Могу вам только плагины порекомендовать, которые могут вам помочь:
– Art WooCommerce Order One Click
– Back In Stock Notifier for WooCommerce
– WooCommerce Quote or Enquiry Contact Form 7
– YITH WooCommerce Request A Quote
Здравствуйте! Спасибо большое за статью.
Я использую Elementor Pro. При помощи его можно создавать шаблоны для страниц. Т.е. кнопку я смогу поставит в любом месте в карточке товара и к ней подвязать форму.
Подскажите, пожалуйста, смогу я реализовать Вашу схему?
Очень нужно как раз простой заказ, а не корзина.
Добрый вечер. Чтобы изменить местоположение кнопки, нужно обратиться к разработчику. Этот код не я писал.
Я не программист, но хочется, чтобы на странице была не просто форма заказа, а относящаяся к конкретному товару.
Я так понимаю, что тут важен не столько код Elementora, а что прописать в данной форме Contact Form 7
Если есть какие нибудь мысли, то заранее благодарю.
Вот этот плагин вам поможет – Art WooCommerce Order One Click
Спасибо!
Здравствуйте,Антон! Все работает прекрасно, но после отправки окно формы так и остается висеть, как сделать чтобы оно автоматически закрывалось после успешной отправки?
Добрый день. Посмотрите вот этот плагин Woocommerce кнопка купить в один клик. Он может помочь вам.
Спасибо! пробывал этот плагин, но в нем существенный минус нет текстового поля чтобы заказчик вписал туда дополнительные пожелания к заказу, а это очень необходимо.
Такое поле можно очень легко добавить в редакторе формы Contact Form 7. Да, форма будет висеть, потому что у плагина нет функции авто-закрывания окна.
Ладно это пол беды, Еще один вопрос а почему форма 7 не работает в окне быстрого просмотра или можно как-то ее оттуда убрать??
Почему форма 7 должна работать в окне быстрого просмотра и где вы её там нашли? Про окно быстрого просмотра я вообще ничего не говорил в данной записи.
В окне быстрого просмотра отображается кнопка купить в один клик, но она не кликабельна!
Можно скрыть её с помощью CSS.
Если кому будет интересно то решение вопроса с авто-закрытием окна есть в плагине Popup Maker