Como adicionar login com número de telefone via OTP no WordPress

Lembra-se de quando e-mail e senha eram a única maneira de fazer login em sites? Os tempos mudaram, e agora muitos usuários esperam a conveniência de fazer login com seus números de telefone.

Depois de ajudar diversas pessoas a configurar sistemas de login baseados em telefone em seus sites do WordPress, aprendi quais métodos funcionam melhor e quais devem ser evitados. Testei tudo, desde plugins premium até soluções personalizadas, para encontrar as opções mais confiáveis.

Neste guia, compartilharei como adicionar login por número de telefone com verificação OTP ao seu site WordPress. Quer esteja administrando um site de pequenas empresas ou uma grande plataforma de associação, você encontrará uma solução que atenda às suas necessidades.

Por que permitir que os usuários do WordPress façam login com seus números de telefone?

As senhas podem ser um incômodo, especialmente quando você administra um site comunitário, como um site de associação, um blog com vários autores, um site de comércio eletrônico e assim por diante.

O problema é que as pessoas esquecem as senhas com frequência, reutilizam senhas fracas ou as escrevem em um local onde outras pessoas possam vê-las. Isso não é seguro, e muitas pessoas me disseram que gostariam que houvesse uma maneira mais simples de fazer login em sites do WordPress.

Oferecer um login por número de telefone com uma senha de uso único (OTP) facilita as coisas. Isso elimina a necessidade de lembrar senhas e mantém as contas dos usuários seguras.

Aqui está o motivo pelo qual você deve considerar adicionar o login por telefone ao seu site WordPress:

• Melhor segurança: As senhas podem ser hackeadas ou roubadas. As OTPs mudam a cada vez, tornando os logins mais seguros.
• Logins mais rápidos: Não há necessidade de digitar senhas longas. Um código rápido enviado para um telefone permite que os usuários façam login instantaneamente.
• Menos redefinições de senha: Se você estiver administrando um site comunitário, seus usuários não precisarão mais redefinir senhas esquecidas, economizando tempo e tíquetes de suporte.
• Melhoria da experiência do usuário: Um login tranquilo mantém as pessoas satisfeitas e mais propensas a retornar ao seu site.
• 📱 Ideal para usuários móveis: Mais pessoas navegam em seus telefones. Permitir que elas façam login com um código facilita o processo.

Agora, vamos dar uma olhada em como permitir facilmente o login com número de telefone via OTP no WordPress.

Como adicionar login com número de telefone via OTP no WordPress

Você pode adicionar facilmente um login por número de telefone ao WordPress usando o plug-in gratuito Login with Phone Number.

No entanto, como o WordPress não envia mensagens SMS por padrão, você também precisará de um serviço de terceiros, como Firebase ou Twilio, para lidar com a entrega de OTP. Mostrarei a você como configurar tudo isso.

Primeiro, você precisa instalar e ativar o plug-in gratuito Login With Phone Number. Para obter detalhes, consulte este tutorial sobre como instalar um plug-in do WordPress.

Após a ativação do plug-in, acesse a página Login Settings ” General (Configurações de login ” Geral ) no painel do WordPress e marque a opção “Enable phone number login” (Ativar login por número de telefone).

Depois disso, você pode adicionar códigos de país para todas as regiões em que seus usuários estão fazendo login. Por padrão, o plug-in inclui os códigos de país do número de telefone para todos os países.

Recomendo deixar essa configuração como está. Ela garante que seu site permaneça acessível a um público global.

Em seguida, marque a opção “Enable email login” (Ativar login por e-mail) se quiser permitir o login por e-mail para seus usuários.

Recomendamos essa configuração se você tiver usuários que estão acostumados a fazer login com o e-mail. Ao fazer isso, você garantirá que eles não fiquem frustrados quando o login por número de telefone for ativado, pois ainda poderão fazer login usando o e-mail.

Em seguida, você pode marcar a opção “Force to get email after phone number”. Essa configuração garante que os novos usuários sejam obrigados a fornecer seu endereço de e-mail antes de concluírem o registro. Isso é especialmente útil se você já tiver uma lista de e-mails e quiser coletar e-mails de novos usuários.

Também é possível ativar o registro do usuário com um número de telefone. Feito isso, digite o comprimento do código de ativação que será fornecido aos usuários.

Depois disso, você deve rolar para baixo e encontrar a opção “Enable Timer”. Clique para ativá-la e, em seguida, defina o limite de tempo para os usuários inserirem a OTP.

Por exemplo, se você definir 60 segundos, os usuários terão um minuto para inserir o código antes que ele expire. Em seguida, clique no botão “Save Changes” (Salvar alterações) para armazenar suas configurações.

Vá em frente e mude para a guia “Gateway” na parte superior. Aqui, você deve selecionar um provedor de serviços de SMS para o login OTP do seu número de telefone.

Escolherei o Firebase para este tutorial. Trata-se de um serviço do Google que permite enviar senhas de uso único para os telefones dos usuários para um login seguro. No entanto, você também pode escolher opções como Twilio, WhatsApp, Alibaba SMS e outras.

Lembre-se de que algumas das opções só estarão disponíveis no plano Pro.

Depois de escolher o Firebase, você precisará adicionar a chave e a configuração da API.

Para isso, você precisa acessar o console do Firebase e selecionar a opção “Create a Firebase Project”.

Isso o levará a uma nova tela, na qual você deve adicionar um nome de projeto. Você pode chamá-lo de qualquer coisa que o ajude a lembrar para que o está usando.

Em seguida, clique no botão “Continue”.

O Firebase agora solicitará permissão para ativar o Google Analytics para o projeto.

Depois de permitir isso, você deve selecionar “Default Account for Firebase” (Conta padrão para Firebase) no menu suspenso e clicar no botão “Create Project” (Criar projeto).

Agora você será levado à página Visão geral do projeto. Aqui, navegue até a guia Build ” Authentication na coluna da esquerda.

Vá em frente e clique no botão “Get started”.

Depois de fazer isso, algumas novas configurações ficarão visíveis na tela. Aqui, escolha “Phone” (Telefone) como o provedor nativo e ative o botão “Enable” (Ativar).

Isso permitirá que os usuários façam login com um número de telefone celular usando a verificação de telefone do Firebase SDK. Em seguida, clique no botão “Save” (Salvar).

Agora, vá para a guia “Settings” (Configurações) e selecione a opção “Authorized domains” (Domínios autorizados) na coluna da esquerda.

Aqui, você deve clicar no botão “Add domain” (Adicionar domínio). Isso abrirá um prompt no qual você precisará adicionar o nome de domínio do seu site.

Depois disso, basta clicar no ícone de configurações ao lado de Project Overview (Visão geral do projeto) na parte superior e selecionar a guia “Project Settings” (Configurações do projeto).

Em seguida, role para baixo até a seção “Your Apps” (Seus aplicativos) e selecione o ícone da Web.

Agora você precisará adicionar um nome ao seu aplicativo e clicar no botão “Register App” (Registrar aplicativo).

Quando você fizer isso, o Firebase gerará um SDK para você. Isso significa Kit de desenvolvimento de software, mas funciona como um aplicativo.

A partir daí, basta clicar no botão “Continue to Console”.

Quando você estiver de volta à página Project Overview (Visão geral do projeto), basta copiar a “Web API Key” e armazená-la em um local seguro.

Agora, role para baixo até a seção “Your Apps” (Seus aplicativos), onde os detalhes do seu aplicativo mais recente serão exibidos na tela.

Aqui, escolha o botão de opção “Config” para exibir seu Firebase SDK como configuração. Basta copiá-lo e armazená-lo em um local seguro.

Depois disso, você precisa voltar ao painel do WordPress e adicionar a chave e a configuração da API do Firebase em seus respectivos campos nas configurações do plug-in Login with Phone Number.

Em seguida, clique no botão “Save Changes” (Salvar alterações) para armazenar suas configurações.

Feito isso, abra a página do WordPress em que você deseja adicionar o formulário de login e clique no botão “Add Block” (Adicionar bloco).

No menu de blocos, você precisa escolher o bloco “Shortcode” e adicionar o seguinte shortcode a ele:

[idehweb_lwp]

Por fim, clique no botão “Update” (Atualizar) ou “Publish” (Publicar) para armazenar suas configurações.

Agora, quando novos usuários visitarem seu site, eles poderão se registrar e fazer login usando o número de telefone, enquanto os usuários existentes ainda poderão fazer login usando o e-mail.

Depois de configurar isso, recomendamos enviar um e-mail para os usuários existentes, incentivando-os a adicionar seus números de telefone o mais rápido possível.

Eles podem fazer isso visitando a página de perfil no painel do WordPress, rolando para baixo até a seção “Personal Information” (Informações pessoais), adicionando o número de telefone e clicando em Update User (Atualizar usuário).

Isso garante que mesmo os usuários existentes que já se inscreveram possam fazer login com seus números de telefone mais tarde.

Bônus: Adicionar login com um clique com o Google no WordPress

Embora o login com um número de telefone e OTP seja uma opção segura, alguns usuários preferem uma maneira ainda mais rápida de acessar suas contas.

A adição do login com um clique do Google permite que os usuários façam login instantaneamente sem digitar um número de telefone ou esperar por uma OTP. Ignorar o formulário de login do WordPress dessa forma pode melhorar a experiência do usuário, reduzir o atrito do login e aumentar as inscrições.

É especialmente útil para sites com visitantes frequentes, como plataformas de associação, lojas on-line ou comunidades.

Você pode adicionar facilmente esse recurso usando o plug-in Nextend Social Login. Ele permite que os usuários façam login com sua conta do Google e até mesmo suporta logins do Facebook e do Twitter.

O Nextend também permite vincular perfis sociais a contas existentes, para que os usuários que retornam não criem duplicatas.

Para começar, basta ver nosso tutorial sobre como adicionar o login com um clique com o Google no WordPress.

Espero que este artigo tenha ajudado você a aprender como adicionar login com número de telefone via OTP no WordPress. Talvez você também queira ver nosso guia para iniciantes sobre como remover a opção de redefinição/alteração de senha do WordPress e nosso tutorial sobre como criar um modal pop-up de login no WordPress.

Se você gostou deste artigo, inscreva-se em nosso canal do YouTube para receber tutoriais em vídeo sobre o WordPress. Você também pode nos encontrar no Twitter e no Facebook.