Как добавить CAPTCHA в ваши формы WordPress? (Краткое руководство 2022 г.)

Опубликовано: 2022-04-22

Незнание того, как добавить капчу в форму WordPress, может расстраивать. Особенно когда это намного проще, чем ты думаешь. Не волнуйся; прочитав эту статью, вы сможете без проблем включить Captcha в WordPress.

Знаете ли вы, что полная форма CAPTCHA — это «Полностью автоматизированный общедоступный тест Тьюринга, позволяющий различать компьютеры и человека»? Проще говоря, добавление Captcha помогает вашему сайту идентифицировать компьютер и настоящего клиента.

Если вы останетесь с нами до конца, вы узнаете больше о силе добавления Captcha на свой сайт. И да, мы также упомянули, как добавить Captcha и Google reCaptcha в вашу форму.

Оглавление

Преимущества добавления Captcha в вашу форму WordPress

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

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

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

Итак, без лишних слов, давайте рассмотрим способы включения Captcha на вашем сайте.


Руководство о том, как добавить капчу в форму WordPress

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

Однако в этом руководстве объясняется, как добавить Captcha в контактную форму, а также в форму регистрации и входа. Мы добавим Google reCaptcha в форму входа и регистрации, а пользовательскую Captcha — в контактную форму.

Основное различие между Google reCaptcha и Captcha заключается в том, что Google reCaptcha — это бесплатный сервис. Все, что вам нужно сделать, это интегрировать его в свою форму.

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

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

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

Не бойтесь, потому что Everest Forms уже здесь. Это популярный плагин для создания форм WordPress. Не говоря уже о том, что его интерфейс перетаскивания может помочь вам создать любую форму за считанные минуты. Помимо этого, он имеет такие функции, как:

  • Дизайнер форм
  • Неограниченное количество полей формы
  • Готовые шаблоны форм
  • Несколько премиальных дополнений
Эверест Формы

Чтобы узнать больше, прочтите эту обзорную статью о Everest Forms.

i) Установите и активируйте Everest Forms

После входа в панель управления WordPress перейдите в меню «Плагины» >> «Добавить новый» .

Добавить новую кнопку плагина

Введите Everest Forms в строке поиска. Как только он появится в результатах поиска, нажмите кнопку « Установить сейчас » и, наконец, нажмите кнопку « Активировать ».

Активировать Эверест Формы

И это все; вы успешно установили и активировали бесплатную версию плагина Everest Forms.

Однако в бесплатной версии нет поля Captcha; следовательно, покупка премиум-версии является обязательной.


ii) Установите Everest Forms Pro

Посетите официальную страницу плагина — WPeverest. В выпадающем меню — Плагины выберите Everest Forms .

Выпадающее меню форм Everest

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

Страница цен на формы Everest

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

После входа в систему перейдите на вкладку « Загрузки » и загрузите плагин Everest Forms pro.

Затем выберите меню «Плагины» >> «Добавить новое» на панели управления WordPress. Нажмите на опцию « Загрузить плагин », которую вы видите вверху.

Загрузить плагин

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

Загрузить плагин Everest Forms

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

Вставить лицензионный ключ

iii) Создать контактную форму

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

Everest Forms поставляется с готовым шаблоном контактной формы. Если вы нажмете Everest Forms >> Add New , вы попадете на страницу шаблона формы. Доступно более 10 шаблонов.

Everest Forms Добавить новую кнопку

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

Создать контактную форму

Перед созданием формы вы также можете просмотреть ее.

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

Имя Контактная форма

Во вновь созданной контактной форме есть 4 основных поля: Имя, Электронная почта, Тема и Сообщение. Вы можете добавить больше полей, если хотите.

Для получения более подробной информации прочитайте нашу статью о том, как создать контактную форму.


iv) Добавьте поле Captcha в вашу форму

Мы подошли к самому ожидаемому шагу в этом уроке. Вы правильно угадали; пришло время добавить пользовательскую капчу в вашу форму. Для этого нам понадобится надстройка Everest Forms — Custom Captcha .

Это дополнение поможет вам добавить дополнительный уровень безопасности к вашей форме. Наиболее значительным преимуществом этого дополнения является то, что оно позволяет добавлять пользовательские вопросы и математическую капчу для предотвращения отправки спам-форм. Чтобы установить надстройку, перейдите в Everest Forms >> Дополнения.

Аддоны Everest Forms

Найдите надстройку Custom Captcha и нажмите кнопку « Установить надстройку». Вам также необходимо активировать его.

Как добавить капчу в форму WordPress

Затем вернитесь к только что созданной контактной форме, выбрав Everest Forms >> All Forms . Наведите указатель мыши на форму, которую вы создали ранее, и нажмите кнопку « Изменить ».

Изменить контактную форму

Чтобы добавить поле капчи в форму, нажмите кнопку « Добавить строку» . Теперь перетащите виджет Captcha с левой панели на правую сторону.

Добавить поле с капчей

V) Настройте поля Captcha

Поле Captcha настраивается, поэтому вы можете легко настроить его в соответствии с нишей вашего веб-сайта. Просто выберите « Параметры поля», и вы найдете несколько вариантов настройки. Ниже мы кратко объяснили их:

Метка : Текущая метка поля — Captcha . Вы можете изменить текст на что угодно, например, «Решить проблему» .

Вариант этикетки

Формат : Вы можете выбрать один из двух форматов: математический и вопрос-ответ . Если вы выбираете опцию Math каждый раз, пользователям предоставляется другая математическая капча.

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

Вопросы и ответы

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

Описание : Добавьте описание поля Captcha. Он появится на дне контейнера.

Добавить описание

Расширенные опции

  • Замещающий текст : этот параметр позволяет добавить текст в поле «Ответ».
  • Скрыть метку : вы можете скрыть или отобразить метку Captcha.
  • Классы CSS: здесь вы можете добавить имя класса CSS для контейнера поля Captcha.

Условная логика

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

  • Показать/скрыть : выберите, хотите ли вы показать или скрыть поле.
  • Выбрать поле : В этом раскрывающемся меню выберите поле, определяющее условие.
  • Условие : выберите различные условия между есть, нет, пусто, не пусто, больше и меньше.
  • Выберите вариант : Запишите здесь условное значение.

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

Пример условной логики

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

Вот полная статья о том, как использовать условную логику в Everest Forms.

Если форма и настройки вас устраивают, нажмите кнопку « Сохранить », расположенную вверху.

Благодаря этим простым шагам контактная форма на вашем сайте теперь безопасна и надежна. Теперь никакие хакеры не могут отправлять ложные и вредоносные формы на ваш сайт WordPress.

Примечание . Everest Forms также позволяет интегрировать Google reCaptcha в вашу форму. Пожалуйста, просмотрите эту документацию для лучшего понимания. Еще одна важная часть информации заключается в том, что вы можете интегрировать Google reCaptcha и одновременно добавлять собственную капчу.


2) Добавьте Google reCaptcha в форму регистрации и входа

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

Довольно полезно, не так ли? Итак, давайте создадим форму регистрации и входа пользователя. Более того, вы можете добавить капчу, чтобы защитить его от отправки спам-форм.

Но сначала давайте установим плагин формы регистрации и входа. Именно для этой цели WPeverest предоставляет плагин регистрации пользователей.

Плагин регистрации пользователей

i) Установить и активировать регистрацию пользователя

Перейдите в меню « Плагины» >> «Добавить новый » на панели инструментов WordPress. Теперь найдите «Регистрация пользователя»; как только он появится в результатах поиска, нажмите « Установить сейчас» . Также активируйте плагин.

Активировать плагин регистрации пользователей

Затем вам нужно включить опцию « Членство ». Это позволит вашим пользователям регистрироваться на вашем сайте с внешнего интерфейса. Итак, перейдите в «Настройки» >> «Общие ». Установите флажок « Любой может зарегистрироваться » и сохраните изменения.

Включить опцию членства

ii) Создать регистрационную форму

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

Установить страницы регистрации пользователей

Вы можете использовать эту форму по умолчанию; однако вы также можете создать регистрационную форму с нуля. Чтобы создать регистрационную форму с нуля, выберите « Регистрация пользователя» >> «Добавить новую» .

Регистрация пользователя Добавить новую кнопку

Это приведет вас на страницу конструктора форм, где вы можете перетаскивать виджеты и легко создавать формы.

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

Добавить новое поле формы

Вот полное руководство по созданию формы регистрации и входа с помощью User Registration.


iii) Интеграция Google reCaptcha

Регистрация пользователя позволяет интегрировать Google reCaptcha в вашу регистрационную форму. Как упоминалось выше, Google reCaptcha — это совершенно бесплатный сервис, который помогает сайтам защищаться от спама.

Чтобы интегрировать reCaptcha, перейдите в раздел « Регистрация пользователей» >> «Настройки ». Выберите вкладку « Интеграция » в верхней строке меню.

Типы капчи

Вы можете добавить три типа Captcha: reCaptcha v2, reCaptcha v3 и hCaptcha.

  1. reCaptcha v2 : эта версия отслеживает пользователей на основе их действий. Например, он требует, чтобы пользователи установили флажок «Я не робот». Другой способ — представить какую-то задачу по распознаванию изображений.
  2. reCaptcha v3 : наоборот, reCaptcha v3 работает в фоновом режиме. Он различает бота и человека на основе их поведения. Он генерирует оценку в соответствии с их действиями на вашем сайте; чем выше оценка, тем больше вероятность того, что пользователь — человек.
  3. hCaptcha : hCaptcha — это альтернативный вариант reCaptcha, который отличает ботов от людей с помощью расширенного машинного обучения. Основное различие между reCaptcha и hCaptcha заключается в том, что hCaptcha не продает данные пользователя третьим лицам.

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

Для этого посетите этот сайт — обзорную страницу Google. Теперь выберите параметр v3 Admin Console на верхней панели.

Главная страница Google reCaptcha

Введите ярлык своего сайта , домен , адрес электронной почты и примите Условия использования reCAPTCHA . Кроме того, выберите, хотите ли вы добавить reCaptcha v2 или reCaptcha v3 .

Создать ключи капчи

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

  • Флажок «Я не робот»: пользователям необходимо поставить галочку «Я не робот».
  • Невидимый значок reCAPTCHA: этот параметр проверяет запросы в фоновом режиме.
  • reCAPTCHA Android: эта опция предназначена для Android. Он проверяет запросы в ваших приложениях для Android.

Наконец, нажмите кнопку « Отправить ».

Интегрировать reCaptcha v2

Если вы решите добавить reCaptcha v2, скопируйте и вставьте ключ сайта и секретный ключ, которые вы создали ранее. Кроме того, Everest Forms также предоставляет опцию Invisible reCAPTCHA .

Интегрировать reCaptcha v2

Интегрировать reCaptcha v3

Чтобы добавить reCaptcha v3, Everest Forms предлагает различные параметры настройки. Как и в случае с reCaptcha v2, необходим ключ сайта и секретный ключ. Однако имейте в виду, что вам нужен ключ сайта и секретный ключ, отличный от reCaptcha v2.

Процесс создания ключей такой же, как и в reCaptcha v2. Единственная разница в том, что вы должны установить переключатель reCaptcha v3 в разделе типа reCAPTCHA .

Выберите reCaptcha v3

reCaptcha v3 также позволяет вам установить пороговую оценку . Оценка по умолчанию равна 0,4. Если оценка превышает пороговую оценку, взаимодействие является хорошим. Но если оценка меньше, возможно, пользователь — бот. Таким образом, пользователь не сможет отправить форму. Вы можете установить счет по вашему желанию.

Интегрировать reCaptcha v3

Интегрировать hCaptcha

Если вы хотите добавить капчу, все, что вам нужно, это ключ сайта и секретный ключ. Чтобы сгенерировать ключ сайта и секретный ключ для hCaptcha, посетите этот сайт — hCaptcha.com. Зарегистрируйтесь и выберите вариант бесплатного обслуживания.

Кнопка регистрации hCaptcha

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

Интегрировать hCaptcha

iv) Включить опцию reCaptcha для регистрационной формы

Мы на полпути к тому, как добавить Captcha в форму WordPress. Для следующего шага перейдите в меню « Регистрация пользователя ».

Вы можете увидеть созданную вами регистрационную форму (или форму по умолчанию). Наведите курсор и выберите параметр « Редактировать ».

Изменить регистрационную форму

На странице редактора формы перейдите в « Настройки формы» . Затем включите поддержку reCaptcha . Затем нажмите кнопку « Обновить форму » в левом верхнем углу.

Включить поддержку reCaptcha

Вот как выглядит ваша форма, если вы выбрали reCaptcha v2 при предварительном просмотре . Также помните, что здесь мы использовали тему Zakra. Следовательно, форма может выглядеть иначе, если активна другая тема.

Пример Google reCaptcha

Если вы интегрировали reCaptcha v3 , это внешний вид reCaptcha в регистрационной форме.

пример reCaptcha v3

Наконец, если вы решили добавить hCaptcha, вот как это выглядит.

Пример hCaptcha

V) Включить reCaptcha для формы входа

Чтобы включить reCaptcha в форме входа, перейдите в « Регистрация пользователя» >> «Настройки» .

Настройки регистрации пользователя

Затем перейдите в « Общие» >> «Параметры входа» и установите флажок « Включить Captcha ».

Включить опцию капчи

Наконец, нажмите кнопку « Сохранить изменения ».


Завершение!

Добавление Captcha в вашу форму WordPress похоже на наложение брони на вашу форму, чтобы защитить ее от вредоносных и ложных отправок формы. Кроме того, из приведенного выше руководства вы уже должны знать, как легко добавить капчу в форму.

Особенно с Everest Forms вы можете без проблем включить Captcha в контактных формах. А чтобы защитить форму входа и регистрации, интегрируйте Google reCaptcha с помощью плагина User Registration.

И это все, что касается руководства о том, как добавить капчу в форму WordPress. Пожалуйста, поделитесь ею с друзьями и семьей, если вам понравилось читать статью.

Прежде чем вы пойдете, вот интересная статья о том, как встроить WordPress iFrame. Вы также можете подписаться на нас в Twitter и Facebook, чтобы быть в курсе обновлений статей и интересных новостей.