On Sale - Super Suite 44% off - Click here to learn more

System Requirements

Windows

  • Windows Vista, Windows XP SP2, or Windows Server 2003
  • 128 MB RAM (256 MB recommended)
  • Dreamweaver CS4, Dreamweaver CS3
  • Works with PHP 4.2 +

Macintosh

  • Mac PowerPC or Mac Intel
  • MacOS 10.4.x, MacOS 10.5.x
  • Dreamweaver CS4, Dreamweaver CS3
  • Works with PHP 4.2 +

Need a hosting provider?

  • WebAssist has partnered with 1&1. Click here to learn more.

Close

Close

A hammer and wrench crossed over a web form representing CSS form design

CSS Form Builder

Quickly and easily modify existing forms or design your own secure, totally customized CSS forms
Included in the Extension Library membership program  Learn More

Video Feature Tour

Click the video icon to the right to see how to design flexible yet stylish CSS forms within Dreamweaver using CSS Form Builder.

Play Video

Product Summary

CSS Form Builder, our form extension for Dreamweaver, allows you to design unique one-of-a-kind CSS forms. Take advantage of CSS Form Builder's interface to design a new CSS form, customize an existing form's CSS design, add custom form elements such as Captcha and even apply Spry validation. Do you need your form to send an email or submit to a database? Check out the WebAssist Extension Library Membership Program which contains all the Dreamweaver extensions you may require.

Flexible CSS Form Creation
CSS Form Builder provides a convenient interface for designing customized CSS forms. You can even import form fields from an existing page to modify the design and add validation.
Pre-built Form Groups and Themes
Integrated are 12 CSS form types, 10 custom form field groups and 4 professionally designed CSS form themes to help simplify and accelerate the form creation process.
Custom Form Elements
Enhance the design of your CSS forms with a wide array of custom form elements like Captcha for spam prevention and a pop-up calendar for quick and easy date selection.
Spry Validation
Display clear error messages for your users to ensure accurate, complete and properly formatted data - adding form validation with Dreamweaver just got easier!

Screenshots

CSS Form Builder Quick Insert InterfaceSpecify your CSS form type optionsSelect your CSS form design optionsEdit your CSS form contentsEdit your form field group contentsEdit your CSS form designEdit your CSS form design optionsEdit the CSS design of your form elementsPreset ManagerSharp Design with DatepickerStandout Design with DatepickerBrassy Design with DatepickerCool Design with DatepickerBrassy Design with custom Captcha and validation errorCool Design with custom Captcha and validation errorSharp Design with custom Captcha and validation errorStandout Design with custom Captcha and validation error

Features

  • Quick insertion of forms
  • Pre-built form library
    • Log in
      • Simple log in
      • Secure log in
    • Registration
      • Simple registration
      • Rich registration
    • Contact
      • Simple contact
      • Appointment request
    • eCommerce
      • Shipped goods checkout
      • Digital goods checkout
      • Shipping
      • Payment
    • Web design
      • Website development
      • Link exchange request
  • Pre-designed themes
    • 4 available themes
    • Single column
    • Multiple column
  • Pre-built form groups
    • Address – 1 column
      • Company, Street, Street 2, City, State, Postal code, Country, Email
    • Address – 2 column
      • Company, Street, Street 2, City, State, Postal code, Country, Email
    • Appointment
      • Best day, Best time, Email, Phone
    • Contact info – 1 column
      • Title, First name, Last name, Email, Phone
    • Contact info – 2 column
      • Title, First name, Last name, Email, Phone
    • Lists
      • State
      • Country
      • Months, Number values
      • Months, Name values
      • Years, 1900 - 2009
      • Years, 2009 – 2025
    • Payment
      • Credit card type, Credit card number, Expiration Date, CVV code (with pop-up explanation)
    • Register
      • Password, Confirm password, Obvious Question, Captcha
    • Security
      • Captcha, Obvious question
    • Web design
      • Website type, Additional details, Services desired, Domain name needed, Website hosting needed, Estimated site size, Time frame, Budget, Current site URL
  • Complete theme CSS customization (not all properties are available for all elements)
    • Size
    • Margins
    • Padding
    • Borders
    • Font properties
    • Background color
    • Background image
    • Placement
    • Alignment
  • Layout flexibility
    • Group elements in same column
    • Place elements on separate column
    • Position label left, above or below
    • Include group header
  • Supported form elements
    • Text
    • Text area
    • Menus
    • Multiple select lists
    • Checkboxes
    • Radio buttons
    • File
    • Image
    • Hidden
    • Password
    • Confirm
    • Buttons
    • Captcha
    • Date picker
  • Client-side Spry validation
    • Integrates with Dreamweaver Property inspector
    • Customizable error messages
    • Separate, styled CSS states
  • Server-side PHP validation
    • Backwards compatible with Validation Toolkit
  • Accessibility features
    • Automatic tab-index with custom increments
    • Label for property used throughout
  • Complete preset management
    • Save custom form contents as presets
    • Save custom form themes as presets
    • Duplicate any preset
    • Edit any preset
    • Export presets
    • Import presets
    • Delete unused presets
  • Cross-browser support
    • Windows - Mozilla Firefox 3
    • Windows - Internet Explorer 6, 7, 8
    • Mac - Safari 2, 3
    • Mac – Firefox 3
  • Supports PHP 4.2+

What is the difference between purchasing and signing up for a membership?

When you purchase a Dreamweaver extension or Super Suite, you own that software and will automatically receive dot release updates (updates within the same version of a product you own). Any full version upgrade that is released after 30 days from your initial transaction would require you to purchase that version at a discounted upgrade price. By enrolling in the WebAssist Extension Library Membership Program you have automatic access to all existing WebAssist Dreamweaver extensions, premium content, new extensions as well as content or product updates that are added during your membership.

Is CSS Form Builder included with the WebAssist Extension Library?

Yes, with your purchase of the WebAssist Extension Library you receive access to all WebAssist extensions including CSS Form Builder.

Do I need to own Dreamweaver to use CSS Form Builder?

Yes, you will need Dreamweaver CS3 or CS4 to run CSS Form Builder.

Do you offer a trial or demo of CSS Form Builder?

WebAssist is not currently set up to offer trials or demos of our products. Instead we offer a 15 day money back guarantee with every Dreamweaver extension.

Can CSS Form Builder be used without any CSS knowledge?

Yes. While some CSS knowledge would be helpful in maximizing CSS Form Builder capabilities this tool can be used without any prior CSS as we provide a convenient interface controlling various CSS form elements.

Will my CSS Form Builder form send an email or insert to a database?

No. CSS Form Builder does not apply a function or action to the forms it creates. Instead CSS Form Builder will assist you in the process of creating and designing your CSS based form, however the actual functionality needs to be applied manually, or by using another WebAssist extension. Depending on the type of form you are trying to create, WebAssist has a number of Dreamweaver extensions that can create this functionality for you, such as eCart, DataAssist, Digital File Pro, Universal Email or SecurityAssist. All of these extensions are included with the WebAssist Extension Library subscription program.

If you are new to working with online forms, you may want to create the form with a different tool such as DataAssist first. Then, use CSS Form Builder to modify the design, apply validation, and add custom form elements.

What is a pre-built form group within CSS Form Builder?

A form group is a brief collection of relative form elements, i.e. the payment form group includes the following form fields: credit card type, credit card number, expiration date, and CVV code - form groups help users build forms more quickly and easily. Please see the Complete Feature List under the Features tab of this page for a complete listing of form groups.

What type of validation does CSS Form Builder include?

CSS Form builder includes comprehensive client-side and server-side validation.

What is the diffence between client-side and server-side validation?

Client-side validation runs in the browser, validates the form fields before they are submitted to the server and allows you to display a pop-up error message after clicking submit if the form data is not valid. While, Server-side validation occurs after the form has been sumitted to the server and allows you to display error messages directly on the page.

Should both client-side and server-side validation be implemented?

Yes. It is widely considered a best-practice to use both client-side and serve-side validation which will help to protect your forms. Client-side validation uses JavaScript which can be turned off by the end user via their browser. However, server-side validation cannot be turned off thus making sure that the form is validated prior to being submitted.

Do I need to manually add validation to all my form fields?

No. Only if you use CSS Form Builder to add individual form fields do you have to apply validation to them. If you start with one of the 12 different preset forms, or add elements by selecting one of the 10 different form groups, the validation will automatically be applied to each individual form field. You can, however, modify the validation in any way you desire through the CSS Form Builder interface.

Can I use CSS Form Builder to modify my existing forms?

Yes. CSS Form Builder has the ability to import form fields that already exist on a page, so that you can modify the functionality and design through the easy-to-use interface. However, once imported into CSS Form Builder, you will need to make additional modifications to specify the type of form element, and any validation you wish to use.

What other products might I want to consider?

CSS Form Builder works great with DataAssist and Universal Email. As such, many customers enroll in the WebAssist Extension Library Membership Program because it includes these three products.