How to Set Up Your Website for Member Login
Who Should Use This Information
You should be reading this:
- If you need to create a Member Login area of your website.
- If you need to create password protected pages for your website.
- If you need to make an online form for prospective members to fill out to apply to become members of your website.
- If you need to set which pages in your website are password protected for members only.
If you need to set up your website for Members to access content that is not available to the public, there are several things your website will need to have. Here is what you will learn to create in this part of this Workshop:
- Informational content for the general public on how your website membership works and what the benefits are.
- A form that anyone can fill out to apply to become a Member of your website.
- A password protected page Members will see after logging in that will show them information and content that is not available to the general public.
- A link or button that is accessible from every page of the website that will take Members to a login page.
Step One: Membership Info Page
Create Your Page
- Go to Pages > All Pages and click the New Web Page button.
- Enter a Page Title that would apply to the type of membership your website will offer (e.g. Wholesale Membership, Spring Club Membership, etc.).
- Enter your SEO Title and Description for this page: this page will not be password protected, so you will want the search engines to register it from the start.
- Click Save to create your new page.
Your membership info page will need the following elements:
- Information about the benefits of being a member and a call to action for people to sign up.
- Information about whatever may be required of them to be a member.
- Images that communicate the benefits of being a member and help to 'sell' membership.
- A form that prospective members can fill out to become a member.
Add Membership Content
To add the informational elements to your page, use the following steps:
- You will need to be in the Edit view of the page (click on Website > Pages and go to your page).
- In the upper left corner of the page, find the small Triangle with the Plus and mouse-over it to open the Add Content links. Click on Add Body Content.
- Click the Add button for the Content module at the top of the list.
- Write out your membership info and upload and post your images. Your information should include any rules that will apply to members, the duration of membership, the cost of membership, if any, and we recommend a testimonial or two from existing members about how their experience has been.
- Click the Save button at the bottom once you're finished.
Create Your Membership Signup Form
To create your Membership Signup Form, go to Website > Modules > Forms and click the New Form button. In this example, we will create a club signup form. The best forms have compelling reasons for people to fill them out. Just putting in a title of Membership Sign Up isn't very exciting. What would appeal to you and motivate you to sign up? That's a good place to start when thinking through how you will word your Form Name and description. For the Description, remember that this is also your written instructions to the prospective member, so tell them what they can expect and what they need to do. You will see a blank version of the following when you have clicked the New Form button:
Form Name (Required): This is the name of the form, as it will appear on the page and be visible to your prospective members.
Internal Title: If your form name is in marketing language, it might make sense to give the form an internal title that is intuitive and for your use only, such as Member Signup.
Description: This section should describe the purpose of the form, who should fill it out, and how to fill it out, if necessary.
Notification Email: This is the email address that notifications will be sent to every time someone fills out and submits the form. This email address will not be visible to the public and ideally should be one that you access daily and that is meant for business use.
Thank You URL: If you want to make an even better sign up experience, create a Thank You page under Website > Pages and paste the relative URL here (a relative URL is one that has everything that comes after the YourDomainName.com in the full URL, and relative URLs are always listed in the Pages module).
When you have completed the basic form setup, click Save to proceed building your form fields. You will see a blank version of the following:
A good general rule to follow with any form you create is use as few fields as possible. There is a direct correlation between how much information you ask for and how few people will fill out the form: the number of people goes down significantly for each field you add. Be concise.
To create a field, click on the button for the field type, such as Add Text Box (in the case of Name and Email above) or Add Text Area (which provides a large text box with no character limit). You can also add a Check Box (yes or no question) or a Drop List of options (the applicant will select one from a list you build). A small window will open that will allow you to create a Label (i.e. title) for the field and will allow you to set whether it is a Required field or not.
After you create each field, the form will save itself to the server, so when you are finished, there is no Save button to push. You can remove or reorder your fields as needed. To remove a field, simply click the appropriate Remove link and confirm that you want to delete it. To reorder your fields, enter the numbers in the appropriate boxes to set the desired order and then click the Update Order button.
Place the Signup Form on the Page
Once you have finished all of the fields you will need, you can place the form on your Membership Info page. Your form should go in the Body Content area on the page, so go to your Membership Info page (go to Website > Pages, find it in the list and click on it) and in the upper left corner of the page, find the small Triangle with the Plus and mouse over it, then click on Add Body Content. Scroll down the list of modules and click the Add button for Form.
You will be offered a drop-list of any forms you have created so far; select the membership signup form you created and click the Add button. Your live form will appear on the page, and you can fill it out to test its functionality.
Each form submission will be stored in the system and you can view them by going to Website > Modules > Forms and clicking on the form name. At the top of the page (as in the image above) you can either View Form Submissions to see all submissions to date in chronological order or you can Download Form Submissions and work with the information in a spreadsheet (.csv file, usable by any spreadsheet program). You can also remove old or unwanted submissions in the View Form Submissions area.
Step Two: Creating Your Membership Login Page
This page will not be accessible to the public as it will be password protected. This page will be the destination of your Member Login link or button and when someone tries to go to this page, they will come to a login screen after everything has been set up. So the content of this page will be for members only and should include things like promotions that are only available to members, links to articles or special content that is also password protected and accessible only to members (members only need to log in once to access everything), and any news or updates for members.
Create this page by going to Website > Pages and click the New Web Page button. Enter a Title such as Member Home. Since the page will be password-secured, the search engines will not be able to index it, so you do not need to put in an SEO Title or an SEO Description. Click Save to create your new page. Once you have created your member login page, do not publish it until you have set it to be password protected (please see the section below).
Your member login page will need the following elements:
- Information about ongoing members-only benefits.
- Information about seasonal promotions or other special incentives for members.
- Images that communicate the benefits of being a member and help to 'sell' items or services you wish to promote.
- Links going to products or events for your members.
For the informational elements, of course you will Add Body Content to create Content modules in which you can write out your member promotions and upload and post your images. Here's a sample page from our example club:
Step Three: Password Protect Member Content
You will need to set all pages that are for members only as Restricted pages in the system. To do this, click on the gear-shaped button on the far right side of the blue Admin Toolbar then go to Users > Restricted Pages. In the Restricted Member Access section you will click on Restricted Pages. Place a check in the checkbox next to your Member Login page and any other pages that will contain password protected content, as in the example below.
Note: You do NOT need to set any of your online shopping pages as Restricted pages! The system itself will manage the information it displays to your visitors when they are viewing your online store. Normal visitors will only see regular retail information, and any members that have logged in will automatically see Wholesale product information you have put into the system.
Step Four: Launching Your Website Membership
Create Your Member Login Button/Link
As part of launching your website membership, you will create either a button or text link to your Member Login page and you will place the link on all pages of your website. It is recommended that you put this link in the header of your site where it will be easy for your members to see. If you need help creating this link, please call us at support and we can help you put it in. This link will not work until you publish your Member Login page, but it is okay to put the links on the site prior to publishing, since you'll be publishing it shortly.
Most of our clients use a button of some kind (see the examples below) and you can either create your own button in graphics software such as Photoshop or with free online resources such as pixlr.com, or you can do an image search for buttons that have already been created. If you do the latter option, you may want to contact the owner/creator of the image to make sure you have permission to use it. Professional quality buttons are available on stock image sites such as Pexel.com or iStockPhoto.com. Here are a few examples:
To insert your button or create your link text, open the module in the header where you want it to appear. Do it on your Home page first, then we'll do it later on a secondary page to make it site wide. Once you're in the Edit view of the content module, to make a text link, first type out the text you want in the appropriate location, then follow the steps below for Linking.
To load your button image, follow these steps:
- Click in the area you want the button so your cursor is flashing.
- Right-click and in the pop-up menu, click on Insert Image.
- In the Insert/Edit Image window, on the right side, click on the Browse Server button (it looks a little like a camera, but is actually a folder with a magnifying glass).
- Click on whatever folder you want to upload into and then click the blue Upload File button.
- In the Upload Files window, click the green Add Files button.
- Search your computer for the button image and double-click on it.
- You will see a thumbnail of the image in the Upload Files window, click the blue Start Upload button. This will go fast for such a small file.
- Your button will be the top file in the server folder you're viewing, click on it to load it.
- You'll see its URL in the Source area and its Dimensions in pixels in the Insert/Edit Image window, click OK.
- You can resize your image visually with the little handle squares around the image.
To link your button or text, do the following steps:
- Click on the Member Login button or highlight your Member Login text to select it.
- Right-click on the highlighted area and click the Insert/Edit Link button in the pop up.
- The Link Properties window will open. Click the Browse Server button on the right.
- A window will open showing a list of all website pages. Click on your Member Login page.
- The URL for your Member Login page will be inserted into the Link Properties window URL field. Do not change the Target, leave it set at None. Click OK to create the link.
- Scroll to the bottom of the screen and click the Save button.
You need to have this button or text link on your Home page, and you also need to put it identically on any secondary page. If you're doing this in your website Header area, the module will already be Global, which means it is automatically on every page of the website except Home. If you need help with this process, please call us at Support and we'll be happy to assist you. 385-404-6200, option 2.
Publish Your Member Pages
To publish your restricted Member pages, go to Website > Pages. In the list of your site pages, click the Blue Cloud Button for the first page you want to publish. You will see the button disappear, and if you reload the page, it will have the yellow cloud button that indicates it is published.
Once this is done, you will want to include a link to your Membership Info page in your main site Navigation. You will also want a link to your Member Login page. To create these links, follow these simple steps:
Create Navigation Links for Membership Info and Member Login Pages
- Go to Website > Navigation and if you have room at the top level of your pages, click the New Navigation Link button. If you will be creating these page links under one of your top level items (such as About), click the Plus button next to the appropriate page, and then click the New Navigation Link button.
- You will use option #1: Existing Web Page. Click Create Navigation Item.
- You will see a list of all pages on your site, click in the radio button next to your Membership Info page.
- In the Link Text box, enter Membership Info and then click the Create Navigation Item button.
- You will see your page in the Navigation list. Test your link by clicking on Website > Preview and clicking on the link in your Navigation.
- Repeat these steps for your Member Login page and any other members only pages you wish to link in your Navigation.
You are now set up for Membership through your website! Test it by going to the site as a visitor would and clicking on your Member Login button or link. Use the login information for a test member account you create under the gear-shaped button > Users > Member Accounts.