Как добавить квадратные платежи в WordPress? (Простой и надежный метод)

Опубликовано: 2022-04-08

Хотите узнать, как принимать платежи Square на своем сайте WordPress?

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

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

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

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

Самый простой способ добавить Square Payment в WordPress

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

Если вы используете WooCommerce, вам нужно использовать плагин Square for WooCommerce.

Однако в этом руководстве мы выбрали WPForms, потому что это работает для всех типов сайтов WordPress.

wpforms

WPForms — это конструктор форм перетаскивания № 1, который позволяет создавать любые типы форм WordPress, такие как контактные формы, регистрационные формы, формы заказов, формы пожертвований и многое другое.

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

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

Кроме того, конструктор форм WPForms прост в использовании и очень интуитивно понятен, поэтому вы можете настроить свои формы так, как хотите.

Основные моменты:

  • Шаблоны форм для мобильных устройств
  • Удобный для начинающих интерфейс
  • Настраиваемые уведомления по электронной почте и подтверждающие сообщения
  • Поля формы электронной коммерции
  • Варианты настройки валюты
  • Условная логика и разговорные формы
  • Встроенная защита от спама
  • Интеграция с сервисами электронного маркетинга
  • Панель управления записями форм
  • И многое другое

С WPForms можно сделать так много. Он дает вам доступ ко многим расширенным функциям и инструментам, поэтому вы можете добавить больше функций на свой веб-сайт WordPress.

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

С учетом сказанного давайте узнаем, как легко добавить платеж Square в WordPress.

Шаг 1: Установите и активируйте плагин WPForms

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

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

После регистрации вы можете получить доступ к панели инструментов учетной записи WPForms. Здесь откройте вкладку « Загрузки », чтобы найти файл загрузки и лицензионный ключ.

WPForms license key

Вам необходимо скачать файл плагина и установить его на свой сайт WordPress. Если вам нужна помощь в установке плагина, ознакомьтесь с этим руководством по установке плагина WordPress.

После того, как вы установите и активируете WPForms, перейдите на вкладку WPForms »Настройки на панели инструментов WordPress. Введите здесь свой лицензионный ключ, чтобы активировать профессиональные функции.

WPForms license page

Затем нажмите кнопку « Подтвердить ключ », и вы увидите сообщение об успешной проверке.

Теперь вам нужно настроить надстройку Square на своем сайте WordPress.

Шаг 2: Установите и активируйте аддон Square

Чтобы подключиться к Square, вам необходимо установить надстройку WPForms Square. И вы можете сделать это, перейдя на страницу WPForms »Addons из панели администратора.

Если вы прокрутите эту страницу, вы найдете надстройку Square. Все, что вам нужно сделать, это нажать на кнопку « Установить дополнение ».

install square addon

После установки и активации дополнения перейдите на страницу WPForms »Настройки и откройте вкладку « Платежи ».

На этой странице вы увидите настройки для выбора валюты и подключения вашей учетной записи Square.

square payments settings

Кроме того, WPForms позволяет включить тестовый режим для проверки ваших транзакций Square. Таким образом, вы можете убедиться, что никакие живые транзакции не проходят случайно, пока вы подключаете свою учетную запись Square sandbox, и проверяете, работает ли ваше соединение правильно или нет.

connect stripe settings

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

Теперь вы готовы создать форму с опцией оплаты Square.

Шаг 3: Создайте платежную форму Square

Если у вас нет существующей формы, вы можете создать новую, просто щелкнув вкладку WPForms »Добавить новую на панели администратора. Это запустит библиотеку шаблонов форм.

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

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

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

choose square form wordpress templete

В следующем окне вы увидите конструктор форм WPForms. Все поля формы и параметры настройки находятся в левой панели меню, а предварительный просмотр формы — в правой части конструктора.

Чтобы вставить новое поле формы, просто перетащите его из левого меню и поместите в область предварительного просмотра формы.

wpforms drag and drop form builder

Поскольку шаблоны форм WPForms разработаны так, чтобы быть готовыми к использованию, вам не нужно вносить серьезные изменения.

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

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

Чтобы отображать цены на продукты в передней части формы, включите параметр « Показывать цену после меток товаров ».

edit field options

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

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

WPForm рекомендует использовать изображения размером 250 x 250 пикселей или меньше для лучшего качества изображения.

add images

После того, как вы настроите свой каталог продуктов, нажмите кнопку « Сохранить » в верхней части конструктора форм.

Затем вам нужно добавить поле Square в форму и настроить детали платежа.

Шаг 4. Настройте квадратные платежи

В левом меню вы можете найти поле « Квадрат » из раздела « Поля оплаты ». Перетащите поле в поле предварительного просмотра формы.

square payment field

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

edit square field options

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

Затем перейдите на вкладку « Платежи » на левой панели меню, и вы увидите различные варианты оплаты в зависимости от установленного вами дополнения.

Здесь нажмите Square и отметьте там опцию Enable Square Payments .

enable square payments

Теперь вы можете настроить параметры платежей Square. Вы увидите варианты для:

  • Описание платежа: введите описание платежа. Это будет отображаться в выписке по кредитной карте или банковской карте ваших клиентов.
  • Электронная почта покупателя: в раскрывающемся меню выберите параметр « Электронная почта », чтобы отправить квитанцию ​​об оплате на адрес электронной почты, указанный покупателем в форме заказа.
  • Имя для выставления счета: в раскрывающемся меню выберите параметр « Имя », чтобы указать имя клиента для платежа.
  • Платежный адрес: выберите параметр « Адрес », и WPForms автоматически заполнит платежный адрес клиента на основе его ввода в форму.
map payment details form

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

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

Шаг 5. Настройте уведомления и подтверждения

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

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

Эти настройки помогут вам оптимизировать рабочий процесс и автоматизировать последующие задачи.

Для уведомлений по электронной почте откройте вкладку « Настройки» »Уведомление на левой панели меню внутри конструктора форм.

По умолчанию уведомление администратора уже настроено. Это отправляется на адрес электронной почты администратора WordPress. Вы можете изменить это и добавить больше адресов электронной почты членов вашей команды.

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

notifications

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

Затем вы можете добавить адрес электронной почты клиента в поле Адрес электронной почты для отправки . Для этого щелкните параметр « Показать смарт-теги », а затем выберите параметр « Электронная почта ».

user notification

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

В поле тела сообщения электронной почты вы можете ввести свой контент вместе с деталями заказа, используя смарт-тег {all_fields}. Этот тег будет автоматически заполнять детали заказа из формы WordPress, отправленной пользователем.

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

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

user notification message

Теперь вам нужно добавить подтверждающее сообщение для платежной формы Square. Перейдите на вкладку Настройки » Уведомление , чтобы увидеть настройки подтверждения.

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

  • Показать пользовательское сообщение
  • Перенаправление на другую страницу вашего сайта
  • Перенаправление на внешний веб-сайт или страницу

Если вы хотите, чтобы после успешной оплаты отображалось индивидуальное подтверждающее сообщение, выберите параметр « Сообщение ». Затем введите текст в редактор.

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

После того, как вы закончите настройку уведомлений и подтверждений, нажмите кнопку « Сохранить ».

Шаг 6: Опубликуйте квадратную форму в WordPress

С WPForms вы можете добавить платежную форму Square на любую страницу WordPress, публикацию или область, удобную для виджетов. Он поддерживает готовые блоки и виджеты для WordPress, поэтому вам не нужно вручную вставлять фрагменты кода или даже шорткоды.

Если вы используете редактор блоков WordPress, найдите блок WPForms , чтобы добавить его на любую страницу или запись.

wpforms block

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

select form wpforms

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

Чтобы отобразить форму на вашем сайте, нажмите кнопку « Опубликовать » на своей странице или в редакторе сообщений.

publish form

Если вы используете классический редактор WordPress, вы можете легко добавить свою форму с помощью кнопки «Добавить форму » в редакторе сообщений.

После того, как вы нажмете на кнопку, просто выберите форму, которую вы хотите вставить, и опубликуйте свою страницу.

add-form-classic-editor

Кроме того, вы можете добавить платежную форму Square в любую область виджетов, например, в нижний колонтитул или боковую панель. Перейдите на вкладку Внешний вид »Виджеты и перетащите виджет WPForms в боковую панель или меню нижнего колонтитула справа.

Затем вы можете выбрать форму с помощью раскрывающегося меню и сохранить настройки.

add wpforms to sidebar

Поздравляю! Вы узнали, как без особых усилий добавить оплату Square в WordPress. Теперь ваши клиенты могут легко совершать платежи на вашем сайте.

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

С WPForms вы можете создавать профессионально выглядящие формы WordPress, такие как

  • Анкеты
  • Формы бронирования
  • Запрос котировок формы
  • Формы запросов
  • Формы регистрации на мероприятие
  • Опросы и опросы
  • Регистрационные формы
  • Формы заказа продукции
  • И более

Вы даже можете подключить свои формы к популярным службам почтового маркетинга, таким как Constant Contact, AWeber и Drip.

Более того, WPForms совместим с плагинами для создания страниц, такими как SeedProd и Elementor. Вы можете использовать SeedProd для настройки дизайна и стиля ваших форм WordPress. Это позволяет вам изменить фон, шрифты и цвет, чтобы они соответствовали остальной части вашего сайта.

Следует помнить, что прием карточных платежей с помощью приложения Square в настоящее время доступен в США, Канаде, Австралии, Японии, Великобритании, Ирландии, Франции и Испании.

Если вы хотите принимать карточные платежи в других странах, попробуйте Stripe Payment Gateway. Stripe позволяет принимать платежи с помощью кредитной и дебетовой карты, банковского перевода, Apple Pay, Google Pay и цифровых кошельков.

Ознакомьтесь с нашим руководством о том, как принимать платежи Stripe в WordPress.

Это все на сегодня! Мы надеемся, что эта статья помогла вам быстро добавить платежи Square в WordPress.

Теперь, когда вы принимаете платежи в Интернете, убедитесь, что ваш веб-сайт соответствует требованиям PCI. Вам потребуется установить действующий сертификат SSL. Большинство шлюзов обработки платежей делают это обязательным для защиты данных клиентов.

Для дальнейших действий вы можете проверить эти ресурсы:

  • Лучшие плагины WordPress для приема онлайн-платежей по кредитным картам
  • Лучшие платформы для продажи загружаемых материалов и цифровых продуктов
  • Как добавить пользовательскую форму бронирования на ваш сайт WordPress

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