Currently, any public website has some contact form to collect user information. The forms are very important to gather information from users who visit us so we can know better our audience.

In the SharePoint world can be very complex to implement properly a feature as basic as this. Especially if we want to ensure confidentiality of your entry and provide a graphic design aligned with our site.

Lets go to see how we can implement all of this requirements with Kaldeera Advanced Forms in a simple way. To do this, we have a public WSS 3.0 web site with anonymous access. This site have a contact page where we want to put our form.

1. The first step is create a list called "Contact list" to collect user information
   
   
   
   We will create as many fields as you need and configure according to our requirements. In my case, to illustrate this demo, we will create only three: Name, Mail and Question.
2. Because this is a anonymous access site, we must grant write permissions to anonymous users to ensure that they can create new items into the list.
   
   
   
   To do this, go to the security settings of the list, break the inheritance of permissions and grant rights to create items to anonymous users.
   
   
   
   For anyone to know that there is a list of information collection, we can hide from browsers by using SharePoint Designer and restrict access to _layouts/viewlsts.aspx page (spanish).
3. The next step is to add the form to your contact page.
   
   
   
   Edit the contact page and add one Kaldeera Advanced Web Forms web part. Then configure it to work with contact list.
   
   
   
   Now, we have our fully functional contact form into this page.
   
   
4. Next step will be to apply the site design to our form. We access the settings of contacts list and access to Kaldeera Advanced Forms. Then, create a rule for "New Forms".
   
   
   
   By default KAF selects all fields of our list. We will add a new element of type text that will be used as a title: "Contact form".
   
   
   
   Modify field rendering mode to display label on top.
   
   
   
   In advanced settings tab, you can hide "Cancel button" and "Toolbar form".
   
   
   
   Edit Submit button properties to define a new text, CSS class and the URL of our "thankyou" page that will be showed when user accepts the form.
   
   
   
   The last thing to do is to apply some design. To do this, add a new element where we can put specific CSS styles that apply over our input fields, texts and buttons.
   
   
   
   And one last item with a bit of jQuery to give you the professional look and feel that we want.
   
   
   
   That's all, you save the new definitions... and you can see the results.

In this link you can download the form definition that I have described. You can import directly in your lists. It is a good starting point to learn all Kaldeera Advanced Forms features.

And finally, here's a video with the complete sequence of all steps taken