Как создать контактную форму в WordPress (плюс лучшие плагины)

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

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

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

Самый простой способ создать контактную форму в WordPress

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

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

Вот как создать контактную форму в WordPress всего за несколько шагов…

1. Установите и активируйте плагин WordPress для контактной формы HappyForms.

Плагин HappyForms является бесплатным и доступен на WordPress.org, что означает, что вы можете установить его, выбрав Плагины → Добавить новый и выполнив поиск «HappyForms»:

2. Создайте новую форму.

После установки и активации плагина HappyForms перейдите в HappyForms → Добавить новый на панели инструментов WordPress:

Это запустит новый интерфейс, который очень похож на настройщик WordPress ( интерфейс, в котором вы настраиваете свою тему при предварительном просмотре в реальном времени ).

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

Но для начала просто дайте своей форме имя, которое поможет вам ее запомнить:

3. Добавьте поля формы

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

• Краткий текст - для имени человека.
• Электронная почта - для адреса электронной почты человека.
• Длинный текст - для сообщения человека.

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

После того, как вы добавили все поля формы, вы должны увидеть полный предварительный просмотр вашей контактной формы:

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

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

4. Настройте, что происходит после того, как посетитель отправит форму.

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

Вверху вы можете настроить подтверждающее сообщение , которое отображается для отправителя формы на вашем веб-сайте после того, как он отправит форму (1).

Ниже вы можете выбрать, хотите ли вы получать уведомления по электронной почте, когда появляется новая отправка формы, и на какой адрес электронной почты вы хотите получать заявки (2). HappyForms также будет хранить отправленные формы в вашей панели управления WordPress - подробнее об этом позже :

Затем вы можете выбрать, отправлять ли уведомления по электронной почте отправителю формы и, если да, то, что эти уведомления по электронной почте должны содержать:

Наконец, в нижней части настроек вы можете настроить множество различных настроек, в том числе:

• Перенаправлять пользователей на другую страницу после отправки формы
• Сохраните отправленные формы в личном кабинете WordPress
• Используйте Google ReCaptcha для защиты от спама
• Разрешить отправителям форм предварительно просмотреть свое сообщение перед отправкой

В случае сомнений оставьте эти настройки по умолчанию:

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

5. Настройте стиль своей контактной формы.

Финальный этап настройки! Теперь вы можете использовать различные области для настройки внешнего вида и стиля вашей контактной формы:

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

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

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

6. Добавьте свою контактную форму на страницу, где вы хотите, чтобы она отображалась.

Чтобы фактически встроить форму, вы можете добавить ее как:

• Блок в новом редакторе блоков
• Шорткод в классическом редакторе или редакторе блоков
• Виджет в любой области виджетов

Например, если вы используете новый редактор блоков WordPress, вы должны создать новую страницу с названием что-то вроде «Свяжитесь с нами» и вставить блок HappyForms .

Оттуда вы можете выбрать, какую форму вы хотите вставить:

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

И это все! Посетители смогут начать отправлять вам сообщения через вашу контактную форму.

Как просматривать отправленные формы

Есть два способа просмотреть отправленные формы.

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

Во-вторых, вы также можете просматривать отправленные материалы из своей панели управления WordPress, перейдя в HappyForms → Responses :

Если вы нажмете на конкретный ответ, вы сможете просмотреть полное сообщение:

Вот и все!

Четыре других лучших плагина WordPress для контактных форм и почему вам может понадобиться один из них

Для простой контактной формы WordPress HappyForms - лучший вариант для большинства пользователей. Однако это ни в коем случае не единственный качественный плагин WordPress для контактной формы. А если вам нужно нечто большее, чем просто форма обратной связи, вы можете предпочесть другой вариант.

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

1. WPForms

WPForms - один из самых популярных плагинов WordPress для контактных форм на WordPress.org.

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

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

• Принимать платежи
• Подпишите людей на свой адрес электронной почты
• Подключиться к Zapier
• И Т. Д.

Так что, если вам нужна эта расширенная функциональность, это может быть еще одной причиной выбрать WPForms.

Премиум-версии начинаются с 39,50 долларов и варьируются до 299,50 долларов, в зависимости от желаемых функций и количества сайтов, на которых вы хотите использовать плагин.

2. HubSpot All-In-One Marketing

Как следует из названия, HubSpot All-In-One Marketing является все-в-один инструмент , который охватывает все от всплывающих окон в чате и - вы угадали - контактные формы.

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

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

3. Формы ниндзя

Ninja Forms - еще одно бесплатное предложение с множеством тех же преимуществ, что и WPForms.

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

И если вы готовы платить, вы можете сделать свои формы более продвинутыми, в том числе:

• Прием платежей
• Подписка людей на вашу рассылку
• Помещение отправителей форм в вашу CRM
• И Т. Д.

Одно различие заключается в структуре цен на эти премиальные опции. Вместо отдельных премиум-версий Ninja Forms позволяет вам выбирать, какие премиум-надстройки вы хотите использовать. Или вы также можете получить набор надстроек по цене от 99 долларов.

4. Формы кальдеры

Что касается функциональности, которую вы получаете в бесплатной версии, Caldera Forms - один из самых щедрых бесплатных плагинов для контактных форм WordPress.

Даже в бесплатной версии вы можете создавать сложные формы, которые имеют:

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

Он также имеет конструктор перетаскивания, хотя интерфейс не так удобен для новичков, как WPForms или Ninja Forms.

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

В дополнение к этим надстройкам существует также услуга премиум-класса по подписке с уникальным акцентом на:

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

5. Гравитационные формы

Наконец, есть Gravity Forms, который является особенно популярным плагином WordPress для контактной формы для разработчиков.

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

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

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

Цены начинаются от 59 долларов и достигают 259 долларов.

Заключительные мысли о контактных формах WordPress

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

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

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