Você quer saber como criar uma página de login com Elementor ?
No WordPress, você pode ir em seudominio.com/wp-login.php para ir para a página de login do seu site. Se você tem um grande site com vários autores / usuários, convém criar uma página de login personalizada com seu próprio design para reforçar a identidade da marca do seu site.
Com Elementor, você pode criar uma página de login personalizada para o seu site WordPress sem esforço - sem codificar ou instalar plugins adicionais.
Elementor tem um widget – o widget Login – que você pode usar para criar uma página de login personalizada. Elementor ainda oferece modelos de página de login para que você possa criar uma página de login rapidamente.
Como criar uma página de login WordPress personalizada com Elementor
Observe que o widget Login está disponível apenas no Elementor Pro. Portanto, antes de criar uma página de login personalizada, você precisa atualizar o Elementor para a versão profissional.
1. Como criar uma página de login a partir de um modelo
Como mencionado antes, Elementor oferece modelos para permitir que você crie uma página de login personalizada rapidamente. Para usar um, comece criando uma nova página (Páginas -> Adicionar) E modifique-o com Elementor.
No editor Elementor, clique no ícone da pasta para abrir a biblioteca de modelos.
Procure um modelo de página de login personalizado. Você pode usar a caixa de pesquisa para facilitar o seu trabalho. Depois de encontrar o modelo de sua preferência, passe o mouse sobre ele e clique no botão INSERIR.
Espere um momento até que o Elementor termine de carregar o modelo. Assim que o modelo for carregado, você pode clicar em publicar para publicá-lo.
Voilà.
Para visualizar a página, você pode clicar no ícone de três linhas no canto superior do painel esquerdo e selecionar Mostrar página.
E aqui está o resultado final se você escolheu o mesmo modelo que nós.
2. Como criar uma página de login personalizada do zero
Se você deseja ter seu próprio design de página de login, também pode criar uma página de login personalizada do zero. Para começar, crie uma nova página e edite-a com Elementor.
No editor Elementor, adicione uma nova seção clicando no ícone de adição. Você pode selecionar uma estrutura de coluna com base no design que deseja criar.
Quando sua seção estiver pronta, adicione o widget Conexão arrastando-o do painel esquerdo para a área da tela.
Vá para a guia Conteúdo no painel esquerdo para definir as opções básicas. Existem 3 blocos de opções que você pode manipular:
1. Campos do formulário
Você pode abrir este bloco para habilitar / desabilitar a tag e definir o tamanho da entrada.
2. Botão
Você pode abrir este bloco para definir o texto e o tamanho do botão e seu alinhamento.
3. Opções Adicionais
Você pode abrir este bloco para habilitar / desabilitar elementos da sua página de login, como o link MSenha perdida e a opção Lembre de mim. Já que você deseja criar uma página de login, ativar a opção Redirecionar após o login e cole o url do painel do WordPress (seudominio.com/wp-admin) no campo disponível. Você também pode ativar a opção Redirecionar após o logout se desejar.
Você pode ativar a opção Etiqueta personalizada se você quiser usar rótulos personalizados e espaços reservados personalizados em seu formulário conexão.
Uma vez o definição opções básicas concluídas, vá para a guia Estilo para personalizar o formulário conexão. Existem 5 blocos de opções de estilo disponíveis:
1. Formato
Você pode abrir este bloco para definir o espaço entre as linhas, a cor dos links e a cor do apontamento dos links.
2. Rótulo
Você só pode ver este bloco se ativar o rótulo de formulário. Você pode abrir este bloco para definir o espaçamento entre os rótulos do formulário, a cor do texto e a tipografia (família da fonte, tamanho da fonte, estilo da fonte, etc.).
3. Campos
Você pode abrir este bloco para definir a cor dos campos de texto, a tipografia (família da fonte, tamanho da fonte, estilo da fonte, etc.), o fundo do controle, a cor da borda do controle, a largura da borda do campo e o raio da borda do campo.
4. Botão
Você pode abrir este bloco para personalizar o botão de login. Você pode definir coisas como cor do texto do botão, cor do texto flutuante, tipografia, cor de fundo do botão, raio da borda e preenchimento do texto do botão.
5. Mensagem de login
Você pode abrir este bloco para personalizar a mensagem depois que seus usuários estiverem logados. Aqui está a mensagem:
Você pode definir a cor do texto e a tipografia da mensagem.
Depois de terminar de estilizar o widget Login, você pode personalizar outros widgets em sua página. Quando a edição da página estiver concluída, publique / atualize sua página e você terá criado com êxito a página de login personalizada.
Leia também: Como exportar e importar modelos Elementor
Uma coisa crucial a se observar. Depois de criar a página de login personalizada, não exclua o arquivo wp-login.php no seu site WordPress. Seu site WordPress ainda precisa desse arquivo para lidar com o processo de login.
Obtenha o Elementor Pro agora!
Conclusão
Aqui está ! É isso neste artigo que mostra como criar uma página de login com Elementor. Se você tiver alguma dúvida sobre como chegar lá fdeixe-nos saber no Comentários.
No entanto, você também pode consultar nossos recursos, se você precisar de mais elementos para realizar seus projetos de criação de sites da Internet, consultando nosso guia no site Criação de blog WordPress ou aquele em Divi: o melhor tema WordPress de todos os tempos.
Mas enquanto isso, compartilhe este artigo em suas diferentes redes sociais.
...
