Publishers of technology books, eBooks, and videos for creative people

Home > Articles

  • Print
  • + Share This
This chapter is from the book

Overview of Working with Web Forms

Web forms are an integral feature used in Business Catalyst sites to gather customer data and track site activity. Web-form elements can be customized to capture the specific data that's related to your client's business. You can also update the appearance of forms (using standard HTML and CSS code) and control how the forms behave behind the scenes to ensure your clients receive the submitted form data.

Adding e-mail and SMS notification to web-form functionality

If you want to configure a custom workflow notification system, configure the work-flows first, before building and inserting web forms:

  1. Set up user accounts for your clients.
  2. Create the roles for different sets of users.
  3. Add and configure the workflows to define who receives notification messages when a form submission is received.
  4. Apply the workflow to the web forms as you build them.

In Chapter 7, "Understanding Customer Management and the Site's Database," you'll learn more about how to manage users, access customer data, and customize workflows.

Inserting web forms on pages of the site

After building a web form, you must insert it on a page and publish the page to make it available on the live site. Remember to add a link to the form page to make it easy for visitors to access it.

You'll follow three general workflows when working with web forms.

1: Build the web form first and then create and style the page that will display it

  1. Build the web form in the Web Form Builder.
  2. Create a page using Dreamweaver.
  3. Use the Business Catalyst panel to insert the web form as HTML.
  4. Edit the source code of the page and style the form with CSS using the editing tools provided in Dreamweaver.
  5. Upload (put) the page to publish it to the live site.

2: Build the web form and then create the page that will display it—without styling the form

  1. Build the web form in the Web Form Builder.
  2. Create a page using the Website section of the Admin Console.
  3. Use the Module Manager to insert the web form as either HTML or as a module tag.
  4. Save and publish the page to make it available on the live site.

3: Create the page first and then build the web form

  1. Create the page using either Dreamweaver or the Admin Console.
  2. Build the web form in the Web Form Builder.
  3. Use the 1-Click Insert menu to insert the form on the page as HTML.
  4. Save and publish the page to upload it to the live site.

Updating the appearance and behavior of forms

After publishing the page that contains a form, always visit the live site and test the form. If you inserted the form as HTML, you can use the CSS Styles panel in Dreamweaver to style the form elements.

If you need to change the form elements after previously inserting the form on a page, update the form in the Web Form Builder. Then, edit the page in either Dreamweaver or the Admin Console to delete and reinsert the HTML code.

Remember, if you're using the Module Manager to insert the web form as a module, you can update the form elements in the Web Form Builder and the form is updated on pages automatically. However, you cannot access the source code to style the form if you insert the web form with a module tag.

Related Links

05bc_qr1.jpg

Adding CAPTCHA to Web Forms:

http://www.adobe.com/go/bc_captcha

05bc_qr2.jpg

Capturing Leads and Closing Sales:

http://www.adobe.com/go/bc_closing_sales

  • + Share This
  • 🔖 Save To Your Account