How do I use password custom fields to require a password to access my landing pages (creating membership areas)?

ActiveDEMAND has a special custom field type called 'password'. This custom field type allows you to create several password assets that can be used to password protect groups of landing pages. The password system allows you to set up registration pages, password reset forms, and account confirmation logic.

 

Creating a 'Membership Area'

You will need the following landing pages:

1. Registration page (not required, recommended)
2. Password Create page
3. Login page
4. Password reset request page
5. Membership page(s)

 

Steps:

1. Create your password custom field
2. Create your 4 pages
3. Edit your forms

Creating The Password Custom Field

In your account settings, scroll down to the Custom Field section of your account. 

 

 

 

The Password Options:

1. Requires Confirmation: If checked, this will force the user to confirm the password before it can be used. The user can be sent an email with an 'account' confirmation link. The created password will not be used (i.e. the assets will be not available to the person until they confirm their login). Note, you can manually confirm a contact with a password by viewing the contact record's custom fields
   
2. Password Registration URL: This is the URL of the webpage/landing page that contains the 'account registration form. This form will contain the 'Password Create' form elements.
3. Login URL:  This is the URL of the webpage/landing page that contains the 'login' form. The login form is a form that has the 'Enter Password' form element. 
4. Logout Link: This is a unique URL that is used to 'logout' (i.e. remove the session cookie) for a user. You can embed this link on a button or sidebar within the membership area (on a protected asset). If the user clicks this link, the current login session cookie will be removed which will force the user to use a password to enter the membership area again.

 

 

The Registration Page

You can either create a 2 step process (a registration page and a password create page), or just direct people to a single page that has the password create form fields

Regardless of the path you choose, you will need to create an asset registration page that users will be directed to when trying to password access protect assets (i.e. landing pages). You can either create a landing page or a web form that will act as your registration form. In the form editor, you will find a

1. 'Create a Password' form element
2. 'Confirm Password' form element (this confirms the password created with 'Create a Password'

 

Add the Create a Password (and optionally the Confirm Password) form elements to your form. Editing the properties of the form element allows you to choose the password custom field associated with this element.

 

 

 

In the autoresponder for the Password Create page, if you chose to 'require account confirmation' in the password custom field, you will need to create an email that sends the prospect an 'account confirmation' link. The password they created will not be 'activated' until the user clicks the link sent in the email. The dynamic field that you embed in your email will be available in the custom field selector:

 

 

Now you have the 'registration page'. Next, you will need to set up the login page. Again create a form or a landing page that will act as the 'login' page for registered users. On this form, you will use the 'Enter Password' form element

Make sure you set the custom field in this element is set to your password custom field.

 

Now that you have a registration page and a login page created, Go back to your password custom field in your account settings and set the login and password creation URLs.

 

Creating your Login Page

This is just a regular landing page with a form that includes the 'enter password' form element.

You will need an email address form element and the 'enter password' form element on the form.  If someone tries to access the protected page, they will be automatically redirected to the 'login' URL associated with the password custom field. After the user enters a valid password, they will automatically be directed to the asset they were trying to visit. 

For the case of a user saving the 'login' URL, it is important that the user experience is correct. Thus we recommend setting the redirect on the form to go to the protected asset. Thus if the person is successful in 'logging in', the asset will render. If the person is not successful, the protected asset will push the visitor back to the 'login' page.

 

Password Status Block

When a user tries to log in or logs out, the system will redirect the user to the login page. In order to effectively communicate to the user the status of the action, add a Password Status block to your login page.

The Password Status block is a content block that will display text to a user based on the most recent login/log-out event. 

 

1. Password Login Attempt Failed Message: Displays this message to a visitor if they recently tried to log in and the attempt was unsuccessful
2. Successful Logout Message: Displays this message to a visitor if they recently logged out
3. Successful Login Message: Displays this message to a visitor if they recently logged in

The block will render nothing to the user if the user has neither attempted to log in/log out

 

Password Reset Page

For the situation where people forget their passwords, you will need to give them an option to reset the password. Basically create a simple page that has an email address field.

 

The form's autoresponder can check to see if the person actually has a password set. If it does, send them an email that has the 'password reset' dynamic field.

The autoresponder for the "forgot password" form must send the user to the reset password URL. This dynamic term can be used in a button or link in the autoresponder email action.

 

Note

If the user clicks the link created by the password reset dynamic term, it will redirect them to the registration page URL.

 

Setting up Dynamic Content for the Registration Page

The registration page should contain dynamic content with two form versions: 

• A Registration form that allows the user to initially create an account 

 

• A Password Reset form that allows the user to reset their password if they have previously filled out the Registration form:

 

Filling out the Password Reset form after clicking the reset password link is the only time (other than the first registration event) ActiveDEMAND will allow the user to set a password using a 'set password' form element.

 

Password Reset Form

The Password Reset form should include a hidden field that contains the %CONTACT.ID%: 

Membership Area: Protecting Assets With Your Password

For the landing page that you want to 'password protect', go to the page properties and choose 'Page is visible to 'Visitors with a valid password' option

And select that appropriate custom field to protect the page with:

 

Now anyone who tries to access this page without a valid password will be redirected to the 'login page'. You will want to put a link to the registration page on the login page to ensure visitors can register to get the asset.

 

Popup Logout

To detect whether the person is logged in/logged out of the protected area (or just outside of the protected area), the logged-in cookie is of the format

acf_session_xxxx

where xxxx is the ID of your password custom field

 

use the following script to 'hide' a logout popup if the person is not currently logged in:

<script type='text/javascript'>
if (typeof AD.jQuery.cookie('acf_session_xxxx') === 'undefined') {
AD.jQuery('%POPUP.HTML_ID%.activedemand-popup').remove();
}
</script>

 

You can embed the script on your ActiveDEMAND popup (in the builder, embed a script on a row)

 

For example, if this is the password custom field:

 

the cookie is

acf_session_184930

and the script to allow the popup to show only if the visitor is logged in would be

<script type='text/javascript'>
if (typeof AD.jQuery.cookie('acf_session_184930') === 'undefined') {
AD.jQuery('%POPUP.HTML_ID%.activedemand-popup').remove();
}
</script>

 

The script to show a popup only if the user is not logged in would be

<script type='text/javascript'>
if (typeof AD.jQuery.cookie('acf_session_184930') !== 'undefined') {
AD.jQuery('%POPUP.HTML_ID%.activedemand-popup').remove();
}
</script>

 

 

Learn How To Create A Membership Area On Your Website