Хотите создать AMP-совместимые формы на своем сайте WordPress?
Ускоренные мобильные страницы, или AMP, – это проект Google, который ускоряет загрузку веб-сайтов на мобильных устройствах.
Хотя AMP предлагает отличные возможности мобильного просмотра, ускоряя загрузку страниц, он отключает многие полезные функции на вашем веб-сайте.
Одним из них является контактная форма. Поскольку AMP использует ограниченный набор HTML и JavaScript, вы не можете корректно загрузить свои формы WordPress на страницы AMP.
Но, к счастью, теперь есть простое решение. WPForms, самый удобный плагин WordPress для начинающих, теперь помогает создавать AMP-готовые формы WordPress. Его команда недавно работала с Google над созданием AMP форм для WordPress.
В этой статье мы покажем вам, как создавать формы AMP в WordPress с использованием WPForms (простой способ).
Создание форм AMP в WordPress (шаг за шагом)
Чтобы использовать AMP с WordPress, вы должны установить и активировать официальный плагин AMP для WordPress. Для получения более подробной информации, смотрите наше пошаговое руководство по установке плагина WordPress.
После активации плагин автоматически добавит поддержку Google AMP на ваш сайт WordPress.
Тем не менее, вы можете изменить настройки AMP вашего сайта, посетив AMP »Общее вашей панели.
На странице настроек AMP вы можете включить или отключить AMP на своем сайте, выбрать режим сайта для AMP и выбрать поддерживаемые модели.
После настройки AMP следующим шагом будет создание AMP-совместимой контактной формы на вашем сайте WordPress.
Шаг 1. Создайте форму WordPress с WPForms
Для начала установите и активируйте плагин WPForms Lite на своем веб-сайте. Это облегченная версия плагина WPForms Pro.
Облегченная и профессиональная версии WPForms позволяют вам создать базовую контактную форму с поддержкой AMP. В нашей статье мы будем использовать бесплатную версию для скриншотов.
После установки и активации плагина, вам нужно перейти на WPForms »Добавить новый страница для создания новой формы WordPress.
На экране настроек формы вы можете выбрать шаблон формы, чтобы быстро начать работу. Вы можете выбрать пустую форму, если вы хотите начать с нуля.
Затем откроется страница конструктора форм.
Отсюда вы можете добавлять или удалять поля формы. Чтобы добавить новое поле в форму, просто щелкните поле на левой панели, и оно появится на панели построителя форм справа.
После этого вы можете настроить параметры поля. Просто нажмите на поле, и тогда появятся параметры поля.
Точно так же вы можете настроить все остальные поля.
После этого вы можете нажать на вкладку «Настройки», чтобы настроить параметры формы.
Общие настройки позволяют переименовывать форму, отправлять текст кнопки, обрабатывать кнопку отправки, включать антиспам Honeypot и многое другое.
Затем вы можете щелкнуть вкладку Уведомления, чтобы настроить уведомления по электронной почте, которые уведомят вас, когда пользователь заполняет форму.
Вы можете щелкнуть вкладку Подтверждение, чтобы настроить сообщение с подтверждением, которое будет отображаться, когда пользователь отправляет форму.
После завершения установки вы можете сохранить свою форму.
Шаг 2. Добавьте форму AMP на страницу
Теперь, когда ваша форма WordPress готова, вы можете добавить ее на страницу.
Во-первых, вы должны создать новую страницу или открыть существующую страницу, к которой вы хотите добавить форму.
На экране редактирования вашей страницы щелкните значок «Добавить новый блок» и выберите блок WPForms.
После этого вы можете увидеть виджет WPForms, добавленный на экран редактирования вашей страницы. Вам просто нужно выбрать форму, которую вы создали ранее, и виджет мгновенно загрузит ее в редактор страниц.
Вы можете опубликовать или обновить свою страницу.
Это оно! Вам не нужно ничего настраивать. Плагин WPForms Lite добавит полную поддержку AMP в вашу форму.
Если вы хотите посмотреть, как это выглядит, вы можете открыть страницу на своем мобильном устройстве.
Или вы можете открыть страницу в браузере на рабочем столе, добавив / amp / или /? Усилитель в конце страницы URL. Например, https://www.example.com/contact/?amp.
Добавьте Google reCAPTCHA в форму AMP
По умолчанию WPForms включает в себя антиспамовый приманку для улавливания и блокирования спама. Кроме того, вы можете использовать Google reCAPTCHA, чтобы уменьшить количество спам-сообщений.
Чтобы использовать Google reCAPTCHA с вашими формами AMP, вы должны зарегистрировать свой сайт в Google reCAPTCHA v3 и получить ключи API Google.
Перейдите на веб-сайт Google reCAPTCHA и нажмите кнопку «Консоль администрирования» в правом верхнем углу страницы.
После этого вам необходимо войти в свою учетную запись Google. Как только это будет сделано, вы увидите страницу «Зарегистрировать новый сайт».
Сначала вы должны ввести название вашего сайта в поле «Метка». Google AMP поддерживает только reCAPTCHA v3, поэтому вам придется выбирать между опциями типа reCAPTCHA.
После этого введите ваше доменное имя в разделе Домены.
В разделе «Владельцы» отображается адрес электронной почты по умолчанию. Вы также можете добавить другое письмо, если хотите.
Вы должны согласиться с Условиями обслуживания reCAPTCHA, чтобы продолжить. Также установите флажок «Отправлять оповещения владельцам», что позволит Google уведомлять вас о таких проблемах, как неправильные настройки и подозрительный трафик на ваш сайт.
По завершении нажмите кнопку «Отправить».
Вы увидите сообщение об успехе вместе с ключом сайта и секретным ключом, чтобы добавить reCAPTCHA на ваш сайт.
Теперь у вас есть ключи Google API для добавления reCAPTCHA в ваши формы. Однако для обеспечения совместимости AMP с reCATCHA необходима еще одна настройка. Нажмите на ссылку «Перейти к настройкам» там.
Вы снова увидите настройки reCAPTCHA с флажком «Разрешить этому ключу работать со страницами AMP». Просто установите флажок и нажмите кнопку Сохранить ниже.
Теперь, когда у вас есть ключи API Google для добавления reCAPTCHA в формы AMP, откройте WPForms »Конфигурация» reCAPTCHA страница в вашей панели управления WordPress.
На этом экране вам нужно выбрать параметр reCAPTCHA v3 и вставить ключ сайта и секретный ключ. После этого нажмите кнопку «Сохранить настройки».
Теперь, когда Google reCAPTCHA был добавлен в WPForms, вы можете при необходимости активировать его в своих формах. Пошли WPForms »Все формы и выберите форму, в которой вы хотите активировать reCAPTCHA.
Когда появится экран настроек формы, нажмите на вкладку «Настройки» и выберите раздел «Общие настройки». Внизу вы можете увидеть флажок «Включить Google v3 reCAPTCHA».
Установите флажок и сохраните форму, нажав кнопку Сохранить в правом верхнем углу.
После этого вы можете вернуться на страницу контактов и увидеть форму AMP с reCAPTCHA в действии.
Мы надеемся, что эта статья помогла вам научиться легко создавать AMP-формы в WordPress. Вы также можете ознакомиться с нашим руководством по созданию форм, совместимых с GDPR, в WordPress.
Если вам понравилась эта статья, подпишитесь на наш канал YouTube, чтобы посмотреть обучающие видеоролики WordPress. Вы также можете найти нас на Twitter и Facebook
