TechBlogSD - Все для WordPress и WEB разработки
WEB и WordPress инструкции, новости, обзоры тем и плагинов

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

7

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

По теме: Как добавить и настроить контактную форму на сайте Weebly?

Зачем иметь страницу контактов в WordPress?

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

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

Разница между контактной формой и электронной почтой

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

  • Открытие вашего адреса электронной почты создаст проблемы с конфиденциальностью. Вы получите сотни спама, так как любой может отправить сообщение, нажав на ваш адрес электронной почты.
  • Напротив, в контактных формах ваш адрес электронной почты не будет отображаться читателям. WordPress обработает сообщение и отправит его вам, даже если пользователи не узнают ваш адрес электронной почты. Таким образом вы будете получать сообщения только от заинтересованных пользователей и избежать спама и оскорбительных личных сообщений.
  • Плагин без проблем работает с Akismet, чтобы предотвратить отправку спама, или вы можете добавить reCAPTCHA, чтобы гарантировать, что только пользователи-люди могут отправлять форму, а не автоматические роботы. Кроме того, Contact Form 7 также использует параметр черного списка комментариев WordPress по умолчанию для блокировки сообщений.
  • Вы можете использовать несколько контактных форм на одном сайте WordPress и добавлять параметры для отслеживания эффективности каждой формы. Например, вы можете отслеживать форму на странице контактов и страницу о странице отдельно.
  • Плагин не сохраняет сообщения в базе данных, таким образом сохраняя вашу конфиденциальность.

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

Хорошая часть состоит в том, что у вас есть много плагинов для контактной формы, доступных бесплатно в разделе репозитория плагинов WordPress. Contact Form 7 – один из самых популярных из всех свободно доступных плагинов.

  • Плагин очень прост в использовании, у него более 5 миллионов активных установок.
  • Это полноценный бесплатный плагин без назойливой рекламы или дополнительных продаж премиум-версии.
  • Активно развивается и поддерживается.
  • Многие популярные темы WordPress интегрируют плагин Contact Form 7 и предлагают настраиваемые формы.
  • Вы можете вставить форму в любом месте вашего сайта, используя блок Гутенберга.

Установка плагина Contact Form 7

Поскольку Contact Form 7 – это бесплатный плагин, вы можете установить его прямо из панели администратора WordPress. После входа в административную панель вашего сайта перейдите в раздел «Плагины> Добавить новый». Вы можете найти и установить плагин Contact Form 7 оттуда.

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

Установить плагин Contact Form 7

Создание вашей первой контактной формы

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

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

Контактная форма 7 Меню

  • Вы можете просмотреть все свои формы в разделе «Контактные формы».
  • Перейдите в «Добавить», чтобы создать новую форму.
  • Раздел интеграции позволяет вам связываться с внешними API из Constant Contact, reCAPTCHA и Sendinblue.

Настройка плагина Contact Form 7

Чтобы упростить вашу задачу, Contact Form 7 добавит готовый образец формы на ваш сайт. Вы можете отредактировать образец формы, перейдя в раздел «Контактные формы» и повторно использовать, или создать новую с нуля.

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

Просмотр созданных форм

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

Раздел формы

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

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

Добавить новую контактную форму

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

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

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

Заполните детали для тега

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

<label> Your name [text your-name] </label> <label> Your email [email your-email] </label> <label> Subject [text your-subject] </label> <label> Your message (optional) [textarea your-message] </label> [file file-915 limit:1mb filetypes:.docx] [submit "Submit"]

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

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

Контактная форма сохранена

Почтовый раздел

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

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

Контактная форма 7 Настройки почты

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

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

Тело сообщения и прикрепленный файл

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

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

Контактная форма 7 Автоответчик

Сохраните изменения после завершения настройки почтовых шаблонов.

Раздел сообщений

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

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

Настройки сообщений

Дополнительные настройки

Вы можете оставить раздел дополнительных настроек как есть. Однако просмотрите параметры, доступные в документации, чтобы проверить, полезны ли какие-либо поля. Например, вы можете добавить subscribers_only: true в текстовое поле, чтобы разрешить отправку формы только зарегистрированным пользователям.

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

Дополнительные настройки

Добавление формы на страницу контактов

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

Теперь, когда у вас есть шорткод вашей контактной формы, следующий шаг – встроить его на свою страницу. Перейдите в раздел «Страницы> Все страницы» и создайте / отредактируйте страницу контактов. Введите / контакт, чтобы отфильтровать блок Contact Form 7 Gutenberg и вставить его в область содержимого.

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

Контактная форма 7 Блок Гутенберга

Щелкните раскрывающийся список «Выберите контактную форму» и выберите имя формы для встраивания.

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

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

Если вы используете старый классический редактор, просто вставьте шорткод контактной формы в редактор.

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

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

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

По теме: Как встроить Google Forms в WordPress?

Проверка вашей контактной формы

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

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

Опубликованная контактная форма

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

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

Проверка формы в браузере

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

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

Сообщение успешно отправлено

Заключение

В общей сложности вам может потребоваться менее 30 минут, чтобы создать и добавить контактную форму на свой сайт WordPress с помощью плагина Contact Form 7. Он работает без проблем, не конфликтуя с другими плагинами. Несомненно, Contact Form 7 является частью многих бизнес-сайтов WordPress, и вы также можете попробовать ее, чтобы улучшить свой бизнес.

Источник записи: webnots.com
Leave A Reply

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