Como fazer uma página de login personalizada do WordPress (o jeito fácil)

Publicados: 2020-12-11

Você deseja criar uma página de login personalizada para o seu site WordPress? Ter uma página de login personalizada é uma ótima maneira de substituir o login WordPress genérico e adicionar sua própria marca.

Neste artigo, mostraremos a maneira fácil de criar uma página de login totalmente personalizada para o seu site comercial.

Crie seu formulário de login personalizado agora

Por que criar uma página de login personalizada no WordPress?

Todos os sites WordPress têm a mesma página de login. É um formulário de login simples com o logotipo do WordPress acima dele.

Página de login padrão do WordPress

Esta página é genérica, por isso é difícil dizer em qual site você está realmente acessando. O logotipo do WordPress também tem um link para WordPress.org, o que pode tirar os usuários do seu site se eles clicarem nele.

WPForms é o melhor plugin do WordPress Form Builder. Obtenha gratuitamente!

Se você criar uma nova página de login para seu site, poderá usá-la para:

  • Promoções
  • Notificações
  • E mais.

No WPForms, usamos o espaço extra em nossa página de login personalizada para informar aos usuários sobre novos recursos interessantes.

Página de login personalizada do WPForms

É muito fácil criar uma página de login personalizada e também pode ajudar na segurança do seu site. Ao criar uma página de login personalizada, você pode ocultar a página padrão para reduzir o spam de login e manter seu site WordPress seguro.

Agora que sabemos por que você precisa de uma página de login personalizada, vamos criar uma para o seu site.

Como fazer uma página de login personalizada do WordPress

Usaremos WPForms para criar um formulário de login totalmente personalizado para o seu site. Em seguida, mostraremos como criar sua página de login personalizada.

  1. Instale o plug-in WPForms
  2. Crie seu formulário de login WordPress personalizado
  3. Adicione um link Esqueci minha senha ao seu formulário de login personalizado
  4. Personalize as configurações do formulário de login personalizado
  5. Publique sua página de login personalizada

OK, vamos começar instalando o plugin de página de login customizado.

Etapa 1: instalar o plug-in WPForms

A primeira coisa que você precisa fazer é instalar e ativar o plugin WPForms. Para obter mais detalhes, consulte este guia passo a passo sobre como instalar um plugin no WordPress.

Para fazer um formulário de login, você precisará do WPForms Pro ou superior.

Depois de instalar o WPForms, vá para WPForms »Addons .

Menu de complementos WPForms

Role para baixo até encontrar o complemento de registro do usuário . Clique no botão para instalá-lo.

Complemento de registro de usuário

Se desejar, você pode restringir o acesso ao WordPress enquanto cria seu novo formulário de login. Para saber como fazer isso, verifique nosso guia sobre como ocultar seu site WordPress até que ele esteja pronto.

Tudo pronto! Vamos fazer nosso novo formulário de login personalizado.

Etapa 2: crie um formulário de login WordPress personalizado

Agora que temos WPForms instalados, vamos criar um novo formulário de login para WordPress.

Clique em WPForms »Add New para começar.

Adicionar novo formulário de login personalizado

Na tela de configuração, nomeie seu formulário na parte superior.

Nomeie seu formulário de login personalizado

Agora role para baixo e selecione o modelo de Formulário de Login do Usuário .

Selecione o modelo de formulário de login personalizado

Você verá o formulário aberto no construtor de formulários. O formulário de login personalizado já está configurado, portanto, não precisamos adicionar nenhum campo.

Modelo de formulário de login personalizado

Agora vamos adicionar um link para que os usuários possam recuperar facilmente suas senhas.

Etapa 3: Adicionar um link Esqueci minha senha ao seu formulário de login personalizado

O formulário de login parece ótimo, mas precisaremos adicionar um link de senha esquecida. Caso contrário, os visitantes que esquecerem seus dados de login ficarão presos na página de login.

Para fazer isso, vamos personalizar o campo Senha .

Vamos adicionar um link na descrição aqui para que seja exibido logo abaixo do campo. Podemos usar a tag inteligente {url_lost_password} para o link.

Clique no campo de senha para começar. Na descrição, cole em:

Forgotten your password? <a href={url_lost_password} >Click here</a> to reset it.

Link personalizado para esquecer a senha

É isso! A tag inteligente {url_lost_password} será substituída pelo link de senha esquecida quando publicarmos o formulário.

WPForms cuidará da conexão do banco de dados, então não precisamos de um plugin de login separado para lidar com isso.

Vá em frente e clique em Salvar para salvar seu formulário de login até agora.

Etapa 4: personalize as configurações do formulário de login personalizado

Nesta etapa, veremos as configurações do formulário de login. Isso nos permitirá controlar o botão no formulário e a página para a qual nossos visitantes serão redirecionados.

Comece clicando em Configurações no lado esquerdo do criador de formulários.

Configurações personalizadas do formulário de login

As configurações serão abertas na guia Geral .

Role para baixo até Enviar texto do botão e altere para Log In.

Personalize o botão de login

Também alteramos o texto de processamento do botão Enviar para que o usuário possa ver que o login está em andamento. Você pode digitar qualquer outra coisa aqui se quiser.

Abaixo disso, você notará mais algumas configurações. Você vai querer verificar se estas 3 caixas de seleção estão selecionadas:

  • Habilitar proteção anti-spam - Isso usará um token de formulário inteligente para evitar logins de bots.
  • Desative o armazenamento de informações de entrada no WordPress - Não precisamos armazenar esses envios de formulários no banco de dados do WordPress.
  • Oculte o formulário se o usuário já estiver conectado - Se um usuário já estiver conectado, seria confuso mostrar o formulário de login novamente. Essa configuração nos permite ocultá-lo facilmente.

Você pode personalizar as outras configurações, se desejar.

Personalize as configurações do formulário de login

Se você vir o antigo honeypot anti-spam aqui, vá em frente e marque a nova caixa de seleção anti-spam. O honeypot agora está obsoleto e o novo token anti-spam melhorará a proteção contra spam em seu formulário de login.

Finalmente, vamos clicar em Confirmações .

Configurações de confirmação para formulário de login personalizado

Nesta tela, podemos escolher o que acontece quando o formulário de login é enviado. Você pode fazer com que seus usuários abram o administrador do WordPress, se quiser. Para a maioria dos sites, faz sentido redirecioná-los para o pacote de front-end.

Portanto, neste exemplo, vamos redirecionar o usuário para a página inicial.

Redirecionamento de formulário de login personalizado

Excelente! Reserve um tempo para revisar as outras configurações e fazer as alterações que deseja fazer. Em seguida, clique em Salvar na parte superior do criador de formulários.

Etapa 5: Faça sua página de login personalizada

Agora estamos prontos para publicar seu novo formulário de login.

Você pode incorporar seu formulário de login personalizado em qualquer lugar do seu site, incluindo:

  • Páginas
  • Postagens
  • Na barra lateral
  • No rodapé

Vamos criar uma página de login personalizada do WordPress neste exemplo. Não faremos muitas personalizações, mas você pode dedicar mais tempo para marcar sua página antes de ir ao ar, se desejar.

Para começar, clique no botão Incorporar na parte superior do construtor de formulários.

Incorpore seu formulário de login em uma página de login personalizada

Clique em Criar nova página ...

Crie uma nova página de login personalizada

E agora dê um nome à sua página. Depois de fazer isso, clique em Vamos lá .

Crie uma página de login personalizada

Seu formulário de login personalizado está pronto para ser personalizado! Você pode adicionar branding e imagens e brincar com o layout até que fique bom.

Em seguida, basta clicar no botão Publicar para publicar sua página de login personalizada.

Publicar página de login personalizada do WordPress

É isso! Sua página de login personalizada do WordPress está ativa e pronta para uso.

Lembre-se: você precisará sair do WordPress para ver o formulário concluído! Se você estiver conectado, não verá a tela de login.

Se desejar, você pode usar um plug-in de página de destino para criar uma página de login personalizada e incorporar seu formulário de login. Isso permite que você configure facilmente uma imagem de plano de fundo e cores personalizadas.

Crie seu formulário de login personalizado agora

Próxima etapa: personalize seu formulário de registro

E aí está! Agora você sabe criar um formulário de login personalizado no WordPress. Você pode usar isso como um ponto de partida para desenvolver a marca em sua página de login.

A seguir, veja como criar um formulário de registro de usuário para o seu site. Criar um formulário de registro personalizado é uma ótima maneira de tornar seu site mais profissional.

Pronto para construir seu formulário? Comece hoje mesmo com o plug-in mais fácil de criar formulários do WordPress. O WPForms Pro inclui o complemento de registro do usuário e oferece uma garantia de devolução do dinheiro de 14 dias.

Se este artigo ajudou você, siga-nos no Facebook e Twitter para mais tutoriais e guias gratuitos do WordPress.