Cómo personalizar la página de inicio de sesión de WooCommerce (3 métodos)
Publicado: 2022-08-17¿Quieres personalizar tu página de inicio de sesión de cliente de WooCommerce?
La página de inicio de sesión predeterminada de WordPress es simple y no coincide con la marca de su tienda. La personalización de su página de inicio de sesión de cliente de WooCommerce lo ayuda a brindar una mejor experiencia de usuario.
En este artículo, le mostraremos cómo crear una página de inicio de sesión de WooCommerce completamente personalizada y también compartiremos consejos sobre cómo personalizar la página de inicio de sesión de pago.
¿Por qué crear una página de inicio de sesión de cliente de WooCommerce personalizada?
Cuando los clientes inicien sesión en su tienda WooCommerce, verán la página de inicio de sesión predeterminada de WordPress con solo el logotipo y la marca de WordPress.
Esta página está bien si solo desea acceder al panel de control de su sitio. Sin embargo, los clientes pueden sentirse desanimados por el diseño simple y sospechar que la página de inicio de sesión no coincide con la apariencia de su sitio web.
La personalización de las páginas de inicio de sesión de WooCommerce le permite agregar su logotipo y cambiar el diseño para que coincida con su sitio web. Esto hace que su sitio se vea más profesional y proporciona una mejor experiencia de usuario.
También le permite agregar más campos de formulario e incluso le permite promocionar productos específicos o mostrar ofertas especiales a los clientes.
Dicho esto, veamos cómo puede crear una página de inicio de sesión de cliente personalizada en WooCommerce.
Cree una página de inicio de sesión de WooCommerce completamente personalizada usando SeedProd
La mejor manera de crear una página de inicio de sesión de cliente de WooCommerce personalizada es usando SeedProd. Es la mejor página de destino de WordPress y el mejor generador de temas para WordPress, y es increíblemente fácil de usar.
Puede usar el generador de arrastrar y soltar de SeedProd para personalizar el diseño y el diseño de una página o su tema de WordPress sin tocar una sola línea de código.
Para este tutorial, usaremos la licencia SeedProd Pro porque incluye la plantilla de la página de inicio de sesión y otras opciones de personalización avanzadas. También hay una versión de SeedProd Lite que puedes usar gratis.
Primero, deberá instalar y activar el complemento SeedProd. Si necesita ayuda, consulte nuestra guía sobre cómo instalar un complemento de WordPress.
Tras la activación, verá la pantalla de bienvenida de SeedProd . Adelante, ingrese su clave de licencia y haga clic en el botón 'Verificar clave'. Puede encontrar la clave de licencia en el área de la cuenta de SeedProd.
A continuación, puede crear una página de inicio de sesión personalizada para su tienda WooCommerce.
Simplemente diríjase a SeedProd » Landing Pages desde su panel de WordPress y haga clic en el botón 'Configurar una página de inicio de sesión'.
Después de eso, SeedProd le mostrará varias plantillas. Puede seleccionar uno rápidamente y personalizarlo según sus necesidades. Esto ayuda a ahorrar tiempo y puede usar un diseño existente para crear su propia página de inicio de sesión de WooCommerce.
El complemento también le permite crear una página de inicio de sesión desde cero utilizando una plantilla en blanco.
Una vez que seleccione una plantilla, se abrirá una ventana emergente.
Continúe e ingrese un nombre para su página y haga clic en el botón 'Guardar y comenzar a editar la página'.
A continuación, verá el generador de páginas de arrastrar y soltar.
Ahora puede personalizar la página de inicio de sesión agregando nuevos bloques a la plantilla desde el menú a su izquierda.
SeedProd ofrece bloques estándar como título, texto, imagen, botón y más.
Además de eso, puede agregar bloques avanzados como un sorteo, formulario de contacto, botones para compartir en redes sociales, formulario de suscripción y más. También hay bloques de WooCommerce como productos recientes, productos destacados y productos más vendidos que puede agregar a la plantilla de su página de inicio de sesión.
Con los bloques de WooCommerce, puede recomendar fácilmente sus mejores productos y promocionar ofertas de descuento para obtener más conversiones.
Aparte de eso, SeedProd también le permite personalizar aún más cualquier sección en la página de inicio de sesión. Simplemente haga clic en la sección y verá más opciones, como editar la etiqueta, el color, la fuente y el espaciado.
Una vez que haya terminado de personalizar la página de inicio de sesión de WooCommerce, no olvide hacer clic en el botón "Guardar" en la parte superior.
Después de eso, puede dirigirse a la pestaña 'Configuración de la página' y hacer clic en el botón 'Estado de la página' para cambiarlo de Borrador a Publicar. Luego, puede continuar y hacer clic en el botón 'Guardar' y cerrar el generador de páginas.
A partir de aquí, todo lo que queda es hacer que su nueva página de inicio de sesión personalizada de WooCommerce se muestre a los usuarios. Para hacer esto, vaya a SeedProd » Landing Pages en su tablero de WordPress.
Simplemente haga clic en el interruptor debajo de 'Página de inicio de sesión' para que esté verde y diga 'Activo'.
Una vez que esté activado, su nueva página de inicio de sesión aparecerá en su sitio.
Puede visitar su tienda de comercio electrónico para verlo en acción.
Personalice el formulario de inicio de sesión del cliente de WooCommerce usando WPForms
¿Desea crear un formulario de inicio de sesión que también coincida con el tema de su sitio web y ofrezca más campos de formulario?
El formulario de inicio de sesión predeterminado de WordPress solo permite a los usuarios ingresar su dirección de correo electrónico o nombre de usuario junto con una contraseña. Con un formulario de inicio de sesión personalizado, puede agregar más campos y permitir que los clientes inicien sesión con su nombre o número de teléfono.
La mejor manera de hacerlo es usando WPForms. Es el mejor generador de formularios de WordPress que es fácil de usar para principiantes. Más de 5 millones de sitios web utilizan WPForms para crear formularios más inteligentes.
Puede crear fácilmente un formulario de inicio de sesión personalizado de WooCommerce y mostrarlo en cualquier lugar de su tienda en línea, como la barra lateral o la página del producto.
Para este tutorial, usaremos el plan WPForms Pro porque incluye el complemento de registro de usuario. También puede probar la versión gratuita de WPForms para comenzar.
Primero, deberá instalar y activar el complemento WPForms. Si necesita ayuda, consulte nuestra guía sobre cómo instalar un complemento de WordPress.
Tras la activación, puede ir a WPForms » Configuración desde su panel de WordPress e ingresar la clave de licencia. Puede encontrar la clave de licencia en el área de la cuenta de WPForms.
A continuación, deberá dirigirse a WPForms » Complementos en el panel de administración de WordPress.
Después de eso, desplácese hacia abajo hasta el 'Complemento de registro de usuario' y luego haga clic en el botón 'Instalar complemento'.
Ahora, está listo para crear un formulario de inicio de sesión personalizado para WooCommerce. Simplemente vaya a WPForms » Agregar nuevo para iniciar el generador de formularios.
En la siguiente pantalla, puede ingresar un nombre para su formulario en la parte superior. Luego, busque la plantilla 'Formulario de inicio de sesión de usuario' y haga clic en el botón 'Usar plantilla'.
Después de eso, puede personalizar su plantilla de formulario de inicio de sesión de usuario utilizando el generador de arrastrar y soltar. WPForms hace que sea muy fácil agregar diferentes campos al formulario o reorganizar los campos existentes en la plantilla.
Por ejemplo, puede agregar campos avanzados como números de teléfono arrastrándolos desde el menú a su izquierda y soltándolos en la plantilla.
Puede personalizar aún más cada campo de formulario en la plantilla. Simplemente haga clic en cualquier campo y edite su etiqueta, agregue una descripción y conviértalo en un campo obligatorio en el formulario.
Después de eso, puede dirigirse a la pestaña 'Configuración' en el generador de formularios. En la configuración general, puede cambiar 'Enviar texto del botón' a 'Iniciar sesión'.
A continuación, puede ir a la pestaña 'Confirmaciones' para cambiar lo que sucederá cuando un usuario inicie sesión correctamente.
Simplemente haga clic en el menú desplegable 'Tipo de confirmación' y seleccione una opción. Puede mostrar a los clientes un mensaje, mostrar una página o redirigirlos a una URL específica.
Por ejemplo, puede agregar su formulario de inicio de sesión de WooCommerce en una página de producto y permitir que los clientes inicien sesión rápidamente para comprar su producto.
Cuando haya terminado, simplemente haga clic en el botón 'Guardar' en la parte superior.
A continuación, deberá agregar el formulario de inicio de sesión del cliente de WooCommerce a una página de su sitio.
Simplemente haga clic en el botón 'Incrustar' en la parte superior del constructor. Luego puede elegir si colocará el formulario en una página existente o creará uno nuevo para él.
Elijamos la opción 'Crear nueva página' por ahora.
A continuación, deberá ingresar un nombre para su página y hacer clic en '¡Vamos!' botón.
Después de eso, verá el formulario de inicio de sesión de WPForms dentro del área de contenido de WordPress.
Ahora, puede obtener una vista previa de su formulario, publicar la nueva página y mostrar el inicio de sesión personalizado de WooCommerce para sus clientes.
Por otro lado, también puede agregar su formulario de inicio de sesión de WooCommerce a la barra lateral de su tienda. De esta manera, su formulario aparecerá en cada página de producto y permitirá a los clientes iniciar sesión rápidamente.
Simplemente, dirígete a Apariencia » Widgets desde tu panel de WordPress. A continuación, haga clic en el botón '+' y agregue un bloque de widgets de WPForms.
Después de eso, puede elegir su formulario de inicio de sesión en el menú desplegable e ingresar un título.
Cuando haya terminado, haga clic en el botón 'Actualizar'.
Ahora puede visitar su tienda en línea para ver el formulario de inicio de sesión en la barra lateral.
Para obtener más formas de crear una página de inicio de sesión de cliente de WooCommerce personalizada, puede consultar nuestra guía sobre cómo crear una página de inicio de sesión de WordPress personalizada.
Además, también puede ver nuestro tutorial sobre cómo agregar un menú de navegación en WordPress para que pueda agregar su página de inicio de sesión de WooCommerce a la navegación de su sitio web.
Bonificación: personalice la página de inicio de sesión de pago de WooCommerce
WooCommerce permite que los visitantes que regresan inicien sesión durante la página de pago. Si está buscando personalizar la página de inicio de sesión de pago de WooCommerce, entonces la mejor manera de hacerlo es utilizando un potente complemento de creación de embudos como WooFunnels.
WooFunnels le permite personalizar su página de pago de WooCommerce, agregar pagos de varios pasos, agregar ventas adicionales con un solo clic y mucho más.
Puede seleccionar entre docenas de plantillas de pago prefabricadas que están altamente optimizadas para las conversiones, y la mejor parte es que puede personalizarlas usando cualquiera de los populares creadores de páginas de WordPress.
Tiene la opción de realizar pruebas A/B en los múltiples embudos, páginas de ventas y ofertas de ventas adicionales.
WooFunnels le brinda análisis detallados en cada paso de su embudo de WooCommerce.
También viene con un poderoso complemento de automatización de marketing, Autonami, que le permite personalizar los correos electrónicos de WooCommerce, enviar notificaciones por correo electrónico en WooCommerce para el abandono del carrito, series de bienvenida y más.
Si te tomas en serio el crecimiento de tu tienda WooCommerce, entonces esta es una de las herramientas imprescindibles que recomendamos.
Esperamos que este artículo le haya ayudado a aprender cómo crear una página de inicio de sesión de cliente de WooCommerce personalizada. También puede ver nuestra selección de expertos sobre los mejores complementos de WooCommerce y nuestra guía definitiva sobre cómo solucionar el problema de WordPress que no envía correos electrónicos.
Si te gustó este artículo, suscríbete a nuestro canal de YouTube para videos tutoriales de WordPress. También puede encontrarnos en Twitter y Facebook.