El formulario de inicio de sesión predeterminado de WooCommerce se encuentra dentro de la página Mi cuenta de tu tema. Se ve como cualquier otra tienda y no lleva tu marca. Custom Login para WooCommerce lo reemplaza con una página de inicio de sesión dedicada y de marca en /login, y envía a los visitantes que no han iniciado sesión allí automáticamente.
Al final, tendrás una página de inicio de sesión de marca en /login, la redirección de Mi cuenta funcionando y tu logo en su lugar. Las opciones de plantilla, color y contenido promocional se encuentran en otras pestañas y tienen sus propios artículos.
Prerrequisitos
| Requisito | Detalles |
|---|---|
| WordPress | Versión 5.8 o posterior |
| WooCommerce | Versión 6.0 o posterior, instalada y activa |
| PHP | Versión 7.4 o posterior |
| Acceso | Una cuenta que puede administrar la configuración de WooCommerce |
| Archivo de logo | Una imagen PNG o JPG (o la dirección de un SVG que ya esté en línea). El plugin recomienda 200x60px |
Paso 1: Activar el plugin
Instala y activa Custom Login para WooCommerce de la misma manera que cualquier otro plugin de WordPress. Una vez activo, aparece un elemento Custom Login bajo el menú WooCommerce en la barra lateral de tu administrador. También puedes hacer clic en Ajustes bajo el nombre del plugin en la pantalla Plugins.
Al activarse, el plugin crea una página publicada titulada Login con el slug login, a menos que ya exista una página con ese slug. Tu página de inicio de sesión estará entonces activa en tutienda.com/login.
Paso 2: Activa tu licencia
Después de la activación, el plugin muestra un aviso rojo en el administrador pidiéndote que actives tu licencia. Una licencia te da actualizaciones del plugin y soporte.
- Ve a WooCommerce → Custom Login.
- Haz clic en la pestaña Licencia.
- Introduce tu Clave de licencia y el Email de activación que utilizaste para comprar.
- Haz clic en Activar licencia.
Paso 3: Comprueba tu página de inicio de sesión
Cierra sesión en tu sitio, o abre una ventana de navegador privada. Luego visita tutienda.com/login.
La página de inicio de sesión del plugin se abre en lugar del diseño de tu tema. El diseño predeterminado es Classic Split, con el formulario de inicio de sesión a la izquierda y un panel promocional a la derecha. El formulario incluye los campos Dirección de correo electrónico y Contraseña (los clientes pueden iniciar sesión con su nombre de usuario o dirección de correo electrónico), una casilla de verificación Recuérdame y un enlace ¿Has olvidado tu contraseña?. Puedes renombrar estas etiquetas más tarde en la pestaña Diseño.
Si ya has iniciado sesión cuando visitas /login, el plugin te envía directamente a tu página de Mi cuenta.
Paso 4: Comprueba la redirección de Mi cuenta
No necesitas configurar nada para la redirección. Para verla funcionar, abre tu página de Mi cuenta en una ventana de navegador privada. Aterrizas en /login. Una vez que el plugin está activo, la redirección funciona así:
Visitantes desconectados. Cualquiera que abra su página Mi cuenta sin haber iniciado sesión irá a /login en su lugar. El plugin pasa un valor redirect_to, por lo que regresan a Mi cuenta después de iniciar sesión.
Enlaces de contraseña perdida. La página ¿Has perdido tu contraseña? todavía se abre normalmente, para que los clientes puedan restablecer una contraseña sin ser enviados de vuelta a la página de inicio de sesión.
Cerrar sesión. El enlace de cierre de sesión envía a los clientes a /login con el mensaje “Has cerrado sesión correctamente.”
Después de iniciar sesión. Los clientes aterrizan en Mi cuenta, a menos que provengan de otra página que haya pasado su propio valor redirect_to.
Paso 5: Añade tu logo a la Biblioteca de medios
Tu logo aparece encima del encabezado de inicio de sesión. El plugin no tiene botón de carga, por lo que primero debes añadir la imagen a tu Biblioteca de medios y luego indicarle al plugin dónde está en el Paso 6.
- Ve a Medios → Añadir archivo multimedia en tu administrador de WordPress.
- Sube tu logo como un archivo PNG o JPG.
- Junto al archivo subido, haz clic en Editar.
- Copia la URL del archivo.
Paso 6: Indica al plugin dónde está tu logo
- Ve a WooCommerce → Custom Login.
- Haz clic en la pestaña Diseño.
- En Logo y Encabezado, pega la dirección en el campo URL del logo.
- Haz clic en Guardar configuración.
Visita /login de nuevo en una ventana privada para comprobar el resultado. El plugin muestra tu logo a una altura máxima de 50px, por lo que una imagen ancha y corta funciona mejor. Si dejas URL del logo vacío, la página de inicio de sesión no mostrará ningún logo.
Solución de problemas
https://, en el campo URL del logo, y de haber hecho clic en Guardar configuración. Luego abre la dirección por sí sola en una pestaña del navegador. Si la imagen no se carga allí, súbela de nuevo a tu Biblioteca de medios y copia una URL del archivo nueva.¿Qué sigue?
- Cómo elegir una plantilla de página de inicio de sesión para WooCommerce
- Cómo personalizar los colores de tu página de inicio de sesión de WooCommerce
- Cómo configurar el panel promocional en tu página de inicio de sesión de WooCommerce
Preguntas frecuentes
/login.login cuando lo activas. Si la página ya existe, el plugin la deja como está.¿Necesita ayuda?
Inicio de sesión personalizado para WooCommerce es un plugin premium, así que si tienes problemas, abre un ticket de soporte y nuestro equipo te ayudará a configurarlo.
