Как создать контактную форму в WordPress

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

Ako si vytvoriť kontaktný formulár vo WordPress

Для чего нужна контактная форма?

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

Форма обратной связи также экономит ваше время. И он даст вам всю необходимую информацию:

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

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

Как добавить контактную форму в WordPress

WordPress предлагает возможность создать контактную форму с помощью плагина. Лично я рекомендую использовать плагин Contact Form by WPForms .

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

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

Вы устанавливаете плагин прямо из администрации сайта. После установки не забудьте активировать плагин. Точную процедуру вы узнаете в моей статье Что такое плагин WordPress? Как установить?

В администрации страницы вы увидите новый пункт WPForms после активации плагина.

Создание формы с помощью WPForms

Чтобы создать новую контактную форму, перейдите к функции WPForms.> Добавить новый . Вы увидите следующую страницу:

WPForms добавить новый
Добавить контактную форму

Сначала введите имя контактной формы. Затем выберите шаблон, который хотите использовать. Базовая версия WPForms предлагает четыре шаблона для создания форм.

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

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

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

Форма предложения — вы будете использовать ее, если хотите спросить у посетителей сайта мнения или предложения.

💡 Tip: Choosing the right hosting is crucial for a fast website ⏱ . I recommend betting on verified quality ➡️ Bluehost, SiteGround or GoDaddy.

Как создать простую форму

Мы продолжим описание того, как создать форму с помощью шаблона Simple Contact Form .

Простая контактная форма
Создать простую форму

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

Чтобы добавить новое поле, перейдите в меню в левой части экрана. Нажмите или перетащите выбранное поле вправо.

Не забудьте нажать Сохранить , чтобы сохранить контактную форму. Вы найдете кнопку в верхней части экрана.

Установить свойства формы

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

Общие настройки WPForms
Общие настройки формы

Кроме того, здесь вы найдете несколько других параметров настройки:

  • Имя формы — здесь вы редактируете имя контактной формы.
  • Описание формы — используется для описания формы.
  • Класс CSS формы — позволяет вставить собственный класс для формы.
  • Submit Button Text — здесь вы редактируете текст кнопки
  • Submit Button Processing Text — введите текст, который будет отображаться после отправки формы.
  • Класс CSS кнопки отправки — это поле используется для добавления пользовательского класса для кнопки отправки.
  • Включить приманку для защиты от спама — я рекомендую оставить окно в этой строке отмеченным. Эта функция используется для защиты от спама при отправке форм.

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

Настройки уведомлений по электронной почте

На вкладке « Настройки »> Уведомления для дополнительных параметров настройки. И это настройки уведомлений по электронной почте. Обычно они отправляются на адрес электронной почты веб-мастера. Пожалуйста, отредактируйте тему электронного письма для ясности входящих сообщений. Вы можете редактировать другие поля, если хотите.

Уведомления о настройках WPForms
Настройки уведомлений
  • Уведомления — здесь вы включаете или отключаете функцию отправки формы на ваш e-mail. Я рекомендую оставить эту функцию включенной. Индивидуальные заполненные формы нигде не хранятся. Для информирования вас о них используется уведомление по электронной почте.
  • Отправить на адрес электронной почты — введите адрес электронной почты, на который должна быть отправлена форма.
  • Тема письма — вы также можете указать тему письма.
  • From Name — имя отправителя электронного письма. Здесь вы найдете предустановленное имя вашего сайта.
  • From Email — адрес электронной почты отправителя.
  • Reply-To — адрес электронной почты для ответа.
  • Сообщение — тело электронного письма. Если оставить настройку{all_fields} письмо будет содержать все поля формы.
💡 Tip for themes: From premium themes, I have good experience with themes Divi, Avada and with page builder Elementor.

Настройки подтверждения отправки формы

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

Подтверждения настроек WPForms
Отправить настройки подтверждения

Сначала выберите тип подтверждения. В поле « Тип подтверждения» можно выбрать один из трех вариантов:

  • Сообщение — отображает текст, который вы вводите в окне ниже.
  • Показать страницу — установить перенаправление на выбранную веб-страницу.
  • Go To URL — введите URL страницы, на которую должен быть перенаправлен посетитель сайта после отправки формы.

Редактировать, удалять и дублировать форму

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

Последней из функций является количество показов. Эта функция доступна только в версии Pro . Благодаря ему заполненные формы сохраняются непосредственно в администрации сайта.

💡 Do you want a faster ⏱ website? Website speed is important for both visitors and SEO. I got the best results thanks to the WP Rocket plugin, which I highly recommend.

Как добавить контактную форму на страницу WordPress

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

Для добавления используется шорткод контактной формы. Вы можете найти это:

  1. на странице формы редактирования под кнопкой Embedembed в правом верхнем углу,
  2. на странице списка всех форм в столбце шорткода.

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

WPForms Вставить шорткод
Вставьте короткий код

Вот как будет выглядеть страница после вставки шорткода.

Вставить контактную форму
Вставка контактной формы на страницу

Как добавить контактную форму на боковую панель

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

Виджеты WPForms
Виджет WPForms

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

Вставить контактную форму на боковую панель
Добавьте контактную форму на боковую панель

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

Редактировать боковую панель
Регулировка боковой панели с предварительным просмотром

WPForms Премиум против WPForms Lite

Платная версия WPForms Premium может делать следующие полезные вещи, например, в отличие от бесплатной (облегченной) версии:

  • Возможность создавать неограниченное количество форм.
  • Больше шаблонов форм.
  • Возможность использовать условную логику для управления видимостью полей формы.
  • Возможность создания многостраничных форм .
  • Возможность создания форм для регистрации пользователей .
  • Расширенная защита от спама.
  • Возможность загружать и получать файлы через форму.
  • Расширенные типы полей, такие как поля даты и времени.
  • Возможность сохранять, просматривать и управлять ответами из форм прямо в администрации WordPress .
  • Интеграция со сторонними сервисами , такими как: PayPal, Stripe, Mailchimp, AWeber, GetResponse, Constant Contact, Drip, Zapier…
Was this article helpful for you? Support me by sharing, please. 👍
WordPress Návod v PDF

ОСТАВЬТЕ ОТВЕТ

Пожалуйста, введите ваш комментарий!
пожалуйста, введите ваше имя здесь