Cómo personalizar el formulario de restablecimiento de contraseña de WordPress

El formulario de restablecimiento de contraseña predeterminado de WordPress es bastante básico. Cumple su función, pero no es exactamente "profesional" ni encaja con el aspecto de tu marca.

Sin una solución personalizada de WordPress para formularios de contraseñas, estás perdiendo la oportunidad de mantener intacta la coherencia de tu marca. Además, no puedes añadir instrucciones útiles o personalizar los mensajes para guiar a los usuarios a través del proceso de restablecimiento sin problemas.

Aquí es donde el complemento WPForms User Registration resulta útil. Le permite crear un formulario de restablecimiento de contraseña totalmente personalizado que realmente parece que pertenece a su sitio.

Puedes adaptarlo a los colores, fuentes y diseño general de tu sitio web y, al mismo tiempo, proporcionar instrucciones claras y útiles. Así que, sin más dilación, sigue los pasos de esta guía para personalizar tu formulario de restablecimiento de contraseña de WordPress.

Crea ya tu formulario personalizado de restablecimiento de contraseña 🚀

Cómo crear un formulario personalizado de restablecimiento de contraseña en WordPress

Para crear un formulario personalizado de restablecimiento de contraseña, necesitará suscribirse a la versión Premium de WPForms. La licencia Pro incluye el addon Registro de Usuario que le permite crear formularios personalizados de restablecimiento de contraseña, registro de usuario y login para su sitio web WordPress. ¡Comencemos!

Paso 1: Instalar el plugin WPForms

Primero, descargue e instale WPForms. Para este tutorial, necesitará la versión pro en lugar de WPForms Lite. Si necesitas ayuda, consulta esta guía para instalar plugins de WordPress.

Después de instalar el plugin, inicie sesión en su cuenta WPForms y haga clic en la pestaña Descargas. Esta es una página con todas sus licencias disponibles.

Para descargar el plugin, haga clic en el botón Descargar WPForms junto a la licencia pro. Esto guardará un archivo comprimido del plugin WPForms en su ordenador.

Después de descargar el archivo zip, diríjase a su sitio WordPress donde desea instalar WPForms. A continuación, en el panel de administración, haga clic en Plugins " Añadir nuevo y, a continuación, en el botón Cargar plugin.

Desde aquí, haga clic en el botón Elegir archivo y seleccione el archivo zip WPForms que acaba de descargar. Una vez cargado el archivo, haga clic en el botón Instalar ahora.

Una vez instalado el plugin, haga clic en el botón Activar Plugin para activar WPForms en su sitio. Después de activar el plugin, recuerde verificar su clave de licencia de WPForms para recibir actualizaciones automáticas y soporte del plugin.

Si añade su clave de licencia, también podrá instalar y activar fácilmente los complementos WPForms desde el panel de control de WordPress.

Paso 2: Activar el complemento de registro de usuarios

Ahora que WPForms está listo para funcionar, necesitará el complemento Registro de usuario para crear formularios personalizados de restablecimiento de contraseña. En el área de administración de WordPress, diríjase a WPForms " Complementos en el menú de la barra lateral izquierda.

Si no ve ningún complemento para su nivel de licencia, haga clic en el botón Actualizar complementos para forzar una actualización.

Para buscar el complemento Registro de usuarios, escriba su nombre en el campo Buscar complementos situado en la esquina superior derecha de la página.

Una vez que lo haya encontrado, simplemente haga clic en el botón Instalar complemento.

Esto instalará y activará automáticamente el complemento. Cualquier addon que esté instalado y listo para usar mostrará Status: Activo.

Paso 3: Utilice la plantilla de formulario de restablecimiento de contraseña

Ahora, es el momento de crear su formulario de contraseña personalizado en WordPress. Dirígete a WPForms " Añadir nuevo en tu panel de control para empezar a crear tu nuevo formulario.

Busque "Restablecimiento de contraseña" en la biblioteca de plantillas y, a continuación, pase el ratón por encima de la opción Formulario de restablecimiento de contraseña de usuario y haga clic en Usar plantilla.

Una vez que haya seleccionado la plantilla, el formulario de restablecimiento de contraseña se cargará en su pantalla. Esta plantilla está diseñada específicamente para la funcionalidad de restablecimiento de contraseña y viene con todos los campos esenciales ya configurados.

El formulario incluye automáticamente un campo de correo electrónico donde los usuarios pueden introducir su dirección de correo electrónico registrada. Este es el componente central que hace funcionar el proceso de restablecimiento de contraseña.

Siempre personalizo el título y la descripción del formulario para que coincidan con la marca del sitio web. Haz clic en el título del formulario en la parte superior para editarlo. Podrías cambiarlo del predeterminado a algo como "Restablece tu contraseña" u "¿Olvidaste tu contraseña?".

No es una buena idea añadir o eliminar ningún campo de esta plantilla porque sirve a un propósito muy específico de forma óptima. Veamos la configuración de restablecimiento del correo electrónico en el siguiente paso.

Paso 4: Configurar el correo electrónico de restablecimiento de contraseña

Ahora es el momento de ajustar cómo funciona el proceso de restablecimiento de contraseña. Dirígete a Configuración " Registro de usuarios en tu creador de formularios para acceder a todas las opciones de restablecimiento de contraseña.

Lo primero que debe hacer es activar la función de restablecimiento de contraseña. Yo siempre me aseguro de que esta opción esté activada, de lo contrario los usuarios no podrán restablecer sus contraseñas a través del formulario personalizado.

Una vez activado, puedes personalizar la línea de asunto del correo electrónico de restablecimiento. El predeterminado puede funcionar, pero yo prefiero hacerlo coincidir con la voz de mi marca. Algo como "Restablece tu contraseña de [nombre del sitio]" es más personal que un texto genérico.

Si desea editar el mensaje de correo electrónico de restablecimiento, asegúrese de no eliminar el campo {user_registration_password_reset} etiqueta inteligente. Esta etiqueta inteligente crea el enlace de reinicio para que el usuario haga clic.

Desplázate hacia abajo y verás una opción para ocultar el formulario de restablecimiento de contraseña a los usuarios registrados. Si activas esta opción, podrás editar el mensaje que se mostrará cuando un usuario conectado abra el formulario.

Excelente. Una vez que hayas personalizado la configuración, asegúrate de hacer clic en Guardar en la parte superior. En el siguiente paso, incrustaremos el formulario en una nueva página.

Paso 5: Personalizar la apariencia del formulario de restablecimiento de contraseña

Su formulario de restablecimiento de contraseña es funcional, pero ahora es el momento de darle un aspecto atractivo. Un formulario bien diseñado genera confianza y hace que el proceso de restablecimiento parezca más profesional.

WPForms tiene un práctico asistente de incrustación que le permite colocar su formulario dentro de una página nueva o existente directamente desde el constructor de formularios, y luego puede personalizar su apariencia directamente en el editor de bloques.

Una vez guardado el formulario, haz clic en el botón Incrustar. Como queremos incrustar nuestro formulario en una nueva página de restablecimiento de contraseña, seleccionaremos la opción Crear nueva página .

Dele a su página un nombre apropiado y luego haga clic en Let's Go. Después de eso, WPForms abrirá el editor de bloques de WordPress donde encontrará su formulario de restablecimiento de contraseña incrustado.

Ahora, utilice las opciones del bloque WPForms a la derecha para utilizar las características de estilo del formulario y personalizar sus etiquetas, campos y botones en unos pocos clics.

Cuando esté satisfecho con su formulario, pulse Publicar para iniciarlo. Tu formulario de restablecimiento de contraseña ya está activo y listo para usar.

Pero aún no hemos terminado. Es importante asegurarse de que este formulario sea fácil de encontrar para los usuarios en caso de que necesiten restablecer su contraseña. En el siguiente paso, añadiremos el formulario de restablecimiento de contraseña a la navegación principal del sitio.

Paso 6: Añadir el formulario de restablecimiento de contraseña al menú de navegación

Es una buena práctica hacer que tu página de restablecimiento de contraseña sea fácil de encontrar para tus usuarios. Para ello, añadiremos la página del formulario recién creado a la barra de navegación del sitio, en la parte superior.

Esto es fácil de hacer. Simplemente abra su panel de WordPress y vaya a Apariencia " Menús. Es posible que ya tenga un menú de navegación añadido a su sitio.

En ese caso, sólo tendrás que añadir la página de restablecimiento de contraseña al menú. Una vez dentro de la pantalla Menús, haz clic en tu formulario de restablecimiento de contraseña en la columna de la izquierda y, a continuación, pulsa Añadir al menú.

Con esto, la página de restablecimiento de contraseña se añadirá a la pila de páginas actualmente en su menú a la derecha. Pulsa el botón Guardar menú para actualizarla.

El proceso para crear un menú por primera vez es casi similar. Solo tendrás que nombrar primero tu menú y luego pulsar el botón azul Crear menú de la parte inferior.

Una vez hecho esto, puede añadir páginas a su menú siguiendo los pasos indicados anteriormente. He aquí un ejemplo de cómo se ve la navegación para nosotros:

Todo lo que tenemos que hacer ahora es añadir una redirección para que los visitantes que intenten acceder a su página de restablecimiento predeterminada de WordPress sean redirigidos automáticamente a su nueva página personalizada de restablecimiento de contraseña.

Opcional: Añadir redirección al formulario personalizado de restablecimiento de contraseña

Si está creando un formulario personalizado para restablecer contraseñas en su sitio web, puede ser una buena idea crear también un formulario de inicio de sesión personalizado con su marca para su sitio.

Además, asegúrese de añadir una redirección para sustituir la página de inicio de sesión predeterminada de WordPress por la nueva página personalizada. Pero si tu página de inicio de sesión predeterminada sigue siendo accesible, debes añadir una redirección al formulario de restablecimiento de contraseña.

De este modo, si un usuario hace clic en el botón "Lost your password?"de la página de inicio de sesión de WordPress, serán redirigidos a la página personalizada de restablecimiento de contraseña que acaba de crear en lugar del formulario predeterminado de restablecimiento de contraseña de WordPress.

No te preocupes, es más fácil de lo que parece. En primer lugar, vamos a instalar el plugin gratuito WPCode para WordPress. En tu panel de WordPress, dirígete a Plugins " Añadir nuevo.

Desde ahí, busca WPCode y haz clic en Instalar ahora.

Una vez que hayas hecho clic en Activar, es hora de añadir nuestro código. En el panel de WordPress, haz clic en Fragmentos de código " + Añadir fragmento.

Después de hacer clic en eso, verás la biblioteca pre-hecha con diferentes opciones de código que puedes elegir. Haz clic en Usar fragmento bajo la opción Añade tu código personalizado (Nuevo fragmento),

Una vez que haya titulado su fragmento (nosotros hemos elegido "Nueva página de restablecimiento de contraseña"), haga clic en el menú desplegable Tipo de código situado a la derecha de la Vista previa del código y seleccione Fragmento PHP.

Ahora, puede copiar y pegar el siguiente código en el editor:

Recuerde sustituir reset-password en el código anterior con el slug de su nueva página personalizada de restablecimiento de contraseña.

A continuación, desplácese hasta la sección Inserción, que es donde puede especificar el método y la ubicación de inserción.

Recomiendo mantener la selección de ubicación predeterminada Ejecutar en todas partes e Insertar automáticamente para el Método de inserción.

Cuando hayas terminado, haz clic en el botón Guardar fragmento de código de la parte superior derecha. A continuación, haz clic en el interruptor situado junto a él para activar el fragmento de código.

Excelente. Ahora, los usuarios siempre llegarán a su página personalizada de restablecimiento de contraseña cada vez que hagan clic en el enlace de contraseña perdida.

Pasar de un formulario de restablecimiento de contraseña estándar de WordPress a un formulario de restablecimiento personalizado de WPForms le aporta muchas ventajas, además de mejorar su imagen de marca.

Por ejemplo, puede añadir funciones de protección contra el spam utilizando el antispam incorporado de WPForms junto con opciones útiles como establecer un tiempo mínimo para enviar un formulario para mantener a raya a los spambots.

Para más detalles, puede seguir nuestra guía para evitar el restablecimiento no autorizado de contraseñas en WordPress, ¡y eliminar estas solicitudes de spam!

Preguntas frecuentes sobre cómo personalizar el formulario de restablecimiento de contraseña

Aquí hay algunas preguntas comunes que recibo sobre la personalización del formulario de restablecimiento de contraseña de WordPress con WPForms.

¿Puedo personalizar la plantilla del correo electrónico de restablecimiento de contraseña?

Sí, puedes personalizar el correo electrónico de restablecimiento de contraseña que reciben los usuarios. En la configuración de Notificaciones de tu formulario, puedes modificar la línea de asunto, el contenido del correo electrónico e incluso añadir tu propia marca.

Suelo incluir instrucciones claras y establecer expectativas sobre lo que ocurre a continuación. Puedes utilizar etiquetas inteligentes para personalizar el mensaje con el nombre del usuario u otros detalles de su envío.

¿Cómo redirijo a los usuarios después de que envíen el formulario de restablecimiento de contraseña?

Usted tiene algunas opciones para esto. Vaya a Configuración " Confirmaciones en su creador de formularios y elija Mostrar página o Ir a URL (Redirigir).

A menudo redirijo a los usuarios a una página personalizada de "comprueba tu correo electrónico" que les indica claramente los pasos a seguir. Es más profesional que mostrar un mensaje genérico de éxito.

¿Puedo añadir campos adicionales al formulario de restablecimiento de contraseña?

Por supuesto. Aunque el restablecimiento básico de contraseña sólo necesita un campo de correo electrónico, puede añadir preguntas de seguridad, números de teléfono u otros campos de verificación utilizando cualquiera de los tipos de campo disponibles en WPForms.

Recuerda que añadir demasiados campos puede disuadir a los usuarios de rellenar el formulario. Yo intento que sea sencillo pero que permita obtener la verificación necesaria.

¿Qué ocurre si un usuario introduce una dirección de correo electrónico que no está registrada?

El addon de Registro de Usuarios se encargará de esto automáticamente. Si alguien introduce una dirección de correo electrónico que no existe en su base de datos de usuarios, no recibirá un mensaje de restablecimiento, pero tampoco recibirá un mensaje de error (esto evita que la gente busque direcciones de correo electrónico válidas).

Desde la perspectiva del usuario, verá el mismo mensaje de confirmación a pesar de todo. Es una función de seguridad que aprecio mucho.

¿Cómo puedo adaptar el formulario de restablecimiento de contraseña a mi tema?

WPForms le da varias opciones de estilo directamente en el constructor de formularios. Haga clic en su formulario incrustado en el editor de páginas para acceder al panel de estilo, donde se puede elegir entre los temas pre-hechos o personalizar los colores, fuentes, y el espaciamiento.

Para una personalización más avanzada, puedes añadir CSS personalizado a tu tema. En mi opinión, las opciones de estilo integradas resuelven la mayoría de los casos sin necesidad de código.

¿Puedo desactivar el restablecimiento de contraseña predeterminado de WordPress y utilizar sólo mi formulario personalizado?

Sí, pero esto requiere cierto trabajo técnico. Tendrías que añadir código personalizado al archivo functions.php de tu tema para anular el comportamiento de restablecimiento de contraseña predeterminado de WordPress.

Normalmente recomiendo mantener ambas opciones disponibles. Tu formulario de contraseña personalizado de wordpress puede ser el método principal, mientras que el restablecimiento predeterminado de WordPress sirve como copia de seguridad para los usuarios que lo necesiten.

¿Cómo evito el envío de spam en mi formulario de restablecimiento de contraseña?

WPForms incluye varias características anti-spam que puede habilitar. Activa el campo Captcha personalizado o activa hCaptcha en la pestaña Configuración " General de tu formulario.

También puedes limitar el envío de formularios por dirección IP o activar la función de honeypot. He comprobado que estos métodos funcionan bien juntos para detener la mayor parte del spam sin frustrar a los usuarios reales.

¿Puedo saber cuántas solicitudes de restablecimiento de contraseña recibo?

Sí, WPForms registra automáticamente todas las entradas de formularios, incluyendo las solicitudes de restablecimiento de contraseña. Vaya a WPForms " Entradas para ver los detalles del envío, las fechas y la información del usuario.

Si necesitas un análisis más detallado, puedes conectar tu formulario a Google Sheets utilizando el complemento de Google Sheets para realizar un seguimiento de los patrones a lo largo del tiempo. Esto me ayuda a detectar actividad inusual o identificar si los usuarios tienen problemas con partes específicas del proceso.

A continuación, personalice la página de restablecimiento de contraseña

Una vez que hayas incrustado el formulario de restablecimiento de contraseña en tu nueva página, deberás ponerle tu marca.

¿Por qué? Si pone su marca en el formulario y la página de restablecimiento de contraseña, consolidará la idea de que su empresa es legítima y aumentará la credibilidad general de su marca.

Sigue nuestra guía completa para crear y personalizar páginas de formularios en WordPress. Además, puede que quieras aprender cómo personalizar una página protegida con contraseña en WordPress.

Consulta también nuestra guía sobre cómo personalizar los colores de tu tema de WordPress y dar estilo a tus formularios para que coincidan con los colores de tu marca.

Cree su formulario Wordpress ahora

¿Listo para crear tu formulario? Empieza hoy mismo con el plugin más sencillo para crear formularios en WordPress. WPForms Pro incluye un montón de plantillas gratuitas y ofrece una garantía de devolución de dinero de 14 días.

Si este artículo te ha ayudado, síguenos en Facebook y Twitter para más tutoriales y guías gratuitas sobre WordPress.