Как создавать AMP-формы в WordPress

Чтобы веб-сайты загружались быстрее на мобильных устройствах, Google разработал проект под названием Accelerated Mobile Pages или AMP. И хотя он предлагает отличный мобильный просмотр, ускоряя загрузку веб-страниц, он также отключает многие полезные функции на вашем веб-сайте. Одной из тех особенностей, которую можно считать большой потерей, являются контактные формы. Поскольку AMP использует ограниченный набор HTML и JavaScript, он не может правильно загружать ваши формы WordPress на страницах AMP. К счастью, есть простое решение. WPForms — довольно удобный для начинающих плагин форм WordPress, который помогает создавать формы WordPress, готовые к AMP. Итак, в следующей статье мы очень подробно объясним, как создавать формы AMP в WordPress с помощью WPForms .

Узнайте, как создавать AMP-формы в WordPress.

Таким образом, AMP весьма полезен для того, чтобы сделать ваш сайт удобным для мобильных устройств. А установка и активация официального плагина AMP для WordPress является необходимым условием для использования AMP с WordPress. После активации плагин автоматически добавит поддержку Google AMP для вашего сайта WordPress . Однако вы можете изменить настройки AMP для своего веб-сайта, выбрав AMP > Общие на панели инструментов. Когда вы находитесь на странице настроек AMP, вы можете включить или отключить AMP на своем веб-сайте, а также выбрать режим веб-сайта для AMP и выбрать поддерживаемые шаблоны. После настройки AMP вам нужно будет создать контактную форму, совместимую с AMP, на вашем сайте WordPress.

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

Чтобы начать процесс, вам необходимо установить и активировать плагин WPForms Lite на вашем сайте. Это облегченная версия плагина WPForms Pro. Как профессиональная, так и облегченная версии WPForms позволяют вам создать базовую контактную форму, готовую к AMP. Здесь мы поговорим о бесплатной версии. После того, как вы установили и активировали плагин, вам нужно будет перейти на страницу WPForms > Добавить новую, чтобы создать новую форму WordPress. На экране настройки формы вы сможете выбрать шаблон формы, чтобы быстро приступить к работе.

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

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

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

Когда ваша форма WordPress готова, вы можете добавить ее на страницу. Сначала вам нужно будет создать новую страницу или открыть существующую, на которую вы хотите добавить форму. Откройте экран редактирования страницы, щелкните значок «Добавить новый блок» и перейдите к выбору блока WPForms. После этого вы сможете увидеть виджет WPForms, добавленный на экран редактирования вашей страницы. Вам достаточно выбрать форму, которую вы создали ранее, и виджет тут же загрузит ее в редакторе страниц. Вы также можете опубликовать или обновить свою страницу. И это все к этому. Больше ничего настраивать не нужно. Плагин WPForms Lite теперь добавит в вашу форму полную поддержку AMP. Если вам интересно, как это выглядит, вы можете открыть страницу на своем мобильном телефоне.

Как добавить Google reCAPTCHA в форму AMP

WPForms включает в себя приманку для защиты от спама, которая по умолчанию ловит и блокирует спам. Кроме того, вы можете использовать Google reCAPTCHA для уменьшения спама. Чтобы использовать Google reCAPTCHA с вашими формами AMP, вам необходимо зарегистрировать свой сайт для Google reCAPTCHA v3 и получить ключи Google API. Для этого перейдите на веб-сайт Google reCAPTCHA и нажмите кнопку «Консоль администратора» в правом верхнем углу страницы. Затем вам нужно будет войти в свою учетную запись Google. После этого вы увидите страницу «Зарегистрировать новый сайт». Начните его заполнять, введя название вашего сайта в поле Метка. Google AMP поддерживает только reCAPTCHA v3, поэтому вам придется выбрать его из вариантов типа reCAPTCHA.

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

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

Однако есть еще одна настройка, о которой вам нужно позаботиться. Это обеспечит совместимость AMP с reCAPTCHA. Чтобы получить к нему доступ, нажмите там ссылку «Перейти к настройкам». Это снова приведет вас к настройкам reCAPTCHA с флажком «Разрешить этому ключу работать со страницами AMP». Просто установите флажок и нажмите кнопку Сохранить ниже.

Теперь, когда у вас есть ключи Google API для добавления reCAPTCHA в формы AMP, перейдите на страницу WPForms > Настройки > reCAPTCHA на панели управления WordPress. Затем выберите опцию reCAPTCHA v3 и вставьте ключ сайта и секретный ключ. Нажмите на кнопку Сохранить настройки. Теперь, когда Google reCAPTCHA добавлен в WPForms, вы можете включить его в своих формах, где это необходимо. Перейдите в WPForms > Все формы и выберите форму, в которой вы хотите включить reCAPTCHA. Когда появится экран настройки формы, нажмите на вкладку «Настройки» и выберите раздел «Общие настройки». Вы увидите флажок «Включить Google v3 reCAPTCHA». Установите этот флажок и сохраните форму. После этого вернитесь на свою страницу контактов и посмотрите на форму AMP с reCAPTCHA в действии.

Не так уж и много

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