Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Copa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

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

La protección por contraseña ayuda a mantener la privacidad de ciertas páginas, y crear una página personalizada protegida por contraseña en su sitio de WordPress es muy fácil.

Sin embargo, la página de entrada de contraseñas de WordPress por defecto parece simple y poco atractiva. Por lo tanto, es posible que desee cambiar eso con algunas personalizaciones simples.

Este artículo le guiará paso a paso en el proceso de personalización de una página protegida por contraseña en WordPress.

How to Customize password protected page in WordPress

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

Si desea crear una entrada o página en su blog de WordPress que solo deba ser visible para determinados clientes o miembros, puede bloquearla mediante la característica de protección por contraseña.

Del mismo modo, si está creando un nuevo sitio web en WordPress y no quiere que todo el mundo lo vea, tiene sentido utilizar una página protegida con contraseña.

Sin embargo, el diseño por defecto de la página protegida con contraseña es muy básico y poco atractivo. Aquí tienes una vista previa de su aspecto:

A basic password protected page

Personalizar la página protegida por contraseña le permite cambiar su estructura / disposición / diseño / plantilla. De este modo, la página será más atractiva y podrá adaptarla a su marca para darle un aspecto más profesional y mejorar la experiencia del usuario.

En las siguientes secciones, le mostraremos cómo activar la protección por contraseña en WordPress. También compartiremos diferentes formas de personalizar una página específica, todo tu sitio y diferentes secciones.

No dude en utilizar los enlaces rápidos que aparecen a continuación para saltar a la sección que prefiera:

¿Está listo para renovar el diseño de su página protegida por contraseña? ¡Primeros pasos!

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

Antes de mostrarle cómo personalizar una página de WordPress, debe saber que WordPress tiene ajustes incorporados para proteger con contraseña sus páginas y entradas.

Todo lo que tienes que hacer es editar una página o añadir una nueva. Una vez que estés en el editor de contenido de WordPress, sigue adelante y haz clic en la opción “Público” en “Estado y visibilidad” en el panel de ajustes a tu derecha.

Change visibility settings in content editor

A continuación, verá diferentes opciones de “Visibilidad de entradas”.

Sólo tiene que seleccionar la opción “Protegido con contraseña” e introducir una contraseña para su página.

Select password protected option

Ahora, siga adelante y haga clic en “Actualizar” o “Publicar”.

Ahora puede visitar su sitio web y ver la página protegida por contraseña en acción.

Password protected page preview using content editor

Veamos ahora cómo puede personalizar su página por defecto protegida por contraseña.

Método 1: Personalizar el diseño por defecto protegido por contraseña usando CSS Hero

Cuando activa la protección de contraseña desde su editor de contenido de WordPress, la página utiliza el tema de su sitio para el estilo.

Para personalizar la página, basta con utilizar una herramienta como CSS Hero. Te permite editar la estructura / disposición / diseño / plantilla de tu página sin necesidad de editar código.

En primer lugar, tendrás que instalar y activar el plugin CSS Hero. Para más detalles, consulta nuestra guía sobre cómo instalar un plugin de WordPress.

Una vez activado, la opción CSS Hero se añadirá a la barra de administrador de WordPress en la parte superior. Sigue adelante y haz clic en la opción “Personalizar con CSS Hero”.

Customize with CSS hero button

Esto iniciará el maquetador visual CSS Hero, donde podrás editar y personalizar tu página.

Para empezar, basta con hacer clic en cualquier elemento de la página.

Click an element to start editing

A continuación, puede cambiar los colores de fondo, añadir una imagen de fondo, utilizar un tipo de letra diferente, editar el espaciado y mucho más desde el panel de la izquierda.

Por ejemplo, vayamos a la pestaña “Fondo” y añadamos un color de fondo degradado. También cambiaremos el color de la casilla donde los usuarios tienen que escribir la contraseña y el color del botón “Introducir”.

Change the background color

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

Sólo tienes que elegir el ancho del borde, el color, el estilo y cualquier otro cambio que desees.

Edit the borders and save your changes

Una vez que haya terminado de personalizar, recuerde hacer clic en el botón “Guardar y publicar” de la parte inferior.

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

Preview of customized password protected page with CSS hero

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

Por ejemplo, con CSS Hero no puedes añadir elementos como formularios de contacto, botones de medios sociales, formularios de suscripción, temporizadores de cuenta atrás, etc.

Con esto en mente, veamos cómo puede utilizar un maquetador de páginas de destino para personalizar páginas específicas protegidas por contraseña en WordPress.

Método 2: Personalizar una página específica protegida por contraseña usando SeedProd

Personalizar una página específica protegida por contraseña es más fácil con SeedProd, que es el mejor maquetador de sitios web y páginas de WordPress.

Para este tutorial, usaremos la versión SeedProd Pro porque incluye plantillas premium y más características de personalización. Pero usted puede comenzar con la versión SeedProd Lite y crear una página coming-soon de forma gratuita.

En primer lugar, vamos a instalar y activar el plugin SeedProd. Si necesita ayuda, consulte nuestra guía sobre cómo instalar un plugin de WordPress.

Tras la activación, verá la pantalla de bienvenida de SeedProd en su escritorio de WordPress.

Desde aquí, tendrá que introducir la clave de licencia y hacer clic en el botón “Verificar clave” para activar SeedProd Pro. Su clave de licencia se encuentra en su área de cuenta SeedProd.

Enter SeedProd license key

Después de eso, vamos a SeedProd ” Páginas de destino de su escritorio de WordPress y añadir una nueva contraseña personalizada protegida página de destino.

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

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

Para empezar, sólo tiene que hacer clic en el botón “Establecer una página Coming Soon”.

Create a new coming soon page

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

Pasa el cursor por encima de cualquier plantilla que quieras utilizar y haz clic en el botón naranja de verificación.

Choose a coming soon template in SeedProd

Tras seleccionar una plantilla, SeedProd abrirá una ventana emergente titulada ‘Introduzca los detalles de su nueva página’.

Sólo tiene que seleccionar el nombre de la página y el slug de la URL y, a continuación, hacer clic en el botón “Guardar y empezar a editar la página”.

Enter a page template name

Esto iniciará el editor de arrastrar y soltar de SeedProd.

Aquí puede personalizar su página de destino protegida por contraseña y añadir diferentes elementos como texto, imágenes, botones y mucho más.

SeedProd también ofrece bloques avanzados como un formulario de suscripción, formulario de contacto, cuenta atrás temporizador, barra de progreso, opciones para compartir en redes sociales, y mucho más.

Para añadir un elemento, arrastra cualquier bloque del menú de la izquierda y suéltalo en la plantilla de la derecha. A continuación, personaliza el elemento al hacer clic sobre él y ajusta las opciones que aparecen.

Add blocks to your template

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

En primer lugar, puede añadir un bloque “HTML personalizado” en el maquetador de SeedProd. Simplemente arrastre y suelte el bloque HTML personalizado en la plantilla.

Add custom HTML block

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

A continuación, introduzca el shortcode [seed_bypass_form] en el campo “Código personalizado”.

Enter shortcode in SeedProd

No olvides hacer clic en el botón “Guardar” cuando hayas terminado. Y ya está.

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

Sólo tiene que ir a la pestaña “Conectar” del maquetador de páginas de destino y seleccionar su servicio de marketing por correo electrónico.

Connect email marketing service

Establecer la protección por contraseña de determinadas páginas en SeedProd

Después de crear una página personalizada que utiliza el shortcode [seed_bypass_form], el siguiente paso es establecer la protección de contraseña en páginas específicas utilizando SeedProd.

Para empezar, puede ir a la pestaña “Ajustes de página” del maquetador SeedProd y hacer clic en los ajustes de “Control de acceso”.

Después, sólo tienes que introducir una contraseña en el campo “Bypass URL” que los usuarios podrán utilizar para acceder a tus contenidos restringidos.

Access control settings in SeedProd

Tenga en cuenta que el texto que escriba en el campo “Bypass URL” servirá de contraseña y también de enlace que los clientes y miembros del equipo podrán utilizar para eludir la protección por contraseña y acceder a la página.

SeedProd le permite excluir URLs específicas de sus sitios, tales como administrador, acceso / acceso, cuenta y tablero. Esto asegura que los propietarios del sitio no se bloquean fuera de sus sitios.

Ahora, tendrá que elegir qué URL estarán protegidas por contraseña.

Sólo tiene que desplazarse hasta la sección “Incluir/Excluir URL”, dentro de los ajustes de “Control de acceso”. A continuación, seleccione la opción “Incluir URL” e introduzca las páginas concretas que desea restringir.

Include pages to password protect

Cuando hayas terminado, sólo tienes que hacer clic en el botón “Guardar” de la parte superior.

A continuación, puede ir a los ajustes “Generales” de la pestaña “Ajustes de página” y cambiar el estado de la página de “Borrador” a “Publicar”.

Publishing your landing page in SeedProd

Después de eso, puede cerrar el maquetador de páginas de destino y dirigirse a SeedProd ” Páginas de destino desde su panel de administración de WordPress.

A partir de aquí, vamos a hacer clic en el conmutador situado debajo del “Modo Coming Soon” para activar su página personalizada protegida por contraseña.

Activating coming soon page in SeedProd

¡Eso es todo!

Ha creado correctamente una página de destino personalizada protegida por contraseña que solo aparecerá en páginas específicas de WordPress.

Sólo tiene que visitar esas páginas de su sitio web para ver en acción la página personalizada protegida por contraseña.

Custom password protected page preview

Consejos adicionales: Más casos de uso de páginas personalizadas protegidas con contraseña

¿Quieres explorar más formas de utilizar la protección por contraseña en tu sitio WordPress? Aquí tienes 2 consejos para mejorar la página protegida por contraseña de tu sitio.

Consejo 1: Cree una página personalizada protegida por 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 tendrán que introducir una contraseña para acceder a cualquiera de sus contenidos.

En primer lugar, puedes ir a SeedProd ” Páginas de destino desde tu escritorio de WordPress. A continuación, haga clic en el botón “Editar página” en el panel “Modo Coming Soon”.

Edit coming soon page in SeedProd

A continuación, dirígete a la pestaña “Ajustes de página” de la parte superior y ve a los ajustes de “Control de acceso”.

A continuación, desplácese hasta la sección “Incluir/Excluir URL” y seleccione la opción “Mostrar en todo el sitio web”.

Show on entire website option in SeedProd

Una vez que haya realizado los cambios, siga adelante y haga clic en el botón “Guardar” en la parte superior. SeedProd mostrará la página personalizada protegida por contraseña en todo su sitio web.

Sugerencia 2: Crear secciones personalizadas protegidas por contraseña en WordPress

También puedes proteger con contraseña diferentes secciones de sitios web en WordPress frente a distintos conjuntos de usuarios. Esto resulta útil si gestionas un sitio web de membresía y quieres controlar el acceso a tu contenido, plugins, aplicaciones y otros archivos descargables.

La mejor manera de restringir diferentes partes de su sitio web es mediante el uso de MemberPress.

Es el mejor plugin de membresía para WordPress que te permite crear múltiples niveles de membresía para proteger tu contenido con contraseña.

Puedes utilizar MemberPress para establecer diferentes reglas para que los usuarios solo puedan acceder al contenido en función de su nivel de membresía. Para más detalles, consulte nuestra guía sobre cómo crear un sitio de membresía en WordPress.

Para empezar, primero tendrás que añadir membresías a tu sitio web. Simplemente vaya a MemberPress ” Membresías desde su escritorio de WordPress y haga clic en el botón ‘Añadir Nuevo’.

Add new membership plan in MemberPress

A continuación, puede añadir un nombre para su nivel de membresía, añadir una descripción y establecer un precio.

También puede cambiar el tipo de facturación de única vez a periódica, así como editar la membresía para que sea vitalicia o caduque después de un determinado periodo de tiempo.

Add a membership level in MemberPress

No olvides hacer clic en el botón “Publicar” cuando hayas terminado.

A continuación, puede ir a MemberPress ” Reglas desde su escritorio de WordPress y hacer clic en el botón “Añadir nuevo”.

Add new membership rule in MemberPress

Desde aquí, puede hacer clic en el menú desplegable de la opción “Contenido protegido”.

MemberPress ofrece muchas opciones para proteger su contenido, ya sea una sola página o todas las páginas de WordPress. Para este tutorial, vamos a proteger con contraseña una sola página.

Así pues, elijamos la opción “Una sola página” del menú desplegable e introduzcamos el título de la página.

Set up rules for password protection in MemberPress

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

Vamos a establecer “Membresía” en “Premium” en los menús desplegables de este tutorial. De esta manera, solo los miembros Premium podrán acceder a la página. Puedes añadir más condiciones y permitir que más de 1 nivel de membresía vea la página.

Cuando hayas terminado, no olvides hacer clic en el botón “Guardar regla”.

A continuación, puede visitar su sitio web para ver la página protegida por contraseña en acción. Los usuarios tendrán que acceder a sus cuentas para ver el contenido de la página.

View membership password protected page

¿Quiere hacer más?

Puede establecer contraseñas para sus vídeos u ofrecer membresías de grupo para equipos corporativos. Además, puedes crear una contraseña para dar acceso a los suscriptores a un boletín de pago y mucho más.

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

Esperamos que este artículo te haya ayudado a aprender cómo personalizar una página protegida con contraseña en WordPress. También puedes consultar nuestra guía sobre cómo proteger contenido en WordPress o nuestra selección de los mejores plugins de protección de contenido para 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.

Descargo: Nuestro contenido está apoyado por los lectores. Esto significa que si hace clic en algunos de nuestros enlaces, podemos ganar una comisión. Vea cómo se financia WPBeginner , por qué es importante, y cómo puede apoyarnos. Aquí está nuestro proceso editorial .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

El último kit de herramientas de WordPress

Obtenga acceso GRATUITO a nuestro kit de herramientas - una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Reader Interactions

Comentarios

  1. Felicidades, tienes la oportunidad de ser el primer comentarista de este artículo.
    ¿Tiene alguna pregunta o sugerencia? Por favor, deje un comentario para iniciar la discusión.

Deja tu comentario

Gracias por elegir dejar un comentario. Tenga en cuenta que todos los comentarios son moderados de acuerdo con nuestros política de comentarios, y su dirección de correo electrónico NO será publicada. Por favor, NO utilice palabras clave en el campo de nombre. Tengamos una conversación personal y significativa.