LoginPress es uno de los mejores plugins para personalizar la pantalla de inicio de sesión de WordPress. Te permite transformar esa página genérica con el logo de WordPress en una extensión de tu marca, de forma visual y sin tocar una sola línea de código.
Aquí tienes la guía paso a paso para configurarlo y personalizarlo desde cero:
Paso 1: Instalación y Activación
- Ve al panel de administración de tu WordPress.
- Ve a Plugins > Añadir nuevo.
- En el buscador, escribe LoginPress.
- Haz clic en Instalar ahora y luego en Activar.
Paso 2: Acceder al Personalizador
Una vez activado, verás una nueva sección en el menú lateral de WordPress llamada LoginPress.
- Haz clic en LoginPress > Personalizador (Customizer).
- Esto te redirigirá al personalizador nativo de WordPress, pero con un menú exclusivo para LoginPress a la izquierda y una vista previa en tiempo real de tu página de login a la derecha.
Paso 3: Personalización paso a paso
En el menú de la izquierda verás varias opciones. Aquí tienes las más importantes que debes configurar:
1. Logos (Logo)
- Cambiar el logo de WordPress: Sube el logotipo de tu marca o empresa.
- Ajustes del logo: Puedes regular el ancho, el alto y el espacio (margen) inferior para que quede perfectamente alineado.
- URL del logo: Por defecto, al hacer clic en el logo de WordPress te lleva a wordpress.org. Aquí puedes cambiarlo para que dirija a la página de inicio de tu propia web.
2. Fondos (Background)
- Imagen o Color: Puedes elegir un color sólido de fondo o subir una imagen llamativa (LoginPress también incluye algunas imágenes predeterminadas de alta calidad).
- Ajustes de imagen: Asegúrate de que esté en modo “Cover” (ajustar a la pantalla) para que se vea bien en monitores grandes y teléfonos móviles.
3. Personalizar el Formulario (Customize Login Form)
- Aquí modificas la “caja” blanca donde el usuario escribe sus datos.
- Puedes cambiar el color de fondo de la caja, darle bordes redondeados, añadirle sombras o hacerla semi-transparente.
4. Campos de entrada (Input Fields)
- Cambia el diseño de los cuadros de texto donde se introduce el usuario y la contraseña.
- Puedes modificar el color del texto, el color de fondo del campo y el color del borde cuando el usuario hace clic en él.
5. Botón de inicio de sesión (Button Beauty)
- Transforma el típico botón azul de WordPress.
- Cambia el color del botón, el color al pasar el cursor (hover), el tamaño del texto y dale esquinas redondeadas para que coincida con la identidad de tu web.
6. Mensajes de error (Error Messages)
🔒 Tip de Seguridad: Por defecto, WordPress dice cosas como “La contraseña que introdujiste para el usuario X no es correcta”. Esto le da pistas a los hackers de que el usuario sí existe.
- Con LoginPress puedes cambiar todos los mensajes de error por algo genérico como: “El usuario o la contraseña son incorrectos. Por favor, inténtalo de nuevo.”
Paso 4: Guardar los cambios
Cuando estés satisfecho con el resultado en la vista previa, simplemente haz clic en el botón Publicar (o Guardar) en la parte superior izquierda.
¡Listo! Para comprobar el resultado, cierra sesión en tu cuenta o abre una ventana de incógnito en tu navegador y entra a tudominio.com/wp-login.php. Verás tu nueva y profesional pantalla de acceso.
