Разработчикам, Статьи

Как добавить невидимую капчу в Contact Form 7

Мало на свете любителей проходить капчу при заполнении контактной формы. Но еще меньше желающих получать спам со своего сайта. Как удовлетворить и посетителей, и владельцев?

Есть два варианта.

Captcha v.3 от Google.

Ставится просто, надо только заполнить нужные поля по адресу https://www.google.com/recaptcha/intro/v3.html, получить необходимые коду и вставить их в разделе Интеграция. Есть один существенный минус — в нижнем углу экрана будет вечно плавать значок гугла.

Невидимая captcha своими руками.

Этот вариант более изящный.

  1. В конце формы размещаем чекбокс такого вида:
    [acceptance agree class:agree default:on invert]
  2. Следом размещаем следующий код:
    <script language="javascript">
    jQuery('.agree').prop('checked', false);
    </script>

    Эту часть рекомендовано вставлять в шаблон, но у меня не заработало. А в форме все в порядке.

  3. Открываем форму на странице и убеждаемся, что флажок автоматически снимается. После этого в style.css, а лучше в Внешний вид/Настройки/Дополнительные стили скрываем вставленный чебокс:
    .agree {display:none}

Как работает этот метод.

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

Back to list