Сегодня мы поговорим о том, как создавать на своём WordPress сайте такой распространённый элемент, как форма обратной связи (или любая другая форма, например, форма заказа обратного звонка).
Сразу стоит отметить, что, к сожалению, в WordPress нет встроенных инструментов, позволяющих создать форму обратной связи. Для этой задачи используются различные плагины. В официальном репозитории WordPress подобных плагинов содержится огромное множество. Самый популярный из них — плагин Contact Form 7.
Это гибкий инструмент, который позволит вам создать практически любую форму. Стоит также отметить, что плагин настолько популярен, что в официальном репозитории WordPress вы можете найти множество плагинов, разработанных специально для того, чтобы дополнить какие-либо функции Contact Form 7.
Так вот, для создания формы обратной связи в WordPress вам, прежде всего, необходимо установить и активировать плагин Contact Form 7. Напоминаю, что сделать это можно в административной панели вашего WordPress сайта в разделе «Плагины» -> «Добавить новый».
После установки и активации Contact Form 7, всё, что вам осталось сделать — создать и настроить вашу форму. Для этого вам необходимо перейти в новый раздел админ-панели WordPress, который появился у вас после активации плагина, называется он «Contact Form 7».
При переходе в этот раздел вы обнаружите список созданных форм. При помощи специальных кнопок под названиями форм вы можете их изменять, удалить и копировать. Эта функциональность позволяет создавать на вашем сайте не одну, а целое множество форм.
Итак, чтобы создать новую форму обратной связи в WordPress — нажмите «Добавить новую» в данном разделе меню (Contact Form 7). Перед вами появится заготовка формы, которую вам нужно будет вначале озаглавить (самая верхняя строчка), чтобы не путать, для чего нужно эта форма, а затем — изменить саму форму.
Делается это довольно просто. Любая форма — это набор каких-либо полей и кнопка отправки данных — Submit. Поэтому всё, что вам нужно сделать, это добавить и расположить в окне редактирования формы все нужные роля и увенчать всё это кнопкой submit. Вы увидите, что в изначальной заготовке там и сделано, она должна послужить вам примером.
Добавлять новые поля в форму можно при помощи специальных кнопок, расположенных над полем редактирования формы. Вам доступны такие роля, как: текстовое поле, поле ввода телефона, поле выбора вариантов и многие другие. Для вставки нужного поля, прежде всего, выберите в поле редактирования формы нужное место, куда вы хотите вставить новое поле, а затем нажмите на кнопку соответствующего (нужного вам) формата поля, например, «текстовое поле». После этого для вас откроется специальное окошко при помощи которого вы сможете задать определённые параметры этому конкретному полю, например, сделать его обязательным при заполнении, либо вставить какой-нибудь первоначальный шаблон-заполнитель (placeholder).
После установки параметров поля и его появления в окне редактирования формы проделайте те же манипуляции со всеми остальными полями, которые вы хотели бы видеть, а в заключении в самом низу формы (так принято) добавьте кнопку отправки (submit) и, если это необходимо, измените текст этой кнопки. Всё, основа формы готова, но это ещё не все!
Теперь необходимо сделать так, чтобы данные из этих форм присылались к вам на почту. Для этого необходимо переключиться с со вкладки редактирования формы на вторую вкладку, которая отвечает за редактирование того, как будет выглядеть письмо, которое вы получите, когда посетитель сайта заполнит вашу форму.
На этой вкладке вам необходимо разместить в нужных полях и местах данные, собранные при помощи данной формы. Чтобы сделать это максимально быстро и удобно, сначала нажмите синею кнопку «Опубликовать» справа. После этого, в данной вкладке над полями появится список с названиями форм, которые вы создали на предыдущем шаге. Вам необходимо скопировать эти формы (прямо с квадратными скобками) и вставить их в нужные места в письме или теме письма. И, конечно же, не забудьте указать в качестве получателя письма свой EMail. В завершении сохраните изменения при помощи синей кнопки справа.
Готово. Теперь необходимо добавить данную форму в нужное место на вашем WordPress сайте, например, на страницу «Контакты». Для этого, прежде всего, скопируйте так называемый «шорткод» вашей формы, он будет указан прямо под названием вашей формы (скопировать нужно прямо с квадратными скобками).
Теперь перейдите в административной панели сайта WordPress на нужную страницу в разделе «Страницы», в нашем примере — в страницу «Контакты». В появившееся окно редактирования содержимого вставьте скопированный шорткод в нужное место, например, в самый конец и нажмите синею кнопку «Обновить» справа.
Готово, вы создали свою собственную форму и добавили ее в нужное вам место на своём сайте!
Если вам понравилась моя статья - подписывайтесь на мой канал или закажите у меня разработку своего WordPress сайта.