Son muchas las ocasiones en que necesitas personalizar determinados elementos de tu instalación de WordPress, y no me refiero únicamente a las páginas que ven quienes te visitan, como la Home, el Formulario de Contacto o la página de Productos de la tienda, sino a aspectos que quizás pasan un poco más desapercibidos pero que forma parte de lo que los visitantes ven y perciben de tu sitio “los detalles”.
Te presentamos Arkibot,
nuestra nueva herramienta de chatbot.
Pruébala por 9,90€ + impuestos al mes y automatiza el trabajo aburrido.
Ahorra tiempo y dinero aquíSi tienes una cartera de clientes porque ejerces como Agencia de desarrollo de sitios web para terceros o si administras por tu cuenta instalaciones de otros usuarios o clientes, bajo tu marca comercial o personal, es posible que quieras establecer una “marca blanca” para determinados elementos muy llamativos de tu sitio; y con esto no quiero decir que deban borrar de la faz de la tierra la propiedad intelectual del CMS que utilizas para monetizar tus proyectos.
Peri si puedes hacer un poco de prospección en tu sitio y determinar que elementos puedes o debes personalizar con tu marca y quizás el más obvio sea cambiar la imagen de wp-login de WordPress, y que también ven los usuarios cuando se loguean desde wp-login.php ¿porque no cambiar este logo?
Tabla de contenidos
Cómo cambiar la imagen de wp-login de WordPress desde la administración
Para cambiar el logo del formulario de acceso a WordPress podrías, desde tu Panel de Hosting, usando el Administrador de Archivos ir a la carpeta wp-admin/images/ y localizar el archivo wordpress-logo.svg para en base a ese archivo diseñar uno de tamaño y formato similar y luego sustituirlo por el nuevo.
Quizás te resulte un poco engorroso, sobre todo porque este archivo escalable SVG suele venir nombrado como wordpress-logo.svg?ver=20131107, donde el código numérico de versión variará.
Para estos casos quizás te resulte más interesante utilizar un fragmento de código con una acción (y sus correspondientes estilos CSS de WordPress para controlar cómo se visualiza el logo) y pasarle a esa “acción” el parámetro de ruta + nombre del archivo del nuevo logo.
Esta “acción” debería ir en el archivo functions.php, pero si te da respeto modificar ese archivo (podrías dejar tu sitio inoperativo si te equivocas), es posible que lo mejor sea instalar un plugin para WordPress como Code Snippets para añadir el trozo de código y que se encargue el plugin de gestionarlo ¿verdad?
Pues lo dicho, instala el plugin de snippets y luego copia el siguiente código y añádelo al plugin tal como te muestro en la captura inferior.
function mi_login_logo_one() {
?>
<style type="text/css">
body.login div#login h1 a {
background-image: url(https://tu-dominio.com/tu_logo.png);
padding-bottom: 30px;
}
</style>
<?php
} add_action( 'login_enqueue_scripts', 'mi_login_logo_one' );
En este fragmento de código, el parámetro tu-dominio.com debes cambiarlo por el nombre de “tu-dominio” y tu_logo.png por el nombre del archivo de “tu logo” en formato transparente PNG.
La imagen de tu logo puedes subirla a la carpeta principal donde tengas la instalación de WordPress o puedes subirla a “Medios de WordPress“, desde el dashboard, y luego copiar la ruta completa a esa imagen y ponerla en el script como parámetro “url” de la clase background-image.
Una vez añadas el código y establezcas los parámetros adicionales puedes “Guardar cambios” y verificar si están funcionando. Abre una nueva pestaña en “modo incógnito” y escribe la url de tu dashboard de WordPress https://tu-dominio.com/wp-admin para verificar el cambio la imagen de wp-login de WordPress.
Este cambio prevalecerá aunque actualices futuramente el núcleo de tu instalación de WordPress y solo es posible deshacerlo eliminando el snippet o desactivándolo en el caso de que uses un plugin para fragmentos de código.
Cómo cambiar la imagen de wp-login de WordPress por FTP
El cambio de logo usando un programa o cliente de FTP en esencia es similar a lo que te explicaba más arriba.
Cito:
Quizás te resulte un poco engorroso, sobre todo porque este archivo escalable SVG suele venir nombrado como wordpress-logo.svg?ver=20131107, donde el código numérico de versión variará.
Por lo que deberías evaluar si realmente merece la pena liarte con el FTP para hacer un cambio de logo pudiendo hacerlo todo desde el dashboard de tu instalación de WordPress. O quizás no tengas datos de acceso FTP a tu sitio web y por eso esta opción no te resulte viable.
También tienes la opción de acceder al administrador de archivos desde WordPress sin necesidad de entrar mediante FTP o el panel del hosting.
Cómo cambiar el logo en el acceso de WordPress con un plugin
Hay un buen puñado de plugins de WordPress en el directorio oficial que permiten personalizar o cambiar el logo del login de WordPress desde el dashboard de WordPress en un par de clics, pero la mayoría de ellos vienen cargados de promesas “Premium” que hace que sea fácil desistir de su uso y evitar ser bombardeado constantemente con notificaciones en el panel de administración de WordPress.
He escogido un plugin, sencillo, directo al grano y que no machaca con eso de “compra la versión premium” etc., y se llama Custom Login Page Customizer. Te permite personalizar fácilmente la página de inicio de sesión directamente desde el personalizador de WordPress pudiendo previsualizar los cambios que vayas aplicando en el inicio de sesión antes de guardarlos hasta escoger con cuál te quedas.
Haz clic en la imagen para acceder al plugin en WordPress.org
Además no se limita a permitir el cambio del logo sino que además con este plugin puedes ajustar el resto de elementos de la página de acceso a la administración.
La instalación es super sencilla y en menos de 1 minuto lo tienes ya listo para empezar a customizar el login de WordPress en pocos pasos y de manera muy visual.
Desde Apariencia > Personalizar > Login Customizer > Plantillas, puedes cambiar la plantilla de la pantalla de acceso al dashboard por otra de las disponibles.
También puedes establecer un color de fondo de la pantalla de acceso.
De la misma forma puedes establecer un logo para la parte superior del formulario de acceso al dashboard de WordPress.
Juega con los controles de tamaño y posición para el apartado de Campos y déjalo cómo te guste.
Personaliza los colores del botón “Iniciar sesión” así como su tamaño y color del texto.
Ajusta los textos que se muestran debajo de la caja del formulario de acceso y activa o desactiva aquellos que consideres oportunos.
Finalmente desde Apariencia > Personalizar > Login Customizer > Ajustes, decide si quieres mantener marcada la opción de Recuérdame para los datos de acceso del usuario que se loguea, qué orden estableces para dicho acceso, y si quieres que se muestre el selector de idioma en el login a tu dashboard.
Con esto, Guarda los cambios y ya tienes tu formulario de acceso al dashboard personalizado, y además de haber cambiado el logo de dicho formulario de login, has podido personalizar otros elementos adicionales relacionados.
Hecho todo esto, si te desconectas del sitio y vuelves a https://tudominio.com/wp-admin verás la página de acceso al dashboard de WordPress con las personalizaciones que hayas aplicado, incluido el cambio de logo.
Conclusiones
El cambio de logo y otras personalizaciones del formulario de acceso a tu instalación de WordPress, como has podido comprobar, se puede realizar de varias maneras, algunas de ellas de forma manual, y otras (bastantes) por medio de plugins, que hay muchos y variados y cada cual mejorando lo que el otro hace.
Al final, si te decantas por el uso de plugins tendrás que establecer una serie de configuraciones que te permitan personalizar la imagen que se proyecta desde wp-admin o wp-login.php a tus usuarios registrados en el sitio web, de manera que se acomode a tu empresa, proyecto o marca comercial.
Escoge la opción que mejor se adapte a tus necesidades y conocimiento y sobre todo ¡disfruta con el proceso! que es también de lo que se trata.
Otros artículos que pueden serte de gran ayuda son:
¿Te ha resultado útil este artículo?
Miembro del equipo de soporte técnico de Webempresa.
Coordinador de contenidos en el Blog y en Youtube.
Soporte técnico en CiberProtector. Teacher en Webempresa University
