contact form 7 настройка captcha

Капча для Contact Form 7 и защита от спама формы обратной связи (все нюансы)

До недавних пор я даже не интересовался какие существуют плагины антиспама в Contact Form 7 потому что проверенная годами связка с Captcha от BestWebSoft работала как часы. Однако недавно разработчики, продвигая свой личный модуль обратной связи, перевели поддержку Contact Form7 в платную PRO версию. Хотя на самом деле это не такая уж и большая проблема, т.к. в самой форме имеется встроенная интеграция официальной Google Captcha. Единственный минус этого подхода (как по мне) в использовании 3-тьей версии капчи без возможности отката до предыдущей.

Итак, первым делом, чтобы внедрить защиту от спама в Contact Form 7 для WordPress сайта, мы после установки плагина обратной связи переходим в его подраздел “Интеграция”.

Здесь в блоке reCAPTCHA имеется на официальный сайт этой капчи. Переходите по ссылке, где представлена краткая информация и самой технологии и ее использованию. Там же на странице будет кнопка «Admin Console», позволяющую залогиниться в свой Гугл-аккаунт или для перехода на регистрацию новой учетной записи.

В личном кабинете находите иконку “+” для создания/добавления нового веб-ресурса. После нажатия увидите следующую форму:

• Указываете ярлык капчи (внутреннее название).
• Выбираете тип защиты. Да, сейчас есть супер модная версия 3 с автоматическим определением ботов, но мне больше нравится метод по старинке с ручным вводом «Я не робот».
• Внизу соглашаетесь с правилами использования и ставите галочку о получении уведомлений, если на сайте будут возникать какие-то проблемы (еще один плюс данной Contact Form 7 капчи).

На следующем шаге вам выдадут 2 значения:

Можете записать их в какой-то файл или временно не закрывать данное окно.

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

Включение reCAPTCHA в Contact Form 7 (v3 или v2)?

Теперь мы приходим к самому интересному – как поставить капчу в Contact Form 7. И тут важным моментом есть то, какой именно вариант защиты вы выбрали. Сейчас Гугл продвигает третью версию и разработчик модуля внедрил именно ее (как передовую технологию). Однако, если почитать форум поддержки в репозитории, то можно увидеть отзывы многих пользователей о том, что данный антиспам фильтр не всегда хорошо справляется.

В общем, если вы решили применять reCAPTCHA v3, то никакие дополнительные настройки после ввода ключей делать не нужно. Вам даже не требуется размещать в форме шорткод [recaptcha], который теперь просто игнорируется. Скрипт капчи работает сразу «из коробки» и самостоятельно в фоновом режиме будет определять является человек реальным или ботом.

Плагин Contact Form 7 – reCaptcha v2

Как я уже говорил выше, новой технологии пока не доверяю, поэтому нашел для себя модуль, совместимый с reCAPTCHA v2. Из его однозначных плюсов выделю: активную и быструю работу над ошибками, более 70к загрузок, простота подключения. Скачивайте отсюда либо ставьте сразу из WP-админки.

После его активации вам нужно:

1. Зайти в раздел «Contact Form 7» — пункт «Версия reCaptcha», где выбираете вторую (источник, как и был по умолчанию, остается google.com).

2. Кликаем по кнопке “Отправить”.

3. Далее открываем для редактирования нужную форму и добавляем перед кнопкой отправки шорткод [recaptcha]. Сохраняем настройки и проверяем результат на вебсайте.

Для шорткода, кстати, есть несколько доп.параметров.

Дополнительные нюансы. Если вдруг по какой-то причине автор забросит этот замечательный плагин, то выбирая среди всех остальных плагинов для капчи в Вордпресс с подобными функциями я бы посоветовал попробовать Advanced noCaptcha & invisible Captcha (v2 & v3) (находится тут). Его аналогично часто упоминают как альтернативу, но баги там исправляются чуть менее быстро (хотя также имеется 70к скачиваний).

Если вы используете в работе Flamingo, то я бы настоятельно рекомендовал ставить капчу на Contact Form 7 ибо спам в данном случае изначально фильтруется через Akismet. И когда последний у вас не настроен, то ооочень многие реальные сообщения из формы помечаются как спам. Если я правильно понял, форма в первую очередь ориентируется на Akismet, когда в проекте нет более серьезного решения от Гугла. В общем, тут еще надо тестировать всякие нюансы, но чтобы бы вы не выбрали без антиспама Flamingo лучше не оставлять.

источник

Интеграция reCAPTCHA v3 с Contact Form 7

Установка reCAPTCHA v3 для Contact Form 7 в WordPress не вызовет сложностей даже у неопытных пользователей. Процесс очень простой. Для интеграции возиться с кодом, по сути, не нужно. Инструкцию, конечно же, решил написать. На всякий случай. Надеюсь, принесет пользу. Начнем.

Получаем ключи в Google reCAPTCHA

Прежде всего нужно установить плагин Contact Form 7. Конечно, не обязательно в первую очередь, но лучше сразу. Далее переходим по ссылке: https://www.google.com/recaptcha/intro/v3.html. Нажимаем кнопку Admin console в верхнем правом углу.

Начинается этап подключения интеграции reCAPTCHA v3 для Contact Form 7. Те, кто уже работал с сервисом, наверняка увидели, что дизайн серьезно изменился. Смотрим на скриншот. Стрелочкой указано, куда нажимать. Пустое поле — статистика. Просто невидимой рекапчей никто не пользовался, потому стата пуста. Если мало посетителей, то в статистике так же ничего не будет. Нажимаем на кнопку.

Вот и перешли к следующему окну. Здесь нужно указать данные домена. Все довольно просто, смотрите на примере ниже.

Вбиваем ярлык. Это название проекта. Выбирайте любое удобное.

Выбираем тип рекапчи. В нашем случае — reCAPTCHA v3.

Указываем домен. Без http, htpps, если есть www, то тоже нужно указать.

Если нужно, указываем дополнительные адреса электронной почты.

Принимаем условия, листаем ниже. Отправляем данные.

После выполнения данных действий появится следующая страница.

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

Подключение reCAPTCHA v3 к Contact Form 7

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

Копируем ключи, размещенные на сайте Google, вставляем в отмеченные поля. Нажимаем кнопку Save Changes. Установка reCAPTCHA v3 для Contact Form 7 закончена. Как видите, все просто. Но теперь появилась другая проблема. Появился раздражающий логотип в нижнем правом углу экрана. Как исправить, смотрите здесь.

источник

WordPress. Как добавить captcha в Contact Form 7

Из этого туториала Вы узнаете, как добавить captcha ( reCAPTCHA ) в Contact Form 7 в WordPress.

В плагин Contact Form 7 включена captcha . Для того чтобы добавить captcha на ваш сайт, следуйте таким инструкциям:

Для того чтобы начать настройку reCAPTCHA , Вам понадобится профиль пользователя Google и регистрация вашего сайта для получения ключей API :

Войдите в ваш профиль пользователя Google+ и откройте админ панель reCaptcha :

Зарегистрируйте ваш сайт: введите ваше Доменное имя и Ярлык. Нажмите на кнопку «Зарегистрировать»:

Сделав это, Вы получите ключ сайта и секретный ключ.

Войдите в вашу админ панель WordPress.

Перейдите на страницу Контакты (Contact) > Интеграция (Integration).

Найдите раздел reCAPTCHA и нажмите на кнопку Изменить ключи (Configure Keys).

Введите ваш ключ сайта и секретный ключ в поля, которые Вы видите:

Откройте вашу контактную форму во вкладке Контакты (Contact) > Контактные формы (Contact Forms) вашей админ панели:

Добавьте шорткод, указанный ниже, в поле контактной формы: [ recaptcha ]

Нажмите на кнопку Сохранить (Save) и обновите ваш сайт для просмотра изменений:

Вы можете также ознакомиться с детальным видео-туториалом ниже:

источник

Защита от спама для Contact Form 7 WordPress

Приветствую Вас, дорогой читатель моего блога! В данной статье я подробно расскажу о том, как сделать эффективную защиту от спама для Contact Form 7.

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

Навигация по статье:

Для того чтобы избавиться от этой проблемы давайте рассмотрим встроенные в Contact Form 7 способы защиты от спама.
А также научимся их устанавливать и настраивать на своём сайте.

Для этого перейдём в административную часть сайта и перейдём к редактировании формы обратной связи Contact Form 7, которая используется у вас на сайте.

В боковом меню выбираем Contact Form 7 –> Формы -> находим нужную форму и нажимаем на ссылку «Изменить» под названием этой формы.

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

Защита от спама для Contact form 7 при помощи поля acceptance

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

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

Для того чтобы вставить это поле просто щёлкаем мышкой по кнопке с его названием.

Данное поле имеет несколько настроек:

• Make this checkbox checked by default – изначально, галочка выставлена по умолчанию и пользователю не нужно выставлять ее вручную.
• Make this work inversely – если включить этот параметр, то это поле начинает работать наоборот, т.е. для того, чтобы произошла отправка формы вам нужно эту галочку не поставить, а, наоборот, убрать. Т.е. это тоже можно использовать для защиты от спама.

При необходимости вы также можете задать для этого поля идентификатор ID и класс.
Поле «Имя» оставляем без изменений.
После внесения изменений в настройки поля нажимаем кнопку «Insert Tag»
Также не забудьте написать рядом с галочкой какой то текст. Например; «С условиями ознакомлен».

Для того чтобы просмотреть как будет выглядеть это поле сохраняем форму и обновляем страницу с формой.

Защита от спама при помощи поля quiz

Следующее поле, которое можно использовать для защиты от спама – quiz. Возможно, вы встречали в формах на других сайтах, когда вам задается простой вопрос, например: « Солько будет 2 + 2?», и вам нужно ввести на него ответ.

Вставляется это поле аналогично предыдущему. Нажимаем на кнопку с названием «quiz» и вносим настройки.

Для того чтобы ввести свои вопросы и ответы, мы должны в поле «Questions and answers» написать сначала вопрос, а затем через вертикальный слэш ответ. При этом каждый вопрос должен быть написан с новой строки.

При отправке форма будет проверять, совпадает ли то, что ввел пользователь с тем ответом, который ввели вы. Если да, то будет осуществляться отправка, если нет – будет выдаваться ошибка.

После того как вы ввели все вопросы и ответы, нажимаем «Insert tag». Это могут быть не обязательно примеры, может выводиться абсолютно любой текст.

Защита от спама для Contact form 7 при помощи поля reCAPTCHA

Следующее поле для защиты от спама, это поле reCAPTCHA. Это специальный сервис Google который позволят генерировать специальные поля, которые выглядят таким образом:

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

Для вставки данного поля на панели генерирования полей Contact form 7 нажимаем кнопку «reCAPTCHA».

Во всплывающем окне нам будет предложена ссылка с инструкцией по подключению сервиса reCAPTCHA к вашему сайту.

Переходим по этой ссылке и смотрим инструкцию.

1. Первое, что нужно сделать — перейти на Google’s reCAPTCHA.
2. Register your site — зарегистрировать ваш сайт.
3. Get a site key and secret key – получить ключ от сайта и секретный ключ.

При переходе по предложенной ссылке нам предлагают ввести название и домен сайта, причем не адрес сайта, а только домен, без http://.

После ввода данных нажимаем на кнопку «Регистрация».

После этого нас перекинет на страницу, с которой нам нужно скопировать ключ.

Затем нам нужно перейти в админ панель сайта, пункт меню Contact Form 7 => Integration и вести полученные ключи для сайта.

Теперь можно вернуться к редактированию формы и вставить это поле.

Нажимаем на » reCAPTCHA «, и видим настройки:

• Theme (light/dark) — тема, светлый фон/темный фон.
• Size (normal/compact) — размер, нормальный или компактный.

Выбираем нужные значения и нажимаем «Insert Tag»

Видеоинструкция

Если у вас остались какие то вопросы, то можете посмотреть видеоинструкцию по настройке защиты от спама:

Мы рассмотрели три простых но эффективных способа защиты от спама для формы Contact Form7. Это специальные поля » acceptance», «quiz» и «reCAPTCHA». Вы можете использовать эти поля как по одному, так и в сочетании друг с другом, и в этом случае получите многоуровневую защиту.

Если статья была для вас полезна не забудьте поделиться ею в соцсетях.

С уважением Юлия Гусарь

Читайте также:

Подписаться на рассылку

23 комментария

Очень полезная информация

Спасибо! Понятно, доступно, полезно!

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

Только возник вопрос. Вы не подскажете, как исправить в css (или прописать в самой форме отправки) один глюк: после применения двух видов защиты («acceptance», «quiz») кнопка «Отправить» налезла на окошко с вводом ответа на вопрос «quiz» .

Здравствуйте! В случае с Вашей проблемой можно сделать так: в файл style.css вашей темы в самом конце прописать:

Если не поможет, то мне нужна ссылка на сайт чтобы более детально посмотреть код.

Спасибо за ответ! Да еще и так оперативно, не ожидала даже, думала вообще через пару дней зайти проверить)).

Ваш совет помог лишь частично. Кнопка опустилась вниз, но возникла другая проблемка — теперь сообщения об ошибке (если не заполнил какие-то поля, например «Одно или несколько полей содержат ошибку») формируется между кнопкой и окошком ввода ответа на вопрос «quiz» . Причем наезжая частично на кнопку отправки (за ней). А еще я добавила код предложенного Вами готового стиля формы отправки вот с этой страницы: //impuls-web.ru/izmenyaem-stili-dlya-contact-form-7-tri-gotovyx-resheniya/ (использовала первый вариант стиля). Отредактировала под себя частично (цвет, размер).

В итоге у меня не только проблема с кнопкой отправки, которая все время наезжает на чужое поле, но и проблема с блоком загрузки файлов: кнопка «Выберите файл» удобно разместилась прямо в поле (где должен отобразиться файл, который загружен). Но этот глюк в Хроме, а в Мозилле старой все ок с файлом отправки — кнопка «Обзор» (кстати, она сама себя назвала «Обзор», в Хроме не так) там, где нужно: справа от поля.

И глюк с цветом фона. Не меняется, и все тут. Я уже задала его везде, где можно. В итоге меняется лишь оконтовочка (рамка формы). А так все пространство формы серое. Цвет текста в полях тоже пришлось прописать везде, пока он, наконец, не стал черным. Теперь думаю, что у меня код перенасыщен ненужными, лишними цветами фона и текста (подозреваю, что это плохо).

В общем, моя форма живет своей жизнью и мало реагирует на мои манипуляции.

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

Может, Вы просто более подробно опишете, что означают все эти #fancybox-wrap <, #fancybox-outer <, #fancybox-outer>div, #fancybox-content, и я как-нибудь сама попытаюсь разобраться? Кстати, у меня не изменился размер поля для ввода ответа «quiz». Хоть я его вывела в отдельный блок, вроде как:

А он остался того же размера, что и остальные поля — длинный очень

И еще один нюанс — не меняется цвет «обязательно» вот здесь:

Пыталась изменить цвет в админ-панели при создании формы (вкладка «Шаблон формы»):

Я вот подумала. А может, проблема с кнопкой отправки в том, что где-то в коде задана величина высоты Формы отправки, поэтому бедная кнопка не знает, куда ей деться и налазит на верхнее поле или на границу форм внизу. Вы, случайно, не знаете, где «вшит» размер формы?

По поводу #fancybox-wrap<, #fancybox-outer<, #fancybox-outer>div, #fancybox-content, — это стандартные селлекторы ContactForm 7. Там в двух словах не объяснишь 🙂

По поводу поля quiz. Для того чтобы задать ему стили можно при его генерации задать для него класс или ID и потом прописывать стили для заданного класса или идентификатора. Если какое то свойство не срабатывает. Можно попробовать прописать ему правило !important;

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

Добрый день. Следующий вопрос: у меня есть 5 контактных форм. Я вставил во все tag

, где id для каждой формы свой. Но кукапча появляется только в одной контактной форме. Как добавить ее во все контактные формы? Благодарю!

Спасибо за публикацию. При помощи поля quiz проблема спама решена)

Отлично! Спасибо за комментарий!

Спасибо автору за рабочий рецепт настройки капчи. За СЕО отдельный респект.

Спамеры — одолели, правда искал, как запретить вставлять ссылки в сообщения формы)

рекаптча вообще не помогает. спамеры уже давно придумали обход

Подскажите, пожалуйста, как сделать так, чтобы рекапча была на русском?

источник