When writing an article its often desirable to get some feedback from the reader. Comments are golden, but people are often reluctant to register, compose a couple of sentences, and submit a comment. It’s too much work. Surveys embedded in your article, on the other hand, are very easy to click on. So I went on a search for how to create neat forms that I can use in my posts.
Formidable Forms is one of the best solutions available to a WordPress blogger. They have a great plugin with a huge variety of widgets and templates, that helped me create survey forms and embed them in my posts with minimal effort, then show the results to the readers in place, also embedded in the post, once they submit their responses. I will show in this article how to set up a simple survey embedded in a WordPress post.
Many widgets and form templates to choose from
Formidable Forms has a very rich set of form widgets to choose from. This is one of the things I liked the most when I started using this plugin. You can put together forms as complex as what you would expect to see in a corporate data processing system, as opposed to the bare bone widgets most other alternative packages would give you. This means that you can add a lot of rich dynamic content to your pages and create a more engaging user experience.
You can choose from simple text fields for things like names, scale widgets to ask the reader to rate some idea in your article, or combined widgets such as an address widget which already has all address lines, country, and zip, so you don’t have to build it from scratch.
You can start with a blank form, but you don’t have to. They have many form templates that are already designed for you, that you can just use as is. For instance if you wanted to use a contact form or a registration form, you don’t have to design one, because they have done that for you already.
For our simple example survey in this post, we will just add a scale widget to the end of this article, which will ask “How helpful was this article creating a survey “. We’ll add it to the end of the post. It will simply display a scale slider and when the reader submits his answer, it will display a graph of the statistics collected from all users.
1. Create a blank form
After you install Formidable Forms, it will create a menu option “Formidable” on the left navigation panel. Click on that and click the button to create a blank form.
You will be prompted for a form title. Pick descriptive names for your forms so that you can keep track of them. You can use spaces here. Later on you can change this in the form’s Settings tab. We are going to use “Survey Creation Feedback”.
Note that for this simple example, we will only have a single field in our form with a 1 to 10 scale, so we don’t need to use any one of their complex templates. But this is the place where you can see all the other templates you can start with, in case you wonder what else you can use to build forms.
2. Add the scale widget to the blank form
Once the form is created you’ll be thrown into the form editor, which of course now is completely empty. On the left you can see all the widgets you can use, including one called “Scale”. That is what we need, so drag it onto the right side where your form is, then click on it to see its settings.
3. Set the name and key of your form
You can see the form name you entered here and also a form key that FF automatically generated for you. The name is for you and the key is for FF to keep track of forms. As you can see, the key is the name without spaces and all lower case letters like this: “surveycreationfeedback”. You can change the title and the key if you want here. The main point about these entries is that they must be unique. This is how you’ll find the form later on.
4. Get the short code for the form
In the Settings tab, a little bit further down, it shows you the short codes you can use to display the form. All you need to do is copy and paste those short codes at the end of the post. They look kind of like this [[formidable id=3 title=true description=true]], but make sure you copy and paste your own, because the id might be different. The title and description fields are optional and they control weather or not you want to display those when the post is showing your form.
5. Connect a beautiful graph
Now, surveys would not be any good if we could not show survey results, would they? FF displays the statistics calculated based on user responses in beautiful graphs.
At the very end of the page under the settings tab, there’s a text area labeled “On Submit”. This is where you tell FF what to do when the reader clicks “submit” on the form. By default it says “Your responses were successfully submitted. Thank you!”, which means that when they submit their responses they will get this thank you message inserted after the widget into the post.
This is the place where you can include your custom feedback to the reader, including a graph short code, which will show a graph for all the entries submitted to this form. So in our case, if 100 people rated the post 1 to 10, it will show us graphs based on those responses.
Again there are many options you can use here to control how the graph appears, but for our simple example, we only use the form name. We’ll let FF pick default values for how the graph should render. After the thank you message that is there by default, append this extra string [[frm-graph form=”SurveyCreationFeedback”]]. Now when a user submits his response, a graph will be shown inserted in the post, right after the thank you message.
Working example
To see a working example of all of this, please click on the scale slider below. You should see a graph appearing once you hit submit:
[formidable id=4 title=true description=true]“Click fraud” detection
If you try to submit the same form twice, you get an error message “We’re sorry. It looks like you’ve already submitted that.” While this won’t be a rock solid form of protection against manipulating the survey results, still it is a nice feature that will prevent accidental double submission, at the very least.
Conclusion
What I showed above is just a tiny example of how you can add dynamic content to a page by embedding forms in it. Besides basic surveys, this product has many templates for e-commerce such as a credit card widget, lead generation such as a registration widget, and even small applets such as a mortgage calculator. So you can create elaborate questionnaires, and even quizes, depending on what package you pay for.