Go to Concrete 5 Full Dashboard. Check the Formidable section in the Dashboard. Click on "Forms" within the Formidable section of the Dashboard to see the created forms. Click on "Results" to show the results from any of the forms created with Formidable. Note that we also created a page in the "Reports" section of the Dashboard. This also will lead to the "Results"-page of Formidable.
Create a form
Click on the green "Create a new form"-button. The new form shows you the properties of this form. When adding a new form, some fields are filled by default. Just walk through the form and select or fill where needed.
If you'r done, check your input and click on "Save" on the bottom of the page. Your form is created! If all values are correct you are redirected to the "Elements" of your new form. Note that the gray buttons on the top left of the page are now enabled. You can easily jump from form properties to the form elements.
Duplicates forms with all the elements and mailings.
Add or edit elements
Your form is designed in rows and colums. You are able to add columns to a row and add rows of course. Each column can hold multiple elements. Adding elements is easy. Click on the "Column" and a popup opens. Click "Add element" and another popup opens with the different element-types. You can search the different elementtypes by searching. Click on "Text Field". A new popup appears! In the popup you can change the settings of the element you want to insert or edit. First field shows the type of the element you are editing. "Label / Name" is the elements label, this label is shown in the forntend of your form. "Placeholder" and "Default value" allows you to add a placeholder or a default value to the element. The option "Minimum / Maximum" allows you to set a minimal and maximum value to the field. For instance if you need the field to have al least 4 characters an maximum 6 characters. You can also set the type of validation. In this case you can choose characters or words. For integer you can choose value, and so on... In case of a selectbox you have to check if multiple values are allowed. You can also add a mask to the textfield element. A mask is a kind of overlay which force the submitter to add data in a certain format (phone, date, number, etc...). Some fields have the option to select the "Appearance" of the element. The selected valuecan change the format, type or view of the element. In case of the textfield you can't select an appearance. Every form element has the option to show a "Tooltip". You can add the content of the tooltip in the textarea next to the checkbox. In the frontend the tooltip will be shown while hovering the form element. Also not available for the textfield is the "Confirmation" option. When this is enabled, Formidable adds another form element of the same type. Both inserted values are matched to each other. If they are the same the input is valid. This is usefull for checking Email Addresses or Passwords. "Required" forces the element to be valid and not empty. A value is needed! Note that input from submitter is check even if the value isn't required! For example: Email Address field is not required and the submitter adds a non-valid EmailAddress. Formidable will throw a error, "Invalid Email Address". If the submitter leaves the field empty, no error will be thrown. Last but not least you can add a "CSS Class" to the element. This adds a class to the field and makes styling very easy! So...every thing filled out? Click on "Save" to add the element to your form.
If you have no need for a certain element you can delete the element. Note that all corresponding submitted data will also be deleted.
Just do it! See what happens...
In the "Elements" page of the form you see a list of elements assigned to the selected form. The double arrow in front of the elements allows you to drag-and-drop the elements within the elements list. The order you just changes is saved immediately to the form and is visable in the frontend!
With Formidable you can create different mailings for each Formidable Form. On every submission all the mailings that are created for thsi form will be submitted. It's not required to have a mailing.
Add or edit mailings
Go to the mailing page of the form you wish to edit. Click on the green "Create a new mail"-button. The new form shows you the properties of the mail you are about to create. First we need to provide a sender. The sender of the mail can be a custom sender (use the selectbox and select "Send from custom sender"). Insert "Name" and "Email Address" in the inputfields. If you have an "Email Address"- or a "Recipient Selector"-field in your form you are able to select it here. So the sender of the mail could easily be a form submitter. Note that in case of multiple submitters (only with multiple Recipient Selector) the sender of the form is always the first selected. Now we need to set the recipients. There are multiple options here. If you have an "Email Address"- or a "Recipient Selector"-field in your form you are able to select them here (use CTRL-key to select multiple). In case you don't want to select any you can also send to a custom email address. After that the hard part is over. Add a "Subject" to your mailing and add a "Message". Formidable is able to send HTML-mailings, so use the WYSIWYG-block to add HTML. You can also use images from the Filemanager or add links to pages within you Concrete5 website. Also available in the WYSIWYG-block is the use of form-elements in you mailing. In the Editbar above the WYSIWYG-block you see four links ("Add Image", "Add File", "Insert Link to Page" and "Insert Formidable Element"). Click on "Insert Formidable Element" and a popup appears with the the form elements from you form. There are serveral options here. When adding the "All form elements" tag in the message, Formidable will generate a list of labels and values in the mail. You also can add individually labels and values of form elements. The button "Both" will insert a string with label and value split by a colon (:). After setting up your message you can add multiple attachments to the mail. There will be send to the recipients along with the mail. Note that the attachments are loaded from the filemanager.
Just click on the "Delete"-button to delete the mail. You'll be asked to confirm.
Just do it! See what happens...
Formidable adds a page in the "Reports"-section of the Concrete5 Dashboard. It also has it's own result page in the "Formidable"-section. Both pages are the same. You can create advanced searches, custom views and save them.
Along with Formidable there is a new captcha solution. It's very easy, the submitter has to solve a simple equation. The calculation captcha can be set in the Dashboard. Go to "System & Settings", click on "Captcha Setup" in the "Permissions & Access" section. Here you can change the Captcha to the "Calculation Captcha". Note that this changes the captcha for the whole website.
When you are done building your form, you can add this to a page or stack. Just go to the page you want to have your form in. Click on "Add to YourAreaName" in the page and select "Formidable Form" in the blocks list. Select the form you want to show on the page.
If some cases you want to translate the values for some fields. For example the address-field. In USA it's called Province/State, but in the UK it's called Counties. The best solution for this is to use the default language handler of Concrete5. To do this you have to create a languagefile for the specific language you are using. If the languagefile is created you can upload this in the folder /languages/. Then go to the System and Settings page in the Dashboard and change the default language of your C5 website to the language you just added. This way the form field will be translated. To help you on your way we created a number of different versions for Formidable. You can download it at: http://www.concrete5-addons.nl/addons/formidable/languages/
For the date element you could use a language-file but you don't need to. When you are using the datepicker you can check the "advanced"-checkbox. This way you can easily add your own values to the datepicker.
dayNamesMin:[ "Su", "Mo", "Tu", "We", "Th", "Fr", "Sa" ],
dayNamesShort:[ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" ],
dayNames:[ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ],
monthNames:[ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ],
monthNamesShort: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ]
You can use events to do something.
on_formidable_load - fires on load
on_formidable_review - fires when a submission is reviewed
on_formidable_submit - fires after successfully submitted