En este nuevo post veremos cómo cambiar el logotipo de login en WordPress sin utilizar ningún plugin, además veremos algunos cambios más a nuestra pantalla de inicio de sesión de WordPress.
El archivo en el cual estaremos trabajando será functions.php el cual podrás encontrar en la carpeta de tu tema activo.
Obtendremos algo similar a la siguiente imagen:
Cuando tengas abierto tu archivo functions.php solo será necesario que copies la siguientes líneas de código y las pegues al final de tu archivo.
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-login.png); width:100%; background-size: contain; padding-bottom: 0px; } </style> <?php } add_action( 'login_enqueue_scripts', 'my_login_logo' );
Importante que tu nuevo logotipo se encuentra en la carpeta de “images” de tu tema activo.
Si analizamos un poco el snipet podemos ver que tiene un estilo el cual nos permitirá expandir el tamaño de nuestro logotipo, es decir aplicamos un width de 100%, un padding-bottom de 0px y un background-size: contain y con ello aumentaremos el tamaño del contenedor y el background se adaptará a su máximo tamaño.
Recordemos que WordPress nos recomienda que usemos una imagen en tamaño 80x80px, pero no te preocupes con el snipet anterior bien puedes utilizar una imagen más grande.
Ahora sigamos personalizando nuestra pantalla de login, cambiaremos el enlace del logotipo, es decir cuando demos clic a nuestro logotipo personalizado que nos envíe al home de nuestro sitio.
Agreguemos el siguiente snipet a nuestro archivo de functions.php
function my_login_logo_url() { return home_url(); } add_filter( 'login_headerurl', 'my_login_logo_url' );
Casi termínanos, ahora cambiemos el título que nos aparece al momento de pasar el cursor por encima de nuestro logotipo personalizado. Copie y pega el siguiente snipet de igual forma en nuestro archivo de functions.php
function my_login_logo_url_title() { return 'Aqui Va Tu Titulo Personalizado'; } add_filter( 'login_headertitle', 'my_login_logo_url_title' );
Para finalizar… Cambiemos la URL de login, una de las recomendaciones básicas iniciales es cambiar la ruta para iniciar sesión; la principal razón es por seguridad.
Ahora el archivo que debemos editar es .htaccess para poder sobrescribir la URL básica por una personalizada. Recuerda que este archivo se encuentra en la raíz de tu sitio web.
Cuando ya tengas abierto tu archivo .htaccess lo único que debes hacer es ingresar la siguiente línea de código.
RewriteRule ^login$ http://tusitioweb.com/wp-login.php [NC,L]
No olvides cambiar “login” por tu tuta personalizada y tusitioweb.com por la URL de tu sitio.
La próxima vez que desees ingresar al admin de tu sitio web recuerda hacerlo con tu nueva ruta tusitioweb/turuta
Ojala haya quedado claro y puedas hacer la personalización a tu pantalla de inicio de sesión, si quieres aprender un poco más sobre este tema te invito a que revises el Codex de WordPress.