Password Protected Page Spacing

[ethosdesign]

So, I need to password protect a series of pages on a site. When I do that, the form where you enter the password is behind the header. It’s necessary for the design that the header on those pages is set to “Absolute”, and the page template is “no container, header, footer.” How can I create some spacing around the form so it’s easily accessible for people to enter the password?

I’m happy to provide a screenshot in the secure note if that’s possible.

[marc_a]

Hey Ken,

Thanks for reaching out!

Please provide your website URL so that we can check your setup properly. It would also be best if you could share with us your credentials in a secure note. Please provide us with the following details:

• WordPress admin URL
• WordPress admin level username and password

Thank you.

[ethosdesign]

Sure thing!

[ruenel]

Hello ken,

You are experiencing this issue because you are not using the default page template. The Password Protect form aligns with the page template containers. Since you are using the Blank - No Container page template, the form does not have containers as well. To get this sorted out, you will have to use custom CSS like:

body:not(.page-template-default) .post-password-required .entry-content {
    margin: 16em auto 10em;
    max-width: 1200px;
}

The code above serves as an example code. Feel free to modify it when needed. Please note that custom coding is beyond the scope of our support. You must maintain any custom coding to ensure it will still work after any updates or does not create any issues or incompatibility in the future.

Best Regards.

[ethosdesign]

Thanks @ruenel Where should I add this code?

[tristup]

Hi Ken,

You need to add it into the Global CSS as shown in the given screenshot.

Hope it helps.
Thanks

[ethosdesign]

@ruenel

body:not(.page-template-default) .post-password-required .entry-content {
    margin: 16em auto 10em;
    max-width: 1200px;
}

Ok so the problem with that is, it also applies it to the main page, as well as the password page, which of course I can not have.

[marc_a]

Hi Ken,

I am unsure about what you are experiencing because when I tried to add the code in your Global CSS, it only applied to the password protected page.

Or maybe you are seeing a cache version when checking on your end. Please try purging your cache.

If not that case, please give us more details.

Thank you.

[ethosdesign]

@ruenel

body:not(.page-template-default) .post-password-required .entry-content {
    margin: 16em auto 10em;
    max-width: 1200px;
}

It was only happening in the page builder, we are all good to go now. Thanks for support!

[marc_a]

@ethosdesign,

You’re most welcome!