Password protect your site or web pages

Restrict access to your content by password-protecting pages, page folders, Collection templates, or your entire website. Customize the design of your project's password page.

The UI in this lesson may seem different if you've enables the Style Panel Beta! This content will be updated soon!
This video features an old UI. Updated version coming soon!
This video features an old UI. Updated version coming soon!
Password protect your site or web pages

Sometimes you'd want to hide your web content from web surfers. You can do that by not publishing your content, or saving pages as a draft. However, if you wish to share the content with specific people, you can password-protect it.

If you're hosting your site with Webflow, you can protect your entire site or specific pages on your site. You can also customize the design of your password page.

In this article
  1. Password protect individual pages
  2. Password protect all pages in a folder
  3. Password protect all pages of a Collection
  4. Password protect your entire website
  5. Design your site’s password page

Password protect individual pages

You can set unique passwords for each page you password protect so that each password-protected page can have its unique access credentials.

Password protect pages that you want to share with your clients or a specific audience. These can be internal documentation, sensitive client prototypes, or any page you'd like to restrict access to. For pages that you do not need to share privately, save them as a draft instead.

Set a password on a page

To set a page-level password, enable Password protection in the Page's settings in the Designer or the Editor. Then set a unique password for that page and publish your site.

Password-protect a page through the Designer.

Password-protect a page through the Editor.

Password protect all pages in a folder

To hide the content of multiple pages at a time, you could set a password on each page, or you can add the pages to a folder and set a password for the entire folder.

Each folder of pages can have its own, unique password, just as all pages can have their own passwords. Child pages and folders will inherit the password of their parent folder. These child items cannot have individual passwords if their parent folder has one set. So, setting a folder-level password will overwrite passwords previously set on pages or folders within that folder.

Set a password on a folder

To set a folder-level password in the Designer or Editor, enable Password protection in the Folder settings. Type in your unique password that will apply to all pages in that folder. Publish your site.

Password protect all pages of a Collection

As for Collection pages, you can password protect the Collection template page, and all auto-generated pages in that Collection will display the password page and require login credentials. This way, you can hide pages of a Collection that you're still designing.

Set a password on a Collection template page

To set a password on all pages of a Collection, enable Password protection in the Page settings of that Collection template page in the Designer. Then set a unique password that you'll need to enter to visit any page in the Collection. Publish your site.

To password-protect Collection pages in the Editor, set the password on any page from that Collection. The password will apply to all pages within that Collection.

Password protect your entire website

What if you want to publish your site for testing or private demos? You can control who can access a project that is still a work-in-progress by requiring a password on all of its domains. 

Site password protection is available on all hosted sites as well as on all projects if you're on a Pro plan or Team plan.

Set a password on your entire site

You can access the Website password settings under the General tab of your Project settings. To set a site-wide password, enable Password protection in your project's settings, set a password, and publish your site.

Setting a site-wide password will overwrite passwords set on pages or folders within that project.

Design your site’s password page

Site visitors who stumble upon a Password protected URL will see a password page and will need to enter the password you set before proceeding.

Access the password page

You can customize the design of your password page in the Designer. You can access this utility page through the Pages panel or using Quick find.

Customize and style the password page

By default, your password page comes with a centered set of elements, which you can customize however you'd like. You can delete and rearrange most of the default elements on your password page, except for the input form and submit button, which cannot be deleted. You can also add new elements to the page and style those however you'd like.

You can also style the "error message" site visitors see if they enter the wrong password. Select the utility page form element on the canvas and open the Element settings panel. There, toggle the state of the form under Password form settings to the "wrong password" state to reveal the Error message on the canvas. Select, customize, and style it.


Browser support

Can I Use ? Data on support for the feature across the major browsers from caniuse.com.

Was this helpful?
OR

Thanks for the feedback! If you can, please add additional feedback below.

Oops! Something went wrong while submitting the form

Thank you! Your feedback has been received!

Oops! Something went wrong while submitting the form