Si tienes un sitio web de WordPress, es importante personalizar la pantalla de login para que los usuarios tengan una experiencia consistente con tu marca. Una forma de hacerlo es cambiando el logo predeterminado de WordPress por tu propio logotipo.
En este artículo, te mostraremos cómo hacerlo con un código simple. Pero antes de empezar, asegúrate de tener acceso al archivo functions.php en tu tema activo de WordPress. Además, te recomendamos hacer una copia de seguridad del archivo antes de hacer cualquier cambio.
Para cambiar el logo de la pantalla de login en WordPress, sigue estos pasos:
- Crea tu logotipo: lo primero que debes hacer es crear el logotipo que deseas mostrar en la pantalla de login. Asegúrate de que tenga una altura de 65 píxeles y una anchura de 320 píxeles.
- Sube el logotipo a tu sitio web: sube el logotipo a tu sitio web en la carpeta de imágenes de tu tema activo de WordPress. Asegúrate de recordar la ubicación de la imagen, ya que la necesitarás en el código.
- Agrega el código: copia y pega el siguiente código en el archivo functions.php de tu tema activo de WordPress.
function my_login_logo() { ?>
<style type="text/css">
#login h1 a, .login h1 a {
background-image: url(<?php echo get_stylesheet_directory_uri(); ?>/images/logo-nuevo.png);
height:65px;
width:320px;
background-size: 320px 85px;
background-repeat: no-repeat;
padding-bottom: 30px;
}
body.login {
background-color: #e4e5fe !important;
}
</style>
<?php }
add_action( 'login_enqueue_scripts', 'my_login_logo' );
- Personaliza el código: en el código anterior, cambia el nombre de la imagen «logo-nuevo.png» por el nombre de tu propio logotipo y la ubicación de la carpeta de imágenes de tu tema activo de WordPress.
- Guarda los cambios: guarda los cambios en el archivo functions.php y actualiza la página de login para ver tu nuevo logotipo.
Con este código, has logrado personalizar la pantalla de login de tu sitio web de WordPress con tu propio logotipo. Pero si deseas hacer más personalizaciones, como cambiar el fondo o los colores del formulario de login, puedes seguir explorando y modificando el código.
Esperamos que esta guía haya sido útil para ti. Si tienes alguna pregunta o sugerencia, no dudes en dejar un comentario a continuación. ¡Nos encantaría saber cómo te fue!
