Como personalizar a página de redefinição de senha do WordPress

Imagine um usuário tentando redefinir a senha em seu site do WordPress e sendo recebido por um formulário genérico que não se parece em nada com o seu site com design bonito. Isso pode ser confuso para os visitantes, especialmente se você tiver um site em que as pessoas se tornam membros ou fazem login com frequência.

Trabalhamos com muitos sites ao longo dos anos. Vimos como fazer com que a página de redefinição de senha se pareça com o restante do site ajuda os usuários e faz com que eles se sintam mais confortáveis quando precisam alterar a senha.

Neste artigo, mostraremos como alterar a aparência da página de redefinição de senha do WordPress, criando uma experiência consistente e visualmente atraente que tranquiliza os usuários.

Por que personalizar a página de redefinição de senha no WordPress?

Seu site WordPress vem com um sistema avançado de gerenciamento de usuários que permite que as pessoas criem uma conta de usuário, façam login e redefinam a senha.

Essas páginas mostram a marca e o logotipo do WordPress por padrão. Às vezes, isso não é um grande problema, especialmente se você ou sua equipe forem as únicas pessoas que fazem login na área de administração.

No entanto, se você estiver administrando uma loja de comércio eletrônico ou um site de associação, seus clientes também precisarão fazer login.

É possível proporcionar uma experiência muito melhor ao usuário personalizando essas páginas para que correspondam ao design e à marca do seu site. Se desejar, você também pode adicionar conteúdo extra, como seu logotipo ou uma lista de publicações recentes.

Você já deve ter seguido nossos outros guias sobre como adicionar um formulário de registro de usuário personalizado e uma página de login.

Agora, vamos dar uma olhada em como personalizar a página de redefinição de senha. Basta usar os links rápidos abaixo para ir direto ao método que você deseja usar:

Método 1: Personalizar a página de redefinição de senha usando formulários formidáveis (fácil)

A maneira mais fácil de substituir a página de redefinição de senha do WordPress é usar o Formidable Forms. Esse plug-in permite que você substitua a página padrão de redefinição de senha usando um shortcode.

Esse método não permite que você edite o formulário de redefinição de senha, mas você pode adicionar seu próprio conteúdo ao redor dele. Por exemplo, você pode adicionar texto, imagens e outros conteúdos usando o editor de posts padrão do WordPress.

Primeiro, você precisa instalar o plug-in Formidable Forms. Para saber mais, consulte nosso guia passo a passo sobre como instalar um plug-in do WordPress.

Após a ativação, você também precisará instalar o Formidable Forms Lite. Esse plug-in gratuito fornece a base principal para os recursos mais avançados do plug-in premium.

Depois de fazer isso, vá para a página Formidable Forms ” Global Settings (Configurações globais ) em seu painel e selecione ‘Click to enter a license key manually’ (Clique para inserir uma chave de licença manualmente).

Você pode encontrar a chave de licença em sua conta no site da Formidable Forms. Depois de inserir essas informações, clique no botão ‘Save License’.

Em seguida, você deve instalar o complemento User Registration (Registro de usuário) acessando Formidable ” Add-Ons. Nessa tela, localize o complemento User Registration e clique no botão “Install” (Instalar).

Agora você está pronto para criar uma página personalizada de redefinição de senha acessando Pages ” Add New.

Para começar, dê um título à página e clique no botão +. Na janela pop-up que aparece, comece a digitar “Shortcode”.

Basta clicar no bloco certo para adicioná-lo à página.

Agora você pode adicionar o seguinte shortcode: [frm-reset-password].

Nesse ponto, você pode adicionar qualquer outro conteúdo que queira exibir na página de redefinição de senha.

Quando você estiver satisfeito com o layout da página, clique no botão “Publish” (Publicar) para torná-la ativa.

Por fim, você precisa informar ao WordPress para usar essa página em vez da página padrão de redefinição de senha. Para fazer isso, vá até Formidable ” Global Settings e clique na guia “Registration” (Registro) no menu.

A partir daí, abra o menu suspenso “Reset Password Page” (Redefinir página de senha) e escolha a página que você acabou de criar.

Não se esqueça de clicar no botão “Update” (Atualizar) na parte superior da tela para armazenar suas configurações.

Agora você pode visitar seu site do WordPress para ver a página personalizada de redefinição de senha em ação.

Método 2: Personalizar todas as páginas de associação usando ‘Theme My Login’ (gratuito)

Para proporcionar uma experiência consistente ao usuário, é uma boa ideia usar o mesmo estilo em todas as suas páginas de associação. Theme My Login é um plug-in gratuito que permite substituir as páginas integradas do painel do WordPress, de login, logout, registro, esqueci a senha e redefinição de senha.

Não é a solução mais personalizável, mas todas as suas páginas usarão seu tema do WordPress.

A primeira coisa que você precisa fazer é instalar e ativar o plug-in Theme My Login. Para obter mais detalhes, consulte nosso guia passo a passo sobre como instalar um plug-in do WordPress.

Após a ativação, o Theme My Login cria automaticamente URLs para suas telas personalizadas de login, logout, registro, perda de senha e redefinição de senha. Você pode ver esses URLs acessando a página Theme My Login ” General.

Para substituir qualquer uma dessas páginas, basta criar uma nova página com esse mesmo URL.

Para criar uma página de redefinição de senha personalizada do WordPress, vá para Página ” Adicionar novo. Aqui, clique no ícone “+” e comece a digitar “Shortcode”.

Quando o bloco certo aparecer, clique nele para adicioná-lo à página.

Dentro do bloco, adicione o seguinte shortcode:

[theme-my-login action="lostpassword"]

Agora você pode adicionar qualquer conteúdo extra que queira mostrar na página de redefinição de senha, como o seu logotipo. Quando estiver satisfeito com a configuração da página, clique em “Salvar rascunho”.

Depois disso, vá para Pages ” All Pages e localize a página de redefinição de senha que você acabou de criar.

Basta passar o mouse sobre a página e clicar no botão “Quick Edit” quando ele aparecer.

No campo “Slug”, digite “lostpassword”.

Depois disso, abra o menu suspenso “Status” e selecione “Published” (Publicado).

Feito isso, vá em frente e clique em “Update” (Atualizar). Agora, se você visitar seu blog do WordPress, verá a página de senha perdida ativa.

Para substituir as outras páginas de associação incorporadas do WordPress, basta seguir as etapas descritas acima, mas certifique-se de usar o slug de URL e o shortcode corretos.

Por exemplo, se você quiser criar uma página personalizada de redefinição de senha, precisará usar o shortcode [theme-my-login action="resetpass"]. Você também precisará alterar o “URL slug” para resetpassword.

Método 3: Criar uma página de redefinição de senha usando WPForms (totalmente personalizável)

Se você quiser substituir a página padrão de redefinição de senha por um formulário totalmente personalizado, recomendamos o uso do WPForms.

Esse plug-in tem um modelo de “Formulário de redefinição de senha do usuário” que você pode personalizar com seu próprio texto, imagens e marca. Você pode até mesmo adicionar e remover campos para coletar exatamente as informações que deseja dos membros.

A primeira coisa que você precisa fazer é instalar e ativar o plug-in WPForms. Para obter mais detalhes, consulte nosso guia passo a passo sobre como instalar um plug-in do WordPress.

Após a ativação, vá para WPForms ” Configurações e insira sua chave de licença. Você pode encontrar essas informações em sua conta no site do WPForms.

Depois de inserir a chave de licença, você precisará instalar o complemento User Registration, que permite criar formulários personalizados de registro de usuário, redefinição de senha e login para o seu site.

No painel, vá para WPForms ” Addons e encontre o User Registration Addon.

Basta clicar em “Install Addon” (Instalar complemento) para fazer o download e, em seguida, clicar em “Activate” (Ativar) para ativá-lo.

Agora você está pronto para criar seu próprio formulário personalizado de redefinição de senha, acessando a página WPForms ” Add New. Aqui, digite um título para o novo formulário.

Feito isso, role até o modelo “User Password Reset Form” (Formulário de redefinição de senha do usuário) e clique no botão “Use Template” (Usar modelo).

O WPForms agora carregará o modelo User Password Reset Form.

Para personalizar qualquer campo com seu próprio texto, rótulo ou descrição, basta clicar para selecioná-lo e, em seguida, usar as configurações no menu à esquerda.

Por exemplo, o modelo tem um botão “Enviar”. Para mostrar um rótulo de botão diferente, basta clicar para selecionar o campo e, em seguida, digitar uma nova mensagem em ‘Submit Button Text’.

Você também pode alterar o que acontece quando um usuário envia sua solicitação de redefinição de senha, acessando Settings ” Confirmations.

Aqui, abra o menu suspenso “Confirmation Type” (Tipo de confirmação) e escolha se deseja redirecionar o usuário para uma página ou URL diferente ou simplesmente mostrar uma mensagem pedindo que ele verifique se há um e-mail de redefinição de senha na caixa de entrada.

Você também pode personalizar a mensagem digitando-a no pequeno editor de texto. Por exemplo, você pode lembrar os usuários de verificar suas pastas de spam.

Quando estiver satisfeito com a configuração do formulário, clique no botão “Save” (Salvar) no canto superior direito da tela.

Para substituir a página padrão de redefinição de senha do WordPress, crie uma página com o slug ‘uma senha’. Em seguida, adicione o formulário a essa página.

A maneira mais fácil de fazer isso é clicar no botão “Incorporar” no editor do WPForms e selecionar “Criar nova página”.

Agora, digite um título para a nova página. Você alterará o slug em uma etapa posterior, portanto, pode usar o que quiser.

Feito isso, clique em “Let’s Go”.

Isso o levará ao editor de páginas do WordPress, onde o formulário já foi adicionado à nova página. Agora você pode fazer qualquer alteração nessa página, como adicionar mais texto, um logotipo personalizado ou categorias e tags.

Quando estiver satisfeito com a aparência da página, clique no botão “Salvar rascunho”.

Depois disso, vá para Pages ” All Pages e localize a página de redefinição de senha que você acabou de criar.

Aqui, clique no botão “Quick Edit” (Edição rápida).

No campo “Slug”, digite “lostpassword”.

Depois disso, abra o menu suspenso “Status” e selecione “Published” (Publicado).

Agora, você precisa redirecionar os visitantes para a página personalizada de redefinição de senha em vez da página integrada do WordPress. A maneira mais fácil de fazer isso é usar o plug-in gratuito WPCode.

O WPCode é o melhor plug-in de snippets de código usado por mais de 2 milhões de sites do WordPress. Ele facilita a adição de código personalizado no WordPress sem a necessidade de editar o arquivo functions.php.

Com o WPCode, até mesmo os iniciantes podem editar o código de seus sites sem correr o risco de cometer erros e erros de digitação que podem causar muitos erros comuns do WordPress.

A primeira coisa que você precisa fazer é instalar e ativar o plug-in gratuito WPCode. Para obter mais detalhes, consulte nosso guia passo a passo sobre como instalar um plug-in do WordPress.

Após a ativação, vá para Code Snippets ” Add Snippet.

Aqui, você encontrará snippets prontos que permitem fazer upload de tipos de arquivos adicionais para o WordPress, desativar páginas de anexos, desativar completamente os comentários e muito mais.

Basta passar o mouse sobre “Add Your Custom Code” e clicar em “Use snippet” quando ele aparecer.

Para começar, digite um título para o snippet de código personalizado. Pode ser qualquer coisa que ajude você a identificar o snippet no painel do WordPress.

Depois disso, abra a lista suspensa “Code Type” (Tipo de código) e selecione “PHP Snippet”.

No editor de código, adicione o seguinte trecho de código:

add_filter( 'lostpassword_url', 'my_lostpassword_url' );
function my_lostpassword_url() {
return site_url('/lostpassword/');
}

Em seguida, role até a seção “Inserção”. O WPCode pode adicionar códigos em diferentes locais, como após cada publicação, somente no frontend ou somente no admin.

Para usar o código PHP personalizado em todo o seu site, blog ou loja WooCommerce, clique em “Auto Insert” (Inserção automática) se ainda não estiver selecionado. Em seguida, abra o menu suspenso “Location” (Local) e escolha “Run Everywhere” (Executar em todos os lugares).

Depois disso, você está pronto para rolar até a parte superior da tela e clicar no botão de alternância “Inactive” (Inativo) para alterá-lo para “Active” (Ativo).

Por fim, clique em “Save Snippet” (Salvar snippet) para ativar o snippet PHP.

Agora, tente visitar a tela de login integrada do WordPress.

Se você clicar no link “Perdeu sua senha?”, será redirecionado para a página personalizada de redefinição de senha que acabou de criar.

Dependendo da configuração do seu site, talvez seja necessário atualizar os links de redefinição de senha em outras páginas.

Se você criou uma página de login personalizada para o WordPress usando um plug-in como o WPForms, também recomendamos adicionar o novo link de redefinição de senha a esse formulário.

Guias especializados sobre a personalização de páginas do WordPress

Esperamos que este tutorial tenha ajudado você a aprender como personalizar a página de redefinição de senha do WordPress. Talvez você também queira ver alguns tutoriais sobre como melhorar a segurança do login do WordPress:

• Como criar uma página de login personalizada no WordPress (guia definitivo)
• Como e por que você deve limitar as tentativas de login no WordPress
• Como adicionar perguntas de segurança à tela de login do WordPress
• Como adicionar um URL de login personalizado no WordPress (passo a passo)
• Dicas vitais para proteger sua área de administração do 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.