¿Cómo cambiar la imagen y la URL del login en WordPress?

Como es habitual nuestra pantalla de login de WordPress siempre nos va a mostrar el logotipo precisamente de WordPress, pero a veces queremos darle un toque mas personal a nuestro sitio.

Para lograr esta pequeña modificación vamos a realizar 2 pasos:

1. Modificar archivo functions.php de nuestro Tema Hijo
2. Modificar archivo wp-login.php de nuestro sitio de WordPress con Filezilla

1. Modificar archivo functions.php

Primero debemos de acceder a WordPress como administrador, enseguida nos vamos a Apaciencia > Temas > Archivos de Temas y seleccionamos el archivo functions.php para que nos muestre el contenido

Pegamos en siguiente código al final y actualizamos el archivo.

function logo_markits() { 
	?>
		<style type="text/css"> 
			body.login div#login h1 a {
			background-image: url("https://markits.com.mx/wp-content/uploads/2024/04/cropped-LOGO-MARKITS-WEB.png");

		} 
		</style>
	<?php 
} 
add_action( 'login_enqueue_scripts', 'logo_markits' );

Como podemos ver en el código utilizamos el hook login_enqueue_scripts para que se cargue el estilo correcto con la imagen en la ubicación correcta dentro del HTML, este fragmento se encargara de la imagen, toma en cuenta que la imagen no debe de ser muy grande ya que WordPress la va a ajustar al espacio designado para ella y podría pixelearse y no queremos que eso ocurra.

2. Modificar archivo wp-login.php

Después de que nos muestre la imagen como queremos solo falta un detalle, modificar la URL de la imagen, aunque se puede dejar de esa manera si se desea pero en este caso vamos a modificarla, solo que aquí vamos a modificar uno de los archivos de WordPress y debemos de tener cuidado de lo que hacemos, el archivo en cuestión se llama wp-login.php como se trata de un archivo de WordPress solo vamos a poder hacerlo descargándolo del sitio con Filezilla y volviéndolo a subir

Solo hay que ubicar la línea 125 o buscar $login_header_url = __( ‘https://wordpress.org‘ ); y sustituirla por la url deseada en mi caso será https://markits.com.mx, guardamos el archivo y lo volvemos a subir a la ruta de nuestro sitio de WordPress, recuerda que la línea de código puede variar de acuerdo a la versión que tengas instalada de WordPress para la este ejemplo la versión de WordPress es 6.5.2

Precaución: El archivo que se esta modificando es esencial en WordPress, debes de tener cuidado con la modificación que realices.

Una vez realizados el Paso 1 y el Paso 2 tu pantalla de login quedara de esta manera

Conclusiones

En realidad es bastante sencillo hacer esta modificación no te debe de llevar mas de 5 minutos y estoy exagerando, solo debes de considerar que si actualizas WordPress el cambio que hiciste en el archivo wp-login.php se perderá y deberás de hacer dicha modificación nuevamente.

¿Te quedaste con dudas? Coméntanoslo

¿Necesitas ayuda con tu desarrollo de software o el marketing de tu negocio? contáctanos