COMO ADICIONAR RECAPTCHA EM UM FORMULÁRIO SEM PLUGIN

Você está aqui:

A maneira mais popular para garantir a segurança e se livrar de spams é com a utilização do reCAPTCHA. Para quem ainda não está familiarizado com o termo – o que é bem difícil -, o reCAPTCHA é aquele checkbox que você tem que marcar para comprovar que você é um humano e não um robô.

Pois bem, hoje a utilização do reCAPTCHA é muito comum em sites de downloads e também para formulários de contato – evitando que a sua caixa de entrada fique cheia de mensagens que não são tentativas de contato reais. Evitar spam é imprescindível para garantir o bom desempenho do seu servidor e claro, a sua saúde mental também!

Como Adicionar reCAPTCHA em um Formulário Sem Plugin

Para conseguir adicionar a verificação reCAPTCHA aos seus formulários WordPress sem a instalação de plugins é preciso que você já tenha algum formulário criado e configurado em seu site.

Integrando o reCAPTCHA

Se você já tem um formulário de contato criado com Contact Form 7, agora podemos acessar o Google reCAPTCHA para gerar algumas informações necessárias para a integração da verificação reCAPTCHA.

Dentro do seu Painel do WordPress, acesse Contato > Integração.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Acessando Pagina de Integracao

Na nova página que será carregada, clique no link google.com/recaptcha para conseguir gerar as chaves de API que precisaremos para a integração em nosso site.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Acessando Google reCAPTCHA

Já no site do Google reCAPTCHA, você deve clicar no botão My reCAPTCHA.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Botao My reCAPTCHA

Assim que você clicar no botão My reCAPTCHA será necessário realizar login com a sua conta Google.

Caso já esteja logado, você verá uma nova página com um formulário para registrar o seu site. Você precisa preenchê-lo para gerar as chaves de API para uso do reCAPTCHA.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Registrando Site Para Uso do reCAPTCHA

No campo Label você vai definir um nome ao seu reCAPTCHA. É importante para identificar para qual site aquele código foi criado.

Em Choose the type of reCAPTCHA escolha a primeira opção, pois é a que deve ser utilizada em sites para a verificação que precisamos. Assim que você escolher a opção reCAPTCHA v2, uma nova área de texto será exibida e você deve adicionar o endereço do seu site ali.

Marque o checkbox para aceitar os termos de serviço do reCAPTCHA.

E por último, clique no botão Register.

Site devidamente registrado, você já terá numa nova página as chaves que precisamos para realizar a integração com o nosso site WordPress: Site key e Secret key.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Chaves para Integracao Secret Key e Site Key

Mantenha a página do Google reCAPTCHA aberta e em outra aba volte para seu Painel Administrativo e em Contato > Integração clique no botão Configurar chaves.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Configurando Chaves
Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Digitacao das Chaves de API

Dois campos serão exibidos e você deve inserir as chaves que acabamos de obter (Site key e Secret key).

Depois clique em Salvar.

Adicionando o reCAPTCHA ao Formulário

Toda a integração concluída com sucesso, só nos resta adicionar a verificação reCAPTCHA aos nossos formulários Contact Form 7.

Acesse a sua lista de formulários (Contato > Formulários de contato) e clique para editar aquele em que você deseja adicionar o reCAPTCHA.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Editando Formulario para uso do reCAPTCHA

Agora que nós já temos o reCAPTCHA integrado ao nosso site, um novo botão estará presente na lista de elementos que o Contact Form 7 nos oferece para a criação de nossos formulários.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Adicionando o reCAPTCHA antes do botao Enviar

Você precisa adicionar o reCAPTCHA antes do botão “Enviar”. Para isso basta colocar o cursor antes do botão de enviar e clicar na opção reCAPTCHA.

Assim que clicar para adicionar o reCAPTCHA, uma janela com seleções para a aparência será exibida. Faça as suas customizações e clique em Inserir tag.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Aparencia do reCAPTCHA

A seguir a marcação do reCAPTCHA será adicionada ao seu formulário.

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Formulario com marcação reCAPTCHA

Clique no botão SALVAR.

Formulário com reCAPTCHA

Você já gerou as chaves de API no Google reCAPTCHA, realizou a integração com o serviço e acabou de adicionar a verificação reCAPTCHA ao seu formulário de contato.

Agora o que está faltando é ver como ficou no nosso site e testar se está funcionando. Então acesse a página onde o formulário está e veja como ficou a aparência e execução de verificação do reCAPTCHA.

O meu formulário de contato com verificação reCAPTCHA (sem uso de plugin) ficou assim:

Como Adicionar reCAPTCHA Ao Formulario Sem Plugin - Formulario com reCAPTCHA

Conclusão

A importância de utilizar ferramentas e tecnologias que blindem o nosso site de enviar spams, enchendo a caixa de entrada dos nossos e-mails e consequentemente derrubando o servidor – sim, isso pode acontecer e é mais comum do que você pode imaginar -, é enorme!

É por facilitar e prevenir abusos e spams que o reCAPTCHA é tão utilizado em todo o universo WEB. Ele garante que robôs mal intencionados não prejudiquem o desempenho do servidor, consumindo banda desnecessária. Por isso que você precisa hoje mesmo integrar a verificação reCAPTCHA ao seu site WordPress.

Was this article helpful?
Dislike 0