Webflow sync, pageviews & more.
NEW

CMS Based Password Collection Template

Example

CMS Based Password Collection Template

Description

Add a CMS based password to your Webflow template page via this Javascript code. This allows you to password protect a Webflow CMS template page based on a password in the Webflow CMS collection.

Instructions

  1. Add the custom javascript to the head section of your pages custom code
  2. Add an HTML embed with the HTML code found below to your page, this is the custom password form input
  3. Add a password field to your CMS collection item

Javascript snippet


<!-- Add to head section -->
<script>
var Webflow = Webflow || [];
    Webflow.push(function () {

        let slug = "\"SLUG-VALUE-HERE\"";
        let pw = "\"PASSWORD-VALUE-HERE\"";

        localStorage.setItem(slug, pw)

        $("#submit").click(function () {
            let userPw = $("#password").val();
            userPw = "\"" + userPw + "\"";
            let pagePw = localStorage.getItem(slug);

            if (userPw == pagePw) {
                console.log('success!')
                $('#modal').remove();
            } else {
                console.log('error');
            }

        });
    });
</script>

CSS snippet

HTML snippet


<input type="password" class="black" id="password" name="password" required>
<input type="submit" id="submit" class="black" value="Sign in">
Display/Hide Items based on Count

Display/Hide Items based on Count

1

Hide/show elements on your Webflow Memberstack site based on a conditional value with this Javascript snippet. A great way to implement a credit based system or value based conditional logic for your Memberstack Webflow site.

Age Gate Modal Overlay

Age Gate Modal Overlay

Add a birthday/age gate modal confirmation to your Webflow site via this simple Javascript code snippet.

DRAG
Real-time sorting by
CMS Based Password Collection Template

CMS Based Password Collection Template

Add a CMS based password to your Webflow template page via this Javascript code. This allows you to password protect a Webflow CMS template page based on a password in the Webflow CMS collection.

DRAG
Real-time sorting by