HEADER

Hi All,

This tutorial will show you how I made the demo contact form on this site:

Webmaster note: This tutorial was created using an early version of ChronoForms.
In current versions there are more features and the location of some settings has changed.

#1 - Install Chronoforms component normally like any other component. Go to Installers > Components > then choose the downloaded file from my download area and click install. Look for the 'Success Screen'.

#2- Go to Components > Chronoforms > Configuration and click "Save" but don't change anything! Yes, for now don't change anything!

#3- Now, click 'New' and type a unique form name. At "email the results" choose "Yes", then at "Email addresses" write the email which you will receive the emails. Then write the subject of it if you like, at the "form method" and choose "Post".

Now its time for something tricky that many users want. At the moment, when someone fills the form and hit "send", it will reach my inbox. BUT if I want the visitor to get a copy too. how do I do that?

At the "Email field" write the name of the field where visitors will enter their email, the  name is YOUR HTML NAME FOR THIS FIELD, so at my HTML code I have the email field called "email", and thats why I write it "email".

If you want to, you can do the same with the subject to create an e-mail subject using input from the form!

You *must* complete fill in the three "From" fields as those are necessary for the email to be sent at all!! 

Now to the 2nd tab:

 #4- Enlarge the HTML code box by clicking on the [±]. Then paste your HTML code for the form. Where do you get this HTML code? You create it with any HTML editor, like Macromedia Dreamweaver, MS FrontPage, NVU or whatever.

 #5- Do you want any validation rules on your field values? If you do then then enlarge the JavaScript box and paste your JavaScript code there. Again you need to create your own JavaScript or copy it if you already have it.

#6- Now go to the third tab. I am sure you want to show a "thank you" page or whatever to your visitor. To do this, just put the URL to redirect him/her to after they submit the form into the "Redirect URL" box.

 #7- May be you don't want to get spammed? Go to the "Anti Spam" tab, enable it and then put : {imageverification} inside your HTML code where you want the verification image and input box to appear.

#8- Now you can create a new Joomla menu item of type Link - URL and make the link as : index.php?option=com_chronocontact&chronoformname=form1 where 'form1' is your form name. 

Return to the Tutorials page