Como alterar facilmente o logótipo de início de sessão no WordPress

Personalize seu logotipo de login do WordPress no AlexHost VPS

Por que trocar o logotipo de login do WordPress? Trocar o logotipo padrão do WordPress por um personalizado aumenta a presença da sua marca na página de login, criando um visual profissional e coeso. Hospedado no VPS de alto desempenho da AlexHost com acesso à raiz e velocidade SSD, seu site WordPress pode exibir esse ajuste sem esforço. Este guia abrange três métodos – plugin, código manual e CSS personalizado – para alterar o logótipo de início de sessão, garantindo uma configuração perfeita e segura.

Método 1: Usando um plug-in (maneira fácil)

A maneira mais simples e fácil de alterar o logotipo de login do WordPress é usando um plugin. Os plugins oferecem uma solução fácil e sem código para iniciantes

Passo 1: Instalar e ativar o plugin

Inicie sessão no seu painel de controlo do WordPress.
Navegue até Plugins > Adicionar novo.
Na barra de pesquisa, digite “LoginPress” ou “Custom Login Page Customizer” (dois plugins populares para esta tarefa).
Clique em Instalar agora e depois em Ativar o plugin.

Passo 2: Personalizar o logótipo de início de sessão

Depois de ativar o plugin, vá a LoginPress > Customizer ou navegue até Appearance > Login Customizer.
No personalizador, verá opções para alterar o logótipo de início de sessão.
Clique na secção Logótipo de início de sessão e carregue o seu logótipo personalizado, clicando no botão Selecionar imagem.
Ajuste o tamanho, o preenchimento ou o alinhamento do logótipo, se necessário.
Quando estiver satisfeito com as alterações, clique em Publicar para aplicar o novo logótipo de início de sessão ao seu site.

E pronto! O seu logótipo personalizado aparecerá agora na sua página de início de sessão do WordPress

Método 2: Alterar manualmente o logótipo de início de sessão através de código (utilizadores avançados)

Se preferir não utilizar um plugin, pode alterar o logótipo de início de sessão manualmente, adicionando código personalizado ao ficheiro functions.php do seu tema

Passo 1: Aceder ao ficheiro functions.php

No seu painel de controlo do WordPress, aceda a Aparência > Editor de ficheiros de tema.
Na secção Ficheiros de tema, encontre o ficheiro functions.php e clique nele para o abrir.
Importante: É sempre uma boa ideia criar um tema filho ou fazer uma cópia de segurança do seu site antes de editar ficheiros de tema.

Passo 2: Adicionar código personalizado

Para substituir o logótipo predefinido do WordPress pelo seu próprio logótipo, adicione o seguinte código ao ficheiro functions.php do seu tema

// Função para alterar o logotipo de login do WordPress function custom_login_logo() { ?> <style type=”text/css”> #login h1 a { background-image: url(‘<?php echo get_stylesheet_directory_uri(); ?>/images/custom-logo.png’); background-size: contain; width: 100%; height: 80px; /* Ajustar a altura com base no seu logótipo */ } </style> <?php } add_action( ‘login_enqueue_scripts’, ‘custom_login_logo’ );

Etapa 3: Carregar seu logotipo personalizado

Carregue o seu logótipo personalizado para a pasta do seu tema
- Utilizando um cliente FTP ou o gestor de ficheiros do fornecedor de alojamento, carregue o seu logótipo (por exemplo, custom-logo.png) para o diretório /wp-content/themes/your-theme/images/.
Certifique-se de que ajusta o caminho do ficheiro no código (/images/custom-logo.png), se necessário.

Passo 4: Guardar alterações

Depois de adicionar o código, clique em Atualizar arquivo para salvar suas alterações. Sua página de login do WordPress deve agora exibir seu logotipo personalizado em vez do logotipo padrão do WordPress

Método 3: Usar um plug-in CSS personalizado

Se não quiser editar o ficheiro functions.php do seu tema, mas ainda preferir uma abordagem de código personalizado, pode utilizar um plug-in CSS personalizado para obter o mesmo efeito

Passo 1: Instalar um plug-in CSS personalizado

Vá para Plugins > Adicionar novo.
Procure Simple Custom CSS ou qualquer outro plugin semelhante que lhe permita adicionar CSS personalizado.
Instale e active o plugin.

Passo 2: Adicionar CSS personalizado para o logótipo de início de sessão

Após a ativação, vá a Appearance > Custom CSS.
Adicione o seguinte código CSS:

#login h1 a { background-image: url(‘https://yourdomain.com/path-to-your-logo.png’); background-size: contain; width: 100%; height: 80px; /* Ajuste a altura com base no tamanho do seu logótipo */ }

Substitua https://yourdomain.com/path-to-your-logo.png pelo URL direto da imagem do seu logótipo personalizado.
Clique em Salvar ou Publicar para aplicar as alterações.

O seu logótipo personalizado aparecerá agora na página de início de sessão

Práticas recomendadas para logótipos de início de sessão personalizados

Tamanho ideal do logótipo: Utilize um tamanho de logótipo que se adapte bem à página de início de sessão, normalmente cerca de 250 x 80 pixels. Pode ajustar a altura e a largura nas definições do código ou do plug-in, conforme necessário.
Fundo transparente: Se o seu logótipo tiver uma cor de fundo, considere a utilização de um PNG transparente para o misturar com o fundo da página.
Design responsivo: Certifique-se de que o seu logótipo de início de sessão fica bem em dispositivos móveis e de secretária, utilizando CSS responsivo ou plug-ins que suportam personalização móvel.

Conclusão

Alterar o logotipo de login do WordPress é uma maneira fácil e eficaz de personalizar a aparência do seu site e melhorar a identidade da sua marca. Quer escolha o método de plug-in para simplificar ou o método de codificação manual para ter mais controlo, pode substituir rapidamente o logótipo predefinido do WordPress por um personalizado que reflicta o seu estilo ou a marca da sua empresa