Imagine que un usuario intenta restablecer su contraseña en su sitio de WordPress, solo para ser recibido por un formulario genérico que no se parece en nada a su sitio web bellamente diseñado. Esto puede confundir a los visitantes, sobre todo si tienes un sitio en el que la gente se hace miembro o accede a menudo.
Hemos trabajado con muchos sitios web a lo largo de los años. Hemos visto cómo hacer que la página de restablecimiento de contraseña se parezca al resto del sitio ayuda a los usuarios y les hace sentirse más cómodos cuando tienen que cambiar su contraseña.
En este artículo, le mostraremos cómo cambiar el aspecto de la página de restablecimiento de contraseña de WordPress, creando una experiencia coherente y visualmente atractiva que tranquilice a los usuarios.
¿Por qué personalizar la página de restablecer contraseña en WordPress?
Su sitio web WordPress incluye un potente sistema de gestión de usuarios que permite crear una cuenta de usuario, iniciar sesión y restablecer la contraseña.
Estas páginas muestran la marca y el logotipo de WordPress por defecto. A veces, esto no es un gran problema, especialmente si usted o su equipo son las únicas personas que inician sesión en el área de administración.
Sin embargo, si tiene una tienda de comercio electrónico o un sitio de afiliación, es posible que sus clientes también tengan que iniciar sesión.
Puede ofrecer una experiencia de usuario mucho mejor personalizando estas páginas para que coincidan con el diseño y la marca de su sitio web. Si lo desea, también puede añadir contenido adicional, como su logotipo o una lista de publicaciones recientes.
Es posible que ya haya seguido nuestras otras guías sobre cómo añadir un formulario de registro de usuario personalizado y una página de inicio de sesión.
Veamos ahora cómo personalizar la página de restablecimiento de contraseña. Simplemente utilice los enlaces rápidos a continuación para saltar directamente al método que desea utilizar:
Método 1: Personalizar la página de restablecer contraseña con Formularios Formidable (Fácil)
La forma más fácil de reemplazar la página de restablecimiento de contraseña de WordPress es usando Formidable Forms. Este plugin te permite reemplazar la página de restablecimiento de contraseña por defecto usando un shortcode.
Este método no le permite editar el formulario de restablecimiento de contraseña, pero puede añadir su propio contenido. Por ejemplo, puedes añadir texto, imágenes y otros contenidos utilizando el editor de entradas estándar de WordPress.
En primer lugar, debes instalar el plugin Formidable Forms. Para obtener más información, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.
Tras la activación, también tendrá que instalar Formularios Formidable Lite. Este plugin gratuito proporciona el núcleo para las características más avanzadas del plugin premium.
Una vez hecho esto, vaya a la página Formularios Formulables ” Configuración Global en su panel de control y seleccione ‘Haga clic para introducir una clave de licencia manualmente’.
Encontrará la clave de licencia en su cuenta del sitio web de Formularios Formidables. Después de introducir esta información, siga adelante y haga clic en el botón “Guardar licencia”.
A continuación, debe instalar el Complemento de Registro de Usuario yendo a Formidable ” Complementos. En esta pantalla, busque el complemento Registro de usuario y haga clic en su botón “Instalar”.
Ahora está listo para crear una página personalizada para restablecer la contraseña yendo a Páginas ” Añadir nueva.
Para empezar, dale un título a la página y luego haz clic en el botón +. En el mensaje / ventana emergente que aparece, empieza a escribir ‘Shortcode’.
Basta con hacer clic en el bloque de la derecha para añadirlo a la página.
Ahora puede añadir el siguiente shortcode: [frm-restablecer-contraseña]
.
En este punto, puede añadir cualquier otro contenido que desee mostrar en la página de restablecimiento de contraseña.
Cuando estés satisfecho con el diseño de la página, haz clic en el botón “Publicar” para activarla.
Por último, debe indicar a WordPress que utilice esta página en lugar de la página de restablecimiento de contraseña predeterminada. Para ello, dirígete a Formidable ” Configuración global y haz clic en la pestaña “Registro” del menú.
Desde aquí, abra el menú desplegable “Página de restablecimiento de contraseña” y elija la página que acaba de crear.
No olvide hacer clic en el botón “Actualizar” de la parte superior de la pantalla para almacenar sus ajustes.
Ahora puede visitar su sitio web WordPress para ver la página personalizada de restablecer contraseña en acción.
Método 2: Personalizar todas las páginas de membresía usando ‘Theme My Login’ (Gratis)
Para proporcionar una experiencia de usuario consistente, es una buena idea utilizar el mismo estilo en todas sus páginas de membresía. Theme My Login es un plugin gratuito que te permite reemplazar las páginas integradas del escritorio de WordPress, de acceso, de cierre de sesión, de registro, de olvido de contraseña y de restablecer contraseña.
No es la solución más personalizable, pero todas sus páginas utilizarán tu tema de WordPress.
Lo primero que tienes que hacer es instalar y activar el plugin Theme My Login. Para más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.
Al activarlo, el Tema Mi Cuenta crea automáticamente URLs para sus pantallas personalizadas de acceso / salida, registro, pérdida de contraseña y restablecer contraseña. Puede ver estas URLs yendo a la página General de Theme My Login.
Para sustituir cualquiera de estas páginas, basta con crear una nueva página con esta URL exacta.
Para crear una página personalizada de WordPress para restablecer la contraseña, vaya a Página ” Añadir nuevo. Aquí, haz clic en el icono ‘+’ y empieza a escribir ‘Shortcode.’
Cuando aparezca el bloque adecuado, haz clic en él para añadirlo a la página.
Dentro del bloque, añade el siguiente shortcode:
[tema-my-login action="contraseña-perdida"]
Ahora puedes añadir cualquier contenido adicional que quieras mostrar en la página de restablecimiento de contraseña, como tu logotipo. Cuando estés satisfecho con cómo se ha establecido la página, haz clic en “Guardar borrador”.
Después, ve a Páginas ” Todas las páginas y busca la página de restablecimiento de contraseña que acabas de crear.
Basta con pasar el ratón por encima de la página y hacer clic en el botón “Edición rápida” cuando aparezca.
En el campo “Slug”, escribe “lostpassword”.
A continuación, abra el menú desplegable “Estado” y seleccione “Publicado”.
Una vez hecho esto, haz clic en “Actualizar”. Ahora, si usted visita su blog de WordPress, verá la página de contraseña perdida en vivo.
Para reemplazar las otras páginas de membresía incorporadas en WordPress, simplemente siga los pasos descritos anteriormente, pero asegúrese de utilizar el URL slug y shortcode correctos.
Por ejemplo, si quisieras crear una página personalizada para restablecer la contraseña, tendrías que usar el shortcode [theme-my-login action="resetpass"]
. También tendrás que cambiar el ‘URL slug’ a resetpassword
.
Método 3: Crear una página para restablecer la contraseña usando WPForms (completamente personalizable)
Si desea reemplazar la página de restablecimiento de contraseña por defecto con un formulario completamente personalizado, le recomendamos que utilice WPForms.
Este plugin tiene una plantilla de ‘Formulario de restablecimiento de contraseña de usuario’ que puedes personalizar con tu propio texto, imágenes e imagen de marca / marca. Usted puede incluso añadir y eliminar campos para recoger exactamente la información que desea de los miembros.
Lo primero que debe hacer es instalar y activar el plugin WPForms. Para más detalles, consulte nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.
Tras la activación, diríjase a WPForms ” Ajustes e introduzca su clave de licencia. Puede encontrar esta información en su cuenta en el sitio web de WPForms.
Después de introducir la clave de licencia, deberá instalar la extensión Registro de usuarios, que le permite crear formularios personalizados de registro de usuarios, restablecer contraseñas y acceder / acceder a su sitio.
En el Escritorio, vaya a WPForms ” Extensiones y busque la extensión Registro de Usuarios.
Basta con hacer clic en “Instalar extensión” para descargarla y, a continuación, en “Activar” para ponerla en funcionamiento.
Ahora está listo para crear su propio formulario personalizado de restablecimiento de contraseña yendo a la página WPForms ” Añadir nuevo. Aquí, escriba un título para el nuevo formulario.
Una vez hecho esto, desplácese hasta la plantilla “Formulario de restablecimiento de contraseña de usuario” y haga clic en su botón “Usar plantilla”.
WPForms cargará ahora la plantilla del formulario de restablecimiento de contraseña de usuario.
Para personalizar cualquier campo con su propio texto, etiqueta o descripción, sólo tiene que hacer clic para seleccionarlo y, a continuación, utilizar los ajustes del menú de la izquierda.
Por ejemplo, la plantilla tiene un botón “Enviar”. Para mostrar una etiqueta de botón diferente, simplemente haga clic para seleccionar el campo y luego escriba un nuevo mensaje en ‘Submit Button Text.’
También puede cambiar lo que ocurre cuando un usuario envía su solicitud de restablecer contraseña yendo a Ajustes ” Confirmaciones.
Aquí, abra el menú desplegable “Tipo de confirmación” y elija si desea redirigir al usuario a una página o URL diferente o simplemente mostrar un mensaje pidiéndole que marque / compruebe en su bandeja de entrada si ha recibido un correo electrónico para restablecer la contraseña.
También puede personalizar el mensaje escribiéndolo en el pequeño editor de texto. Por ejemplo, puede recordar a los usuarios que comprueben sus carpetas de Spam.
Consejo profesional: Si tus correos electrónicos se envían regularmente a spam, te recomendamos que utilices un proveedor de servicios SMTP para mejorar la tasa de entrega de tus correos electrónicos.
Cuando esté satisfecho con el formulario establecido, haga clic en el botón “Guardar” situado en la esquina superior derecha de la pantalla.
Para reemplazar la página de restablecimiento de contraseña predeterminada de WordPress, cree una página con el slug ‘una contraseña’. A continuación, añade el formulario a esa página.
La forma más fácil de hacerlo es hacer clic en el botón ‘Incrustar’ en el editor de WPForms y seleccionar ‘Crear nueva página.’
Ahora, escribe un título para la nueva página. Cambiarás el slug en un paso posterior, así que puedes usar lo que quieras.
Una vez hecho esto, haz clic en “Vamos”.
Esto le lleva al editor de páginas de WordPress, donde el formulario ya se ha añadido a la nueva página. Ahora puede realizar cualquier cambio en esta página, como añadir más texto, un logotipo personalizado o categorías y etiquetas.
Cuando estés satisfecho con el aspecto de la página, haz clic en el botón “Guardar borrador”.
Después, ve a Páginas ” Todas las páginas y busca la página de restablecimiento de contraseña que acabas de crear.
Aquí, haga clic en el botón “Edición rápida”.
En el campo “Slug”, escribe “lostpassword”.
A continuación, abra el menú desplegable “Estado” y seleccione “Publicado”.
Ahora, necesita redirigir a los visitantes a la página personalizada de restablecimiento de contraseña en lugar de la página incorporada de WordPress. La forma más sencilla de hacerlo es utilizando el plugin gratuito WPCode.
WPCode es el mejor plugin de fragmentos de código utilizado por más de 2 millones de sitios web de WordPress. Facilita la adición de código personalizado en WordPress sin tener que editar el archivo functions.php.
Con WPCode, incluso los principiantes pueden editar el código de su sitio web sin arriesgarse a cometer errores y erratas que pueden causar muchos errores comunes de WordPress.
Lo primero que tienes que hacer es instalar y activar el plugin gratuito WPCode. Para más detalles, consulta nuestra guía paso a paso sobre cómo instalar un plugin de WordPress.
Una vez activado, diríjase a Fragmentos de código ” Añadir fragmento.
Aquí encontrarás fragmentos de código listos para usar que te permitirán subir otros tipos de archivo a WordPress, desactivar páginas de adjuntos, desactivar completamente los comentarios y mucho más.
Simplemente pase el ratón por encima de “Añada su código personalizado” y haga clic en “Usar fragmento” cuando aparezca.
Para empezar, escriba un título para el fragmento de código personalizado. Puede ser cualquier cosa que le ayude a identificar el fragmento en el escritorio de WordPress.
A continuación, abra el menú desplegable “Tipo de código” y seleccione “Fragmento de código PHP”.
En el editor de código, añada el siguiente fragmento de código:
add_filter( 'lostpassword_url', 'my_lostpassword_url' );
function my_lostpassword_url() {
return site_url('/lostpassword/');
}
A continuación, desplázate hasta la sección ‘Inserción’. WPCode puede añadir código en diferentes lugares, como después de cada entrada, solo portada / vista pública, o solo administrador.
Para utilizar el código PHP personalizado en todo tu sitio web, blog o tienda WooCommerce, haz clic en “Insertar automáticamente” si aún no está seleccionado. A continuación, abre el menú desplegable “Ubicación” y selecciona “Ejecutar en todas partes”.
A continuación, desplázate hasta la parte superior de la pantalla y haz clic en el conmutador “Inactivo” para cambiarlo a “Activo”.
Por último, haga clic en “Guardar fragmento” para activar el fragmento de código PHP.
Ahora, intente acceder a la pantalla de acceso de WordPress.
Si hace clic en el enlace “¿Ha olvidado su contraseña?”, se le redirigirá a la página de restablecimiento de contraseña personalizada que acaba de crear.
Dependiendo de cómo esté establecido su sitio, puede que tenga que actualizar los enlaces para restablecer la contraseña en otras páginas.
Si ha creado una página de acceso personalizada para WordPress utilizando un plugin como WPForms, también le recomendamos que añada a este formulario el enlace para restablecer la nueva contraseña.
Guías de expertos para personalizar páginas de WordPress
Esperamos que este tutorial te haya ayudado a aprender cómo personalizar la página de restablecer contraseña de WordPress. Puede que también quieras ver algunos tutoriales sobre cómo mejorar la seguridad de acceso / acceso en WordPress:
- Cómo crear una página de acceso personalizada en WordPress (Guía definitiva)
- Cómo y por qué debería limitar los intentos de acceso en WordPress
- Cómo añadir preguntas de seguridad a la pantalla de acceso de WordPress
- Cómo añadir una URL de acceso personalizada en WordPress (paso a paso)
- Consejos vitales para proteger el área de administración de WordPress
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Rowdy
Hello, do I need to have a paid license for the first method with Formidable Forms ?
WPBeginner Support
Yes, at the moment user registration is part of the paid plan.
Administrador
Lennon
your article is nice and helpful
WPBeginner Support
Glad you found our guide helpful!
Administrador