Pular para o conteúdo
  • Sobre
  • Mapa do Site
  • Contato
Tudo Para WordPress
  • Dicas
  • Plugins WP
    • Advanced Custom Fields
    • Elementor
  • Glossário
  • SEO
  • + Notícias
Tudo Para WordPress

Inicial » Dicas WordPress

Customizando a página de login de seu WordPress

  • Guga Alves Guga Alves
  • 21 de fevereiro de 2020
  • 1
wp admin login 1

Muitos procuram como personalizar as páginas de login do WordPress, e isso é possível com um pouco de CSS e uma função para adicionar tal CSS nas páginas corretas. São apenas alguns passos, vamos a eles!

1 – Se o tema não foi desenvolvido por você, primeiro crie um tema filho (Como criar um tema filho? Leia em https://codex.wordpress.org/Child_Themes ), caso contrário as modificações serão perdidas ao atualizar seu tema.


2 – Crie um arquivo CSS no seu tema / tema filho (melhor se você criar uma pasta para adicionar CSS lá).


3 – Adicione o seguinte trecho no seu arquivo functions.php:

function tpw_enqueue_admin_style() {
        echo '<link rel="stylesheet" type="text/css" href="' . get_stylesheet_directory_uri() . '/css/admin/custom-login-styles.css" />';
}

add_action('login_head', 'tpw_enqueue_admin_style');

4 – Observe que ‘/css/custom-login-styles.css’ deve ter o caminho correto para o arquivo CSS. Portanto, como exemplo, se você adicionou o arquivo CSS em /theme-name/assets/css/custom-login-styles.css, seu código deve ser ‘/assets/css/custom-login-styles.css’


5 – Feito isso, você pode criar CSS para alterar as páginas de login, recuperação de senha e cadastro no site.

Fiz isso em um projeto recente e compartilhei o CSS utilizado em meu Gist, área no Github onde podemos compartilhar dicas de programação, e você pode ver o código utilizado em https://gist.github.com/gugaalves/45675011e7cf01e4386420834091a02b

Abaixo, deixo algumas imagens do resultado de tal código no projeto que personalizei.

wp admin login 1
wp admin lost password
wp admin register
Compartilhe o artigo com um colega!
Imagem padrão
Guga Alves

Analista de Sistemas, Pós graduado em Marketing Digital e idealizador dos sites Tudo Para WordPress e Remotamente.
Possuo sólidos conhecimento de SEO, já trabalhei no maior projeto feito com WordPress no mundo, o WordPress.com e palestrei em diversos eventos como Campus Party e WordCamp Porto Alegre, São Paulo, Florianópolis, Fortaleza e Belo Horizonte.
Organizador do WordCamp Rio de Janeiro 2014 e 2015.

Artigos: 274
Post anterior Como adicionar CSS personalizado no painel administrativo do WordPress
Próximo Post Comparativo: 6 Plugins de otimização de imagens

Um comentário

  1. Luiza

    Luiza

    27 de junho de 2020 / 21:46 Responder

    Que matéria bacana!!!”Super elucidativa, completa, objetiva, esclarecedora, comprometida com o tema. Gratidão pela ótima prestação de serviço.

Deixar uma respostaCancelar resposta

Posts Recentes

  • Como baixar versões antigas de plugins no repositório oficial?
  • webp
    WordPress 5.8 adiciona suporte a imagens WebP
  • WordPress filters – Lista completa de filtros!
    Um comentário
  • 10 melhores plugins de Live chats para sites WordPress
  • Review: Elementor Page Builder

Glossário WordPress

  • White Label
  • Actions / ações
  • Breadcrumbs
  • Painel administrativo (wp-admin)
  • Backlinks

Posts relacionados

Como baixar versões antigas de plugins no repositório oficial?

  • 16 de setembro de 2021

WordPress filters – Lista completa de filtros!

  • 5 de março de 2020
  • Um comentário

Como adicionar CSS personalizado no painel administrativo do WordPress

  • 14 de fevereiro de 2020
  • Contato
  • Glossário
  • Mapa do Site
  • Sobre
Copyright © 2022 - WordPress Theme by Guga Alves