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

В этой статье мы расскажем, как можно создавать AMP-формы на WordPress с использованием плагина WPForms.

Содержание

Создание AMP-форм на WordPress (пошаговое руководство)

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

Для изменения настроек AMP, перейдите в меню «AMP» — «Общие настройки», которое появится в панели администрирования WordPress.

Здесь можно включить или отключить AMP, выбрать режим работы сайта для AMP, а также поддерживаемые шаблоны.

Шаг 1. Создайте форму WordPress с помощью плагина WPForms

Для начала установите и активируйте  плагин WPForms Lite. После этого перейти в меню «WPForms»-«Добавить новую», чтобы создать новую форму WordPress.

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

Далее откроется страница конструктора форм.

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

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

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

На вкладке «Уведомления» активируется уведомление на email о заполнении формы пользователем.

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

Шаг 2. Добавьте AMP-форму на страницу

В редакторе страницы нажмите кнопку «Добавить новый блок» и выберите блок WPForms.

После этого вы увидите виджет WPForms. Выберите в нем форму, которую создали ранее, и виджет загрузит ее в редактор страниц.

Далее опубликуйте или обновите отредактированную страницу. Затем плагин WPForms Lite автоматически добавит полноценную поддержку AMP. В этом можно убедиться, просмотрев страницу на смартфоне.

Также можно открыть страницу в браузере на ПК, добавив /amp/ или /?amp в конце URL-адреса веб-страницы. Например: https://www.example.com/contact/?amp.

Добавление Google reCAPTCHA в AMP-форму

По умолчанию плагин WPForms включает в себя инструмент для перехвата и блокировки спама. Также можно использовать Google reCAPTCHA, чтобы уменьшить количество спам-сообщений. Для этого зарегистрируйте свой сайт в Google reCAPTCHA v3 и получите ключи Google API.

Перейдите на сайт Google reCAPTCHA и нажмите кнопку «Admin Console», расположенную в правом верхнем углу страницы.

После этого войдите в свою учетную запись Google. Затем вы попадете на страницу «Register a new site».

Введите название сайта в поле «Label». Google AMP поддерживает только reCAPTCHA v3, поэтому нужно эту версию. После этого введите доменное имя в разделе «Domains».

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

Затем примите условия использования reCAPTCHA и установите флажок «Send alerts to owners». Это позволит Google уведомлять вас о таких проблемах, как неправильная настройка и подозрительный трафик, обнаруженный на сайте.

Нажмите кнопку «Submit». Далее вы увидите сообщение об успешной регистрации вместе с ключом сайта и секретным ключом, необходимым для добавления reCAPTCHA на сайт.

Но для обеспечения совместимости AMP с reCAPTCHA требуется еще одна настройка. Перейдите по ссылке «Go to Settings». Активируйте параметр «Allow this key to work with AMP pages» и нажмите кнопку «Save».

Затем в панели администрирования WordPress откройте страницу «WPForms» — «Настройки» -«reCAPTCHA».

Выберите параметр reCAPTCHA v3 и вставьте ключ сайта и секретный ключ. После этого нажмите кнопку «Сохранить настройки».

Теперь, когда Google reCAPTCHA добавлен в WPForms, можно включить его в формах. Перейдите в меню «WPForms» — «Все формы» и выберите формы, в которых будет использоваться reCAPTCHA.

Перейдите на вкладку «Настройки» и выберите раздел «Общие настройки». Внизу расположен параметр «Включить Google v3 reCAPTCHA».

Активируйте его, а затем сохраните форму. После этого можете протестировать  AMP-форму с reCAPTCHA в действии.

Данная публикация представляет собой перевод статьи «How to Create AMP Forms in WordPress (The Easy Way)» , подготовленной дружной командой проекта Интернет-технологии.ру

Меню