by Dani Beaumont
The Business Catalyst Platform is a hosted solution that enables you to create data-driven websites packed with features to deliver a successful online business. In this article, you'll learn how to configure a password-protected Members Only area. These secure site areas can be used for many purposes, such as providing user account management and order history, a secure location for sensitive client documents, or as a portal that displays premium content to paid subscribers. In this example, you'll build a fictitious site called Stitch Wizards that provides members with a secure area to share their project ideas (see Figure 1).
Figure 1. Home page of the Stitch Wizards online business.
Begin by installing the necessary software and registering your free Partner account:
Figure 2. Select the Full Solution and Start from scratch options when registering your trial site.
To follow along with these instructions, complete these initial tasks:
To get started, access your remote site with Dreamweaver and the Admin Console.
Figure 3. The local root folder includes a CSS style sheet and a DWT template to define the site's design.
Replace mysite in the address above with the name of your trial site. Choose Home > My Details to manage your account settings, including the delivery of weekly report notifications (which are enabled by default).
These are the two development environments you'll use to build and populate the site.
Replace mysite in the address above with the name of your trial site. The Coming Soon placeholder message is displayed. In the next section, you'll update the home page and populate it with content.
In Dreamweaver, double-click the index.htm file listed in the Files panel to open it. While viewing the source in Code view, select all and click delete to remove the existing code. Follow these steps to create the new page:
Refresh the browser window displaying your trial site to see the updated home page. Next, you'll create two more pages to build out the rest of the site.
Return to Dreamweaver. In this part, you'll create a new page that will be password-protected inside a secure zone. Follow these steps:
Figure 4. Create a new HTML page based on the site's template file.
Return to the browser window that displays your trial site. Click the Members Only navigation item to access it. For now, the page appears normally. Later, you'll set up a secure zone and add this page, so that it requires a password to access.
There's just one more page to create: the registration page with a form to register new members. This will enable visitors to sign up online and gain access to the Members Only area.
This page requires a three-step process. First, you'll create the page that will display the registration form to access the Members Only area. Later, you'll use the Admin Console to build the registration form that will be inserted. And finally, you'll insert the registration form on the page. Create the registration form page by following these steps:
Return to the browser window that displays your trial site. Click the Register navigation item. The page appears, but you haven't added the registration form yet. In the next section, you'll create the secure zone and the registration form for this page using the Admin Console, the Business Catalyst online interface.
Business Catalyst makes it easy to maintain multiple sites simultaneously because you use the same user name (your e-mail address) and password to access all your sites in Dreamweaver and the Admin Console. Follow these steps to set up a secure zone:
Figure 5. Select the secure page and move it to the right pane.
Return to the browser window displaying your trial site. Click the Members Only navigation item and notice that the page now requires a password to log in.
You've successfully created the secure area, but how will users gain access to the secure zone content? In the next section, you'll build a registration form so that they can sign up as a member and access the Members Only area. The Webform Builder is an Ajax-based form generator that makes it easy to create forms dynamically. You can use this interface to add the remaining fields; you can also drag and drop the form elements to reposition them, as desired.
Figure 6. Type the name of the form in the provided field.
Figure 7. The form elements are displayed in the preview area.
Click and drag the fields to see how they can be rearranged in the form's preview area. Take a few moments to interact with the form. If desired, try adding additional fields to experiment with the Webform Builder and see the options.
Notice that the right sidebar includes related actions. You could click Get Web Form HTML Code to access the form's source code, to copy or customize it. You could also use the interface to add the registration form to a web page. Many of these features are available in both the Admin Console and in Dreamweaver, using the Business Catalyst panel. In the next section, you'll return to Dreamweaver to insert the registration form.
At this point, all of the site's pages are live and the secure zone has been configured to set secure.html as a password-protected page. The Members Only registration form is ready to go; the only remaining task is to insert it on the page. Follow these steps:
The Stitch Wizard site is complete. In the next section, you'll interact with the site as a visitor to test the registration process and access the Members Only area. You'll also log into the Admin Console as the site owner to see how the site's activity is recorded in the backend database.
In this part, you'll visit the site in a browser to see how it works with the functionality you just set up. Register as a member to gain access the Members Only area by following these steps:
Figure 8. The Members Only area is displayed.
Using this registration form to subscribe users to secure zones, you can automate a site and enable new members to sign up online. However, the Admin Console also provides the ability for site owners and administrators to sign up new members. For example, your clients could gather e-mail addresses at a trade event, and then sign up interested customers behind the scenes, so that they can skip the online registration process. Even better, you can create custom e-mail campaigns to target existing customers that include links to access secure zones with discounted products and special promotions. And as you'll see in the next section, all of the customer's activity (from the links clicked in the e-mail campaign, data entered in form submissions and other site interactions) is tracked and can be leveraged to support your client's business model.
In this section you'll look under the hood at your trial site's statistics to see how visitors interact with the online features. Although this is a simple example using a sample project, you can imagine how a business could use the data gathered from customer interactions to evaluate how the site is performing, communicate with visitors and follow up on sales opportunities.
In a browser window, access the site's Admin Console by adding /admin to the end of the trial site's URL in the address field. Log in using your Business Catalyst user name (e-mail address) and password, if you are not already logged in.
The Dashboard on the home page displays a Live Feed with all of the recent activity. Scroll down to see the list of form submissions to register and log into secure and non-secure areas of the site (see Figure 9).
Figure 9. The recent site activity is displayed in the Live Feed.
The Live Feed items are links. You can click these links to jump directly to the contact record for the corresponding visitor. Use the Customer Summary area to keep notes, manage customer service cases, and subscribe visitors to e-mail campaigns and secure zones. In this case, the user has already registered as a member and can access the secure zone using the authentication details that they submitted. However, as an administrator, you can also sign up brand new users as members to encourage them to visit the site. Follow these steps:
Figure 10. Enable access to an existing secure zone.
As you can see from this sample project, the Business Catalyst Platform provides complex functionality that you can integrate with a few mouse clicks — in the online interface and the Dreamweaver authoring environment. These interactive features encourage traffic and increase revenue for online businesses. You can set up payment gateways and charge visitors to access secure zones (on a flat fee or monthly basis). Or set up a 30-day trial membership to promote the content of a paid area. You can gather visitor's contact information with web forms and offer targeted discounts via e-mail, based on their preferences. Or publish premium content via e-mail newsletters and charge a fee for subscriptions.
And of course, you can set up an online store to sell products and configure forms to capture the specific data that matters to your client's business. You can even provide a 24/7 contact form that sends the crew a text message when a customer requests emergency services. Everything you build is completely customizable and hosted, making it easy for you to add new features to online businesses as they grow over time.
Dani Beaumont has been managing innovative applications in the web and print production space for over 20 years. She is currently working as a Group Product Manager integrating Adobe Business Catalyst into the broader Adobe web solutions portfolio.