Tudo sobre iCloud e outros servidores de armazenamento na nuvem, Cloud Computing, hospedagem de sites, servidores dedicados, VPS

Como mudar o logo da página WP Login

Mude a imagem de logotipo do Wordpress na página Login

O WordPress fornece seu próprio logotipo na inscrição de administrador, ou na página de login. Mass às vezes é necessário substituí-lo por um logotipo próprio, especialmente para mostrar sua marca. Você pode substituí-lo totalmente com sua própria imagem em apenas alguns segundos, inserindo alguns códigos no arquivo functions.php e automaticamente muda a página de registro, também.

É assim que a página de login do WordPress normalmente parece:

Personalizando o Formulário de Login

Como você já sabe, o formulário de Login é a sua porta de entrada para usar e configurar a plataforma de administração do WordPress. Seu login, o login dos assinantes e outros colaboradores do site entram por ele. Por outro lado, muitos temas tem seu próprio formato, ou um plugin para fazer o login. Então você não precisa fazer estas alterações, se não forem necessitárias.

Personalizar, ou mudar o logo da página WP Login

  • Se você instalou o WordPress no diretório-raiz do seu site, sua página de login é:

http://example.com/wp-login.php

  • Se você instalou o WordPress em seu próprio subdiretório, por exemplo, / directory , sua página de login é:

http://example.com/directory/wp-login.php

Se você tiver um problema de login, tente as sugestões de problemas de login .

O formulário de login e de cadastro

No topo da página de login e de cadastro estão o logotipo e o link do WordPress, seguido pelo formulário de login.

Então acesse o arquivo functions.php pelo editor no painel Admin, ou use um programa de FTP. Este arquivo geralmente se encontra na pasta do tema /wp-contente/themes/seu-tema/functions.php

Adicione este código, para mudar o logo da página WP Login.

function my_login_logo() { ?>
<style type="text/css">
#login h1 a, .login h1 a {
background-image: url(<?php echo get_stylesheet_directory_uri(); ?>/images/nome-da-imagem.png);
background-repeat: no-repeat;
}
</style>
<?php }

add_action( 'login_enqueue_scripts', 'my_login_logo' );

Aqui dentro do estilo abaixo de background-repeat: no-repeat; você ainda pode especificar tamanho da imagem, borda, etc.

Alterando o link do WordPress para o seu site:

Agora que você já fez a alteração no logotipo, é possível que o link da imagem esteja redirecionando para o site https://wordpress.org e isso você não deseja que continue.

Na mesma página functions.php é possível adicionar o seguinte código e alterar o redirecionamento do link para sua URL.

Adicione este código

//função muda URL do logo em wp-login
function my_login_logo_url() {
return get_bloginfo( 'url' );
}
add_filter( 'login_headerurl', 'my_login_logo_url' );
function my_login_logo_url_title() {
return 'Título do site';
}
add_filter( 'login_headertitle', 'my_login_logo_url_title' );

Pronto, agora seus usuários podem clicar no logotipo e serão redirecionados para a home do seu site.

Você já aprendeu, como mudar o logo da página WP Login e o link do logotipo. No entanto, ainda pode personalizar com mais CSS adicionando um arquivo .css no diretório do tema.

<link rel="stylesheet" type="text/css" href="caminho-do-tema-mais-arquivo.css"/>

Este link pode ser adicionado, onde você desejar, no arquivo header, no arquivo footer, ou então adicionar dentro do do arquivo functions.php com esta função:

//Login Stylesheet eu adicionei isso - customiza wp-login
function custom_login_css() {
echo '<link rel="stylesheet" type="text/css" href="'.get_stylesheet_directory_uri().'/style-login.css?v=2.1"/>';
}
add_action('login_head', 'custom_login_css');

É claro que você deve trocar style-login.css pelo nome do arquivo e tudo pode funcionar bem. Contudo, alguns temas podem não ter as mesmas configurações e provavelmente isso não funcionará.

Em conclusão: você deve fazer backup dos arquivos que vai editar, antes da edição. Certifique-se de ter estes backups porque se estiver usando o editor WordPress não será possível desfazer a ação.

Deixe um Comentário

avatar
  Subscrever  
Notificar