How to add extra security to your protected pages in Webflow

Adding extra security to your protected pages

Protecting pages within a product provides a basic layer of protection for your website content. However, we recommend adding extra security to each of your protected pages.

There are two main reasons to add extra security to your protected pages:

If a tech-savvy person wants to get around your page protection without joining one of your plans, they can disable Javascript in their browser which will prevent the page protection popup from appearing. However, if your page has extra security, it will simply appear as a blank white screen with no content.
A good way to prevent search engine indexing of protected page content is by adding the extra security code. This sends a strong "do not index" signal to Google and other search engines. This does not necessarily work 100% of the time since search engines can choose to ignore the signal, but that's rare.

When a visitor goes to a page with extra security, they will still see its contents for a second or so before the page protection popup appears. This does not affect customers with access to the protected page.

How to add extra security to your protected pages

Copy this code:

<meta name="robots" content="noindex, nofollow"><style>#__memberspace_modal_protected_page { position:fixed; top:0; left:0; width:100%; height:100%; background:#fff; z-index:2147483646; }</style><div id="__memberspace_modal_protected_page"></div>

Make sure you are logged into your Webflow backend.
Click the Pages icon on the left:
Find the page you want to add extra security to and then click the gear icon to the right of the page name:
Scroll down to the Custom Code section > paste what you copied into the Inside <head> tag section > click Save in the top right:
Lastly, don't forget to Publish your changes.