Cómo personalizar una página protegida con contraseña en WordPress

Publicado: 2022-10-12

¿Desea crear una página personalizada protegida con contraseña en su sitio web?

Puede ocultar contenido y restringir el acceso a ciertas páginas utilizando la protección con contraseña de WordPress. Sin embargo, el diseño predeterminado de inicio de sesión y entrada de contraseña es simple y no atractivo.

En este artículo, le mostraremos cómo personalizar páginas protegidas con contraseña en WordPress.

Cómo personalizar una página protegida con contraseña en WordPress

¿Por qué personalizar las páginas protegidas con contraseña en WordPress?

Si desea crear una página o una publicación en su blog de WordPress que solo debería ser visible para clientes o miembros seleccionados, puede usar la función de protección con contraseña para bloquear el contenido.

Del mismo modo, si está creando un nuevo sitio web de WordPress y no quiere que todos lo vean, entonces tiene sentido usar una página protegida con contraseña.

Sin embargo, el diseño de página predeterminado protegido por contraseña es muy básico y no atractivo. Aquí hay una vista previa de cómo se ve:

Una página básica protegida con contraseña

La personalización de la página protegida con contraseña le permite cambiar su diseño y disposición de la manera que desee. Ayuda a que su página sea más atractiva y puede combinarla con su marca para obtener una apariencia más profesional y una mejor experiencia de usuario.

Dicho esto, le mostraremos cómo habilitar la protección con contraseña en WordPress y diferentes formas de personalizar una página específica, todo su sitio y diferentes secciones.

Puede hacer clic en los enlaces a continuación para saltar a su sección preferida:

  • Cómo proteger con contraseña una página en WordPress
  • Personalice el diseño protegido por contraseña predeterminado usando CSS Hero
  • Personalice una página específica protegida con contraseña usando SeedProd
  • Cree una página personalizada protegida con contraseña para todo el sitio web
  • Cree secciones protegidas con contraseña en WordPress (bueno para cursos y contenido premium)

Cómo proteger con contraseña una página en WordPress

Antes de que le mostremos cómo personalizar una página de WordPress, debe saber que WordPress viene con configuraciones integradas para proteger con contraseña sus páginas y publicaciones.

Todo lo que tiene que hacer es editar una página o agregar una nueva. Una vez que esté en el editor de contenido de WordPress, continúe y haga clic en la opción 'Público' en 'Estado y visibilidad' en el panel de configuración a su derecha.

Cambiar la configuración de visibilidad en el editor de contenido

A continuación, verá diferentes opciones de visibilidad de publicaciones.

Simplemente seleccione la opción 'Protegido con contraseña' e ingrese una contraseña para su página.

Seleccione la opción protegida con contraseña

Ahora, continúe y haga clic en 'Actualizar' o 'Publicar', y la página en vivo estará protegida por una contraseña.

Ahora puede visitar su sitio web y ver la página en acción.

Vista previa de la página protegida por contraseña usando el editor de contenido

Ahora, veamos cómo puede personalizar su página predeterminada protegida con contraseña.

Personalice el diseño protegido por contraseña predeterminado usando CSS Hero

Cuando habilita la protección con contraseña desde su editor de contenido de WordPress, la página usa el tema de su sitio para diseñar.

Para personalizar la página, simplemente puede usar una herramienta como CSS Hero. Le permite editar el diseño y el diseño de su página sin editar el código.

Primero, deberá instalar y activar el complemento CSS Hero. Para obtener más detalles, consulte nuestra guía sobre cómo instalar un complemento de WordPress.

Tras la activación, la opción de héroe CSS se agregará a la barra de administración de WordPress en la parte superior. Continúe y haga clic en la opción 'Personalizar con CSS Hero'.

Personaliza con CSS hero

Esto iniciará el generador visual CSS Hero, donde puede editar y personalizar su página.

Para comenzar, simplemente haga clic en cualquier elemento de la página.

Haga clic en un elemento para comenzar a editar

A continuación, puede cambiar los colores de fondo, agregar una imagen de fondo, usar una fuente diferente, editar el espaciado y más desde el panel a su izquierda.

Por ejemplo, agreguemos un color de fondo con un efecto degradado yendo a la pestaña 'Fondo'. También cambiaremos el color del cuadro donde los usuarios deben escribir la contraseña, así como el color del botón 'Entrar'.

Cambiar el color de fondo

Además de eso, puede agregar un borde alrededor del encabezado principal de la página yendo a la pestaña Bordes.

Simplemente elija un ancho de borde, color, estilo y cualquier otro cambio que desee.

Edite los bordes y guarde sus cambios

Cuando haya realizado el cambio, no olvide hacer clic en el botón 'Guardar y publicar' en la parte inferior.

Ahora puede visitar su sitio web para ver la página protegida por contraseña predeterminada personalizada.

Vista previa de la página personalizada protegida con contraseña con CSS hero

El inconveniente de usar CSS Hero es que no obtiene la flexibilidad y las opciones de personalización avanzadas que ofrece un creador de páginas de destino.

Por ejemplo, no puede agregar elementos como formularios de contacto, botones de redes sociales, formularios de suscripción, temporizadores de cuenta regresiva y más usando CSS Hero.

Dicho esto, veamos cómo puede usar un generador de páginas de destino para personalizar páginas específicas en WordPress.

Personalice una página específica protegida con contraseña usando SeedProd

La forma más fácil de personalizar una página específica protegida con contraseña es usando SeedProd. Es el mejor creador de páginas y sitios web de WordPress.

Para este tutorial, usaremos la versión Pro de SeedProd porque incluye plantillas premium y más funciones de personalización. También puede usar la versión SeedProd Lite de forma gratuita y crear una página próximamente.

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, accederá a la pantalla de bienvenida de SeedProd en su panel de control de WordPress. A continuación, deberá ingresar la clave de licencia y hacer clic en el botón 'Verificar clave'. Puede encontrar la clave de licencia en el área de su cuenta de SeedProd.

Ingrese la clave de licencia de SeedProd

Después de eso, diríjase a SeedProd » Landing Pages desde su panel de WordPress y agregue una nueva página de destino personalizada protegida con contraseña.

Más adelante en este artículo, le mostraremos cómo elegir qué páginas están protegidas con contraseña. Puede proteger con contraseña todo su sitio o solo páginas específicas.

Para este tutorial, crearemos una próxima página para el lanzamiento de un sitio web con protección de contraseña. Sin embargo, puede personalizar su diseño fácilmente si solo lo usa para proteger con contraseña páginas específicas.

Para comenzar, simplemente haga clic en el botón 'Configurar una página próximamente'.

Crear una nueva página próximamente

En la siguiente pantalla, SeedProd le mostrará diferentes plantillas de página, para que pueda personalizarlas rápidamente.

Continúe, desplace el cursor sobre cualquier plantilla que desee usar y haga clic en el botón de marca de verificación naranja.

Elige una plantilla

Después de seleccionar una plantilla, SeedProd abrirá una ventana emergente titulada 'Ingrese los detalles de su nueva página'.

Solo necesita seleccionar un nombre de página y un slug de URL, y luego simplemente hacer clic en el botón 'Guardar y comenzar a editar la página'.

Introduzca un nombre de plantilla de página

Esto iniciará el generador de páginas de arrastrar y soltar de SeedProd.

Aquí puede personalizar su página de destino protegida con contraseña y agregar diferentes elementos como texto, imágenes, botones y más. SeedProd ofrece bloques avanzados como formulario de suscripción, formulario de contacto, temporizador de cuenta regresiva, barra de progreso, opciones para compartir en redes sociales y más.

Para agregar un elemento, simplemente puede arrastrar cualquier bloque del menú a su izquierda y soltarlo en la plantilla a la derecha. Luego puedes personalizar el elemento simplemente haciendo clic en él y ajustando las opciones que aparecen.

Agrega bloques a tu plantilla

Así es también como SeedProd le permite agregar un formulario de contraseña en la parte frontal de su página para proteger su contenido.

Primero, puede agregar un bloque 'HTML personalizado' en el generador SeedProd. Simplemente arrastre y suelte el bloque HTML personalizado en la plantilla.

Agregar bloque HTML personalizado

A continuación, puede hacer clic en el bloque HTML personalizado.

Desde aquí, ingrese el código abreviado [seed_bypass_form] en el campo 'Código personalizado'. ¡Eso es todo! No olvide hacer clic en el botón 'Guardar' cuando haya terminado.

Ingrese el código abreviado

SeedProd también se integra con diferentes servicios de marketing por correo electrónico. Puede agregar un formulario de contacto a su página de destino y conectar una herramienta de marketing por correo electrónico para crear su lista de correo electrónico y mantenerse en contacto con los usuarios.

Simplemente vaya a la pestaña 'Conectar' en el generador de páginas de destino y seleccione su servicio de marketing por correo electrónico.

Conecte el servicio de marketing por correo electrónico

Configurar la protección con contraseña para páginas específicas en SeedProd

Después de crear una próxima página personalizada que use el código abreviado [seed_bypass_form] , el siguiente paso es configurar la protección con contraseña en páginas específicas usando SeedProd.

Para comenzar, deberá ir a la pestaña 'Configuración de página' en el generador de SeedProd y luego hacer clic en la configuración de 'Control de acceso'.

Después de eso, puede ingresar una contraseña en el campo 'Omitir URL' que las personas pueden usar para acceder a su contenido restringido.

Configuraciones de control de acceso

Tenga en cuenta que el texto que escriba en el campo 'Omitir URL' actuará como la contraseña y también como un enlace que los clientes y los miembros del equipo pueden usar para desviar la protección de la contraseña y acceder a la página.

SeedProd le permite excluir URL específicas de sus sitios como administrador, inicio de sesión, tablero y cuenta. Esto garantiza que los propietarios de los sitios no queden bloqueados en sus sitios.

Ahora, deberá elegir qué URL se protegerán con contraseña.

Simplemente desplácese hacia abajo hasta la sección 'Incluir/Excluir URL' en la configuración de 'Control de acceso'. Después de eso, seleccione la opción 'Incluir URL' y luego ingrese las páginas específicas que desea restringir.

Incluir páginas para proteger con contraseña

Cuando haya terminado, simplemente haga clic en el botón 'Guardar' en la parte superior.

A continuación, puede ir a la configuración 'General' en la pestaña 'Configuración de la página' y cambiar el estado de la página de 'Borrador' a 'Publicar'.

Publica tu página de aterrizaje

Después de eso, puede cerrar el generador de páginas de destino y dirigirse a SeedProd » Landing Pages desde su panel de administración de WordPress.

Desde aquí, haga clic en el interruptor debajo de 'Modo Próximamente' para activar su página personalizada protegida con contraseña.

Activar próximamente la página

¡Eso es todo! Ha creado correctamente una página de destino personalizada protegida con contraseña que solo aparecerá en páginas específicas de WordPress.

Simplemente visite esas páginas en su sitio web para ver la página personalizada protegida con contraseña en acción.

Vista previa de página protegida con contraseña personalizada

Cree una página personalizada protegida con contraseña para todo el sitio web

Usando SeedProd, también puede mostrar su página protegida por contraseña en cada página de su sitio web. De esta manera, los usuarios deberán ingresar una contraseña para obtener acceso a cualquiera de sus contenidos.

Primero, puede ir a SeedProd » Landing Pages desde su tablero de WordPress. Luego, haga clic en el botón 'Editar página' en el panel 'Modo próximamente'.

Editar página próximamente

A continuación, puede dirigirse a la pestaña 'Configuración de página' en la parte superior e ir a la configuración de 'Control de acceso'.

Después de eso, desplácese hacia abajo hasta la sección 'Incluir/Excluir URL' y seleccione la opción 'Mostrar en todo el sitio web'.

Opción Mostrar en todo el sitio web

Una vez que haya realizado los cambios, continúe y haga clic en el botón 'Guardar' en la parte superior.

SeedProd mostrará la página personalizada protegida con contraseña en todo su sitio web.

Cree secciones personalizadas protegidas con contraseña en WordPress

También puede proteger con contraseña diferentes secciones del sitio web en WordPress de diferentes conjuntos de usuarios. Esto es útil si está ejecutando un sitio web de membresía y desea controlar el acceso a su contenido, complementos, aplicaciones y otros archivos descargables.

La mejor manera de restringir diferentes partes de su sitio web es usando MemberPress. Es el mejor complemento de membresía de WordPress que le permite crear múltiples niveles de membresía para proteger su contenido con contraseña.

Puede usar MemberPress para configurar diferentes reglas, de modo que los usuarios solo puedan acceder al contenido según su nivel de membresía. Para obtener más detalles, consulte nuestra guía sobre cómo crear un sitio de membresía de WordPress.

Para comenzar, primero deberá agregar membresías a su sitio web. Simplemente vaya a MemberPress » Membresías desde su panel de WordPress y haga clic en el botón 'Agregar nuevo'.

Agregar nuevo plan de membresía

Después de eso, puede ingresar un nombre para su nivel de membresía, agregar una descripción y establecer un precio.

También puede cambiar el tipo de facturación de una vez a recurrente, así como editar la membresía para que sea de por vida o caduque después de un cierto período de tiempo.

Agregar un nivel de membresía

No olvide hacer clic en el botón 'Publicar' cuando haya terminado.

A continuación, puede ir a MemberPress » Reglas desde su panel de WordPress y hacer clic en el botón 'Agregar nuevo'.

Agregar nueva regla de membresía

Desde aquí, puede hacer clic en el menú desplegable bajo la opción 'Contenido protegido'. MemberPress ofrece muchas opciones para proteger su contenido, ya sea una sola página o todas sus páginas de WordPress.

Para este tutorial, protegeremos con contraseña una sola página. Simplemente elija la opción 'Una sola página' del menú desplegable e ingrese el título de la página.

Configurar reglas para la protección con contraseña

A continuación, deberá configurar las Condiciones de acceso y configurar quién puede ver la página restringida. MemberPress le permite proteger el contenido según el nivel de membresía, el rol de usuario de WordPress, la capacidad y los miembros individuales.

Configuremos 'Membresía' como 'Premium' en los menús desplegables de este tutorial. De esta manera, solo los miembros premium podrán acceder a la página. Puede agregar más condiciones y permitir que más de 1 nivel de membresía vea la página.

Cuando haya terminado, no olvide hacer clic en el botón 'Guardar regla'.

A continuación, puede visitar su sitio web para ver la página protegida con contraseña en acción. Los miembros tendrán que iniciar sesión en su cuenta para ver el contenido de la página.

Ver página de membresía protegida con contraseña

Puede configurar contraseñas para sus videos o puede ofrecer membresías grupales para equipos corporativos. Además, puede crear una contraseña para dar a los suscriptores acceso a un boletín de pago y más.

También tenemos una guía sobre cómo proteger con contraseña sus formularios en WordPress.

Esperamos que este artículo le haya ayudado a aprender cómo personalizar una página protegida con contraseña en WordPress. También puede consultar nuestra guía sobre cómo crear un tema de WordPress completamente personalizado sin escribir ningún código, o nuestra comparación de los mejores complementos SEO de WordPress.

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.