CURROBURGUILLO

Cambia tu logo en la pantalla de acceso de WordPress

Pocas cosas quedan tan chulas cuando tienes una web con wordpress como ponerle tu imagen a la pantalla de acceso, bueno, eso y ponerla en el escritorio, pero eso será otra entrada.log_in

Después de mucho buscar he encontrado dos maneras de poder hacerlo. Más otra que conocía y que he de reconocer que es la más fácil. Además buscando el tema del logo me encontré otra cosa que os lo enseñaré al final del post. Vamos a lo que vamos, maneras de poner el logo en nuestra pantalla de acceso:

1. Con un plugin.

Esta no la he probado aún. Existen varios plugins que cumplen esta función, de los que he visto el que mejor pinta tiene es Custom Login. Tiene multitud de posibilidades cambiarle el color de fondo, se puede poner una imagen de fondo y, obviamente, cambiar el logo de acceso.

Yo personalmente no soy partidario de usar plugins para cosas que se pueden hacer desde el archivo functions.php, este es uno de esos casos; usar un plugin para cambiar el logo de acceso es innecesario, cargas el tiempo de carga de la web, haciendo que sea menos apetecible volver.

Por este motivo personalmente prefiero la última opción de las tres. Pero antes vamos a ver otra manera de hacer lo mismo.

2. Sobreescribiendo una imagen.

Para poder cambiar el logo en la pantalla de acceso de esta manera has de tener acceso por FTP al alojamiento ya que lo que has de hacer es cambiar un archivo. Cuando entras a la página de acceso encima de nombre de usuario aparece el logo de wordpress, un archivo que está en /wp-admin/images/wordpress-logo.svg.

Ahora que ya lo tenemos situado, nos volvemos a nuestro PC y editamos nuestro logo con un programa de edición vectorial tipo Inkscape. Cuando esté finalizado lo guardamos con el mismo nombre del logo, es decir, wordpress-logo.svg.

Ahora sólo nos toca acceder a nuestro dominio por FTP. Entramos en la carpeta /wp-admin/images/ y, antes de subir nuestro archivo, lo que vamos a hacer es cambiarle el nombre al archivo original. Por ejemplo, cuando yo voy a hacer este tipo de cosas le añado .old al archivo, de manera que quedaría de la siguiente manera: wordpress-logo.svg.old

Ya sólo nos queda subir nuestro archivo a la misma carpeta.

Ahora vamos a por el último método, el que más me gusta a mí. Y además es el que trae otro truquillo

3. Escribiendo código.

Para este método hay que escribir un poco de código, aunque si eres un poco vaguete siempre puedes hacer un copia/pega :-). Para hacerlo accedemos al archivo functions.php de nuestro tema y al final del archivo añadimos estas lineas:

// cambiando login acceso
function my_custom_login_logo() {
echo '<style type="text/css">
h1 a { background-image:url('.get_bloginfo('template_directory').'/img/login.png) !important; }
</style>';
}
add_action('login_head', 'my_custom_login_logo');

De esta manera lo que tienes que tener en cuenta es donde situar tu logo. Si nos fijamos en el código que hay escrito, yo lo tengo en la carpeta de mi tema, en la subcarpeta img/, si tu tienes las imágenes en otra carpeta, pongamos images/ imagenes/ etc lo único que has de hacer es cambiar el nombre de la carpeta y, obviamente, el nombre del archivo.

Una cosa que no he comentado anteriormente es que la imagen tendrá que tener un tamaño de 80px por 80px, ya que ese es el tamaño de la imagen que estamos “escondiendo”.

Ahora que ya estamos supercontentos porque tenemos nuestro logo en la pantalla de acceso y le pasamos el ratón por encima, nos hemos dado cuenta que “MIE**A!!!”, PERO SI ESTÁ APUNTANDO A LA WEB DE WORDPRESS! Yo lo que quiero es que apunte a mi web, no?

Aquí tenemos la opción para conseguir que apunte a nuestro home

// cambia enlace logo
function put_my_url(){
return ('https://www.curroburguillo.es/'); // cambiar por la URL de su web
}
add_filter('login_headerurl', 'put_my_url');

Espero que os sirva, si usáis otros trucos o queréis que escriba sobre algo en concreto comentadlo y podría hacer alguna entrada sobre el tema en cuestión.

Salir de la versión móvil