¿Quieres saber cómo crear una página de inicio de sesión con Elementor ?
En WordPress, puedes ir en tudominio.com/wp-login.php para ir a la página de inicio de sesión de su sitio web. Si tiene un sitio web grande con varios autores / usuarios, es posible que desee crear una página de inicio de sesión personalizada con su propio diseño para reforzar la identidad de marca de su sitio web.
Con Elementor, puede crear una página de inicio de sesión personalizada para su sitio web de WordPress sin esfuerzo, sin codificación ni instalación de complementos adicionales.
Elementor tiene un widget, el widget de inicio de sesión, que puede utilizar para crear una página de inicio de sesión personalizada. Elementor incluso ofrece plantillas de páginas de inicio de sesión para que puedas crear una página de inicio de sesión en poco tiempo.
Cómo crear una página de inicio de sesión personalizada de WordPress con Elementor
Tenga en cuenta que el widget de inicio de sesión solo está disponible en Elementor Pro. Por lo tanto, antes de poder crear una página de inicio de sesión personalizada, debe actualizar Elementor a la versión pro.
1. Cómo crear una página de inicio de sesión a partir de una plantilla
Como se mencionó anteriormente, Elementor ofrece plantillas que le permiten crear una página de inicio de sesión personalizada en poco tiempo. Para usar uno, comience creando una nueva página (Páginas -> Agregar) Y modificarlo con Elementor.
En el editor de Elementor, haga clic en el icono de la carpeta para abrir la biblioteca de modelos.
Busque una plantilla de página de inicio de sesión personalizada. Puede utilizar el cuadro de búsqueda para facilitar su trabajo. Una vez que encuentre el modelo que le gusta, coloque el mouse sobre él y haga clic en el botón INSERTAR.
Espere un momento hasta que Elementor haya terminado de cargar el modelo. Una vez cargado el modelo, puede hacer clic en publicar para publicarlo.
Voilà.
Para ver la página, puede hacer clic en el icono de tres líneas en la esquina superior del panel izquierdo y seleccionar Mostrar página.
Y aquí está el resultado final si elige el mismo modelo que nosotros.
2. Cómo crear una página de inicio de sesión personalizada desde cero
Si desea tener su propio diseño de página de inicio de sesión, también puede crear su página de inicio de sesión personalizada desde cero. Para comenzar, cree una nueva página y edítela con Elementor.
En el editor de Elementor, agregue una nueva sección haciendo clic en el ícono más. Puede seleccionar una estructura de columna según el diseño que desee crear.
Una vez que su sección esté lista, agregue el widget Conexión arrastrándolo desde el panel izquierdo al área del lienzo.
Ir a la pestaña Contenido en el panel izquierdo para configurar las opciones básicas. Hay 3 bloques de opciones que puede manipular:
1. Campos de formulario
Puede abrir este bloque para habilitar / deshabilitar la etiqueta y establecer el tamaño de entrada.
2. Botón
Puede abrir este bloque para configurar el texto del botón, el tamaño del botón y la alineación del botón.
3. Opciones adicionales
Puede abrir este bloque para habilitar / deshabilitar elementos de su página de inicio de sesión, como el enlace MContraseña perdida y la opcion Recuérdame. Dado que desea crear una página de inicio de sesión, activar la opción Redirigir después de iniciar sesión y pegue la URL del panel de WordPress (tudominio.com/wp-admin) en el campo disponible. También puedes activar la opción Redirigir después de cerrar sesión si lo desea.
Puedes activar la opción Etiqueta personalizada si desea utilizar etiquetas personalizadas y marcadores de posición personalizados en su formulario conexión.
Una vez el definición opciones básicas completadas, vaya a la pestaña Estilo para personalizar el formulario conexión. Hay 5 bloques de opciones de estilo disponibles:
1. Formar
Puede abrir este bloque para definir el espacio entre las líneas, el color de los enlaces y el color del apuntado de los enlaces.
2. Etiqueta
Sólo podrás ver este bloque si activas la etiqueta de formulario. Puede abrir este bloque para establecer el espacio entre las etiquetas de los formularios, el color del texto y la tipografía (familia de fuentes, tamaño de fuente, estilo de fuente, etc.).
3. Campos
Puede abrir este bloque para definir el color de los campos de texto, la tipografía (familia de fuentes, tamaño de fuente, estilo de fuente, etc.), el fondo del control, el color del borde del control, el ancho del borde del campo y el radio del borde del campo.
4. Botón
Puede abrir este bloque para personalizar el botón de inicio de sesión. Puede configurar cosas como el color del texto del botón, el color del texto al pasar el cursor, la tipografía, el color de fondo del botón, el radio del borde y el relleno del texto del botón.
5. Mensaje de inicio de sesión
Puede abrir este bloque para personalizar el mensaje una vez que sus usuarios hayan iniciado sesión. Aquí está el mensaje:
Puede establecer el color del texto y la tipografía del mensaje.
Una vez que haya terminado de diseñar el widget de inicio de sesión, puede personalizar otros widgets en su página. Una vez que se complete la edición de la página, publique / actualice su página y habrá creado correctamente la página de inicio de sesión personalizada.
Lea también: Cómo exportar e importar modelos de Elementor
Una cosa crucial a tener en cuenta. Después de crear la página de inicio de sesión personalizada, no elimine el archivo wp-login.php en su sitio web de WordPress. Su sitio de WordPress todavía necesita este archivo para manejar el proceso de inicio de sesión.
¡Obtenga Elementor Pro ahora!
Conclusión
Listo ! Eso es todo por este artículo que le muestra cómo crear una página de inicio de sesión con Elementor. Si tiene alguna duda sobre cómo llegar favísanos en el comentarios.
Sin embargo, también puedes consultar nuestros recursos, si necesita más elementos para llevar a cabo sus proyectos de creación de sitios de Internet, consulte nuestra guía sobre Creación de blog de WordPress o el de Divi: el mejor tema de WordPress de todos los tiempos.
Pero mientras tanto, comparte este artículo en tus diferentes redes sociales.
...
