• Saltar a la navegación principal
  • Saltar al contenido principal
  • Saltar a la barra lateral principal

DecodeCMS

Tu WordPress a otro Nivel ...

  • Acerca de
  • Contacto
  • Inicio
  • Tutoriales
    • Themes
    • Plugins
    • Core
    • Recursos
  • Cursos
  • Acceder
    • Mis cursos
    • Mi Cuenta
    • Acceder
Inicio / Tutoriales / Core / Formulario de login mejorado sin plugins en WordPress

Formulario de login mejorado sin plugins en WordPress

Formulario de login mejorado sin plugins en WordPress

[ 12 abril 2021 ] [ Autor: Jhon Marreros Guzmán ][ Core - Intermedio] [ ]

funcionalidad

¿Me ayudas a llegar a más gente?

Twittear Compartir LinkedIn WhatsApp

En un artículo anterior habíamos ya realizado un formulario de login sin plugins, sin embargo es posible ahorrarnos tanto código HTML como CSS y usar una función de WordPress que nos ayuda con la generación del formulario.
 

Resultado Final

Al final lo que queremos obtener será algo similar a lo que se muestra en la siguiente imagen:

Formulario de login sin plugins

 

Código para crear el formulario de login

El siguiente código crea un shortcode llamado [dcms_form_login] el cual puedes usar en cualquier lugar de tu sitio web para mostrar el formulario de login.

En el código anterior:

  • Creamos el shortcode dcms_form_login que ejecuta la función dcms_form_login_config()
  • Dentro de la función podemos configurar las variables para las redirecciones $redirect_login y $redirect_logout, por defecto llevan al inicio del sitio
  • El código mostrará condicionalmente el formulario de login, usamos la función de WordPress wp_login_form() la cual crea el formulario con los argumentos indicados
  • En caso el usuario ya se encuentre conectado mostraremos su información, como por ejemplo su avatar con la función get_avatar().
  • Creamos igualmente la url de redirección tras la desconexión con la función wp_logout_url()

 

Puedes agregar este código en el archivo functions.php de tu tema hijo.

 

Conclusión

Como has podido comprobar, usando la función wp_login_form() de WordPress te puede ahorrar código al construir el formulario y simplemente nos preocupamos en agregar lógica adicional para el manejo del Shortcode.

 

¿Aún con dudas?, en el siguiente video se detallan los puntos anteriores.

Suscríbete a DecodeCMS:  

 

¿Me ayudas a llegar a más gente?

Twittear Compartir LinkedIn WhatsApp

Artículos Relacionados

  • Formulario de login sin plugins en WordPressFormulario de login sin plugins en WordPress
  • Personalizar el formulario de login de WordPressPersonalizar el formulario de login de WordPress
  • Transients en WordPressCómo usar Transients en WordPress
  • Habilitar debug en WordPressHabilitar el modo Debug en WordPress
Valora este artículo : 1 barra2 barras3 barras4 barras5 barras (1 votos, promedio: 5,00 de 5)
Cargando...

Interacciones con los lectores

Comentarios

  1. Damaris Cubos

    23 abril, 2021

    Hola Jhon, gracias por esta versión mejorada del login.
    Sólo tengo una duda; yo quiero redirigir a una página externa al wordpress. Intenté en el redirect login poner la URL como tú pusiste la de google de ejemplo y no funcionó. Me sigue enviando a la home. No sé si se requiera otro hook o algo más.
    Además sólo quiero que envie a ciertos usuarios con cierto rol a esa página externa.
    ¿Tendrás alguna sugerencia de cómo hacer que funcione este redirect login?
    Gracias y saludos

    • Jhon Marreros Guzmán

      27 abril, 2021

      Hola, la opción de redirección es propia de la función wp_login_form(), si que debería funcionarte https://developer.wordpress.org/reference/functions/wp_login_form/, prueba usando una url absoluta de tu propio sitio.

  2. Richard

    23 mayo, 2021

    Hola excelentes todos tus articulos, quisiera saber la forma de hacer el login desde una base de datos externa donde tengo el usuario y clave, y el usuario se envié a WordPress y lo reconozca como el usuario actual
    Gracias

    • Jhon Marreros Guzmán

      26 mayo, 2021

      Hola, si quieres que WordPress te administre la sesión, los usuarios tienen que estar en la BD de WordPress, por código puedes loguear a un usuario con la función: https://developer.wordpress.org/reference/functions/wp_signon/

  3. Milton rubio

    18 enero, 2022

    hola Jhon, excelentes todos tus articulos. Me gustaria saber la forma de que el avatar se muestre circular y no cuadrado. da antemano gracias.

    • Jhon Marreros Guzmán

      19 enero, 2022

      Hola, puedes aplicar estilos CSS sobre el HTML generado, posiblemente border-radius=20px; revisa el siguiente artículo relacionado: https://decodecms.com/usar-el-inspector-de-codigo-para-modificar-un-theme-wordpress/

  4. Pedro S

    19 septiembre, 2022

    Hola John, como siempre gran artículo. ¿Es posible que si el usuario no añade correctamente sus datos no le redirija a la página de login por defecto de WordPress y se quede en la actual?

    • Jhon Marreros Guzmán

      23 septiembre, 2022

      Hola, Pedro, al ser wp_login_form() una función de WordPress, no veo que haya argumentos que brinden ese comportamiento: https://developer.wordpress.org/reference/functions/wp_login_form/ , en ese caso se tendría que hacer un formulario personalizado. Espero hacer un artículo sobre eso.

Para escribir código envolver con: <pre class="language-xxx"><code> </code></pre> ,reemplaza las xxx (php, css, html)

*

* Gravatar habilitado

Barra lateral principal

Presentación

Curso Decodifica WordPress

Únete a DecodeCMS

Recibirás como regalo:

Guia práctica con video:
¿Quieres agregar código a WordPress? Revisa las diferentes opciones que tienes.Ver más

Jooble
Alojamiento Wordpress

Niveles

Básico Intermedio Avanzado

Etiquetas

accesibilidad css dashboard editor error funcionalidad herramientas imagen js librería mejoras optimización seguridad social woocommerce

Populares

Mover barra lateral al inicio en móviles

Apuntar el dominio principal de un sitio WordPress a una carpeta

Extraer un sitio desde un multisite

Personalizar plantilla para una categoría específica en Woocommerce

© logo decode pie
Política de Privacidad | Política de devoluciones
Copyrigth 2023 Todos los derechos reservados