Joomla Blog

Tutorials, reviews, case studies and other tips to help website owners and website developers master the Joomla content management system.

How to embed a Wufoo form into a Joomla article

Posted by on in Tutorial
  • Font size: Larger Smaller
  • Hits: 42672
  • 19 Comments
  • Subscribe to this entry
  • Print

There are a lot of form builder solutions listed at the Joomla Extensions Directory. However many third party services can be incorporated into Joomla powered sites. Wufoo is a comprehensive online form builder that is a joy to use and the basic account is free. Creating a form with Wufoo is easy, but embedding the code into a Joomla article requires a couple of extra steps. Let's start with a quick overview of how Wufoo works.

The solution presented in this post was tested using Joomla 2.5. However the same principles should apply to later versions as well as Joomla 1.7. Click on images to enlarge.

1. Register for a Gratis account at Wufoo and you'll be able to create 3 forms for free and collect 100 responses per month

2. Once registered and logged in, you can create your first form. Creating form fields couldn't be easier as all you do is click the types you want.

 


3. Click on each field to enter settings such as the title and validation options.

 


4. Finish by giving the form a name and specify what should happen after the form is completed.

 


Once your form is complete, go to the Code page and choose the Embed Form Code option.

 

For greatest browser compatibility, use the JavaScript version. Click in the box and copy the code.

Now edit your article (you could use a module too) and change to HTML mode in the editor. Paste the JavaScript at the point where you want the form to appear. Save the article, go to the frontend and view ... nothing!

What went wrong?

By default, Joomla does not allow you to insert certain tags including JavaScript. This is a security feature to prevent frontend users from entering malicious code. There are two steps required to solve this. First, login to Administrator as a Super User and go to Article Manager. Click the Options button towards the top right.

Select the Text Filters tab and in the Filter Type column, change the Super Users option to No Filtering. The choose Save & Close. This means that if a Super User is logged in, the Joomla core will not filter anything you enter into an article. However the HTML editor has its own filter so this needs to be set too.


If you use TinyMCE as your HTML editor (that's the standard one that comes with Joomla), then go to ExtensionsPlugin ManagerEditorTinyMCE. Remove the word script from the Prohibited Elements box and Save & Close.


Or if you're using the popular HTML Editor JCE, go to JCEProfilesDefaultEditor ParametersOptions – change Allow JavaScript to Yes. Remember to Save.

Now you can go to the article and paste the JavaScript code in HTML mode.

Your Wufoo form will then be displayed within the article. When someone completes your form, the details are stored and displayed at Wufoo. You can also specify that the data is sent to you as an email.



Rant of the week

While preparing this article, I was reminded of the importance of communication. Our Beyond the Basics course includes lessons on how to create forms using a free extensions called RSForm! Unfortunately this is only compatible with Joomla 1.5. The paid version, RSForm! Pro has been upgraded to Joomla 2.5 and our lesson is useful if you choose to go with that option. But we have received a number of forum inquiries asking about the free version and we have been holding out in the hope that RSJoomla will release an update. I looked in their forum and noticed a couple of people had asked if a new version was coming and they received no replies. In fact a huge number of their forum posts have no replies. So I posted a question on their Facebook page, but it too remains unanswered. I'm not writing this to have a dig at RSJoomla. To be fair, they state that their forums are not their support mechanism and when I have sent them tickets in the past, the response has been good. I wanted to use this example to highlight the importance of communication. You see, right now the message I'm getting from them is "we don't care". I'm sure they do care, but that's not what I'm hearing. Why bother having a forum, Facebook Page or Twitter account if you ignore your audience? Are you guilty of this? I know I am at times and I know how hard it is to keep on top of each communication channel. That's why I now have two team members keeping tabs on our Joomla forum. We always try to respond, even if the answer isn't what you want to hear.

I will continue to try and get an answer about RSForm as I think it is the best free one, but if that fails, I will choose a new solution and produce new lessons. In the meantime, you now have an alternative free solution using Wufoo.

Rate this blog entry:
0

Comments

  • Kevin Morrison
    Kevin Morrison Friday, 17 February 2012

    Richard, as always very useful and timely, thanks for a great article. I have been a long time member of RSForms and over the years I have found it best to just figure it out on my own as to ask them for any help. I could not agree more about the forum and have asked the same question as to why even bother with one if you are not going to support it? It would seem to me they would welcome answering questions on the forum if for no other reason than to cut down on the support tickets and answering the same questions over and over.

    They have great applications but it does not mean a thing if you do not support the people that have made you what you are, and no in reality they do not care! In fact even with their support ticket system in which I think the biggest reason they only wish subscribers to use it is they built and sell it. So it is a way for them to get us to purchase it. In fact I did and there is another ticket system that is much cheaper and free that puts it to shame.

    Anyway I just wanted to say thanks and back you up on your opinion. These developers need to be called out on their attitudes once in a while and my list of those that need it is fairly long.

  • Richard Pearce
    Richard Pearce Friday, 17 February 2012

    I don't want to give the impression that I am calling them out as much as using this experience as an illustration as to why it is vital to keep communicating. I am a long way from perfect myself as I am WAY behind on certain tutorials. The difference is I am ready to admit it and keep the conversation flowing.

  • Mike Martin
    Mike Martin Friday, 17 February 2012

    Hi Richard
    Thanks for introducing us to Wufoo, I am looking for a good contact form, I am having problems with core Joomla form. I signed up and checked out Wufoo and it is a very user friendly system of creating a form, with a large gallery of standard form themes. It is as you say, very straight forward with a many features for customising the forms. On the downside I found when testing out the forms there is too much Wufoo branding, but this maybe limited to the FREE version.

    Keep up the good work, great website.

  • Dominick Inlgese
    Dominick Inlgese Friday, 17 February 2012

    I think jotform is another good/free option that you could embed.

  • Andrew
    Andrew Friday, 17 February 2012

    Hi,

    Is there a reson that you use RSforms over the standard Joomla contacts page?

    I found RSForms a lot of hard work conpared to setting up the basic built in contact form which does work for the single contact my sites need.

    I use the info provided by a Joomla web host to set up the contact pages.

    Andy.

  • Robert Wilson
    Robert Wilson Saturday, 18 February 2012

    @Andrew,

    It really all depends on your needs. If your contact purposes are served with the default Joomla contact form, that's great. It's always preferable not to install other extensions if you can get away with it. However, many people need extra fields or some other customization that the default form makes very difficult. In that case, we do turn to extensions that can help get the job done quickly and smoothly. And we're always on the hunt for the right ones.

  • Guest
    Amos Bwambale Saturday, 18 February 2012

    For those like me (us) who like to take control of submitted data, I think those forms from joomla! ED could suffice. No restriction on number of forms field ... and besides some are free for that matter. Chronoforms, jforms, breezing forms and others. Of course there could be trade offs.
    Does this have some business logic built in to it?ofu

  • Robert Wilson
    Robert Wilson Saturday, 18 February 2012

    @Amos,

    Yep...no use collecting data if you don't do anything with it. Wufoo does in fact feature some analytics as well as logic and branching. You can build somewhat complex forms with it, and you can even integrate payment gateways and coupons.

  • Guest
    Amos Bwambale Saturday, 18 February 2012

    For those like me (us) who like to take control of submitted data, I think those forms from joomla! ED could suffice. No restriction on number of forms field ... and besides some are free for that matter. Chronoforms, jforms, breezing forms and others. Of course there could be trade offs.
    Does this have some business logic built in to it?

  • jacob gluck
    jacob gluck Tuesday, 21 February 2012

    Hi Richard,

    I am unable to find the "options" button in the article manager. I tried doing this through the "parameters" button on my joomla 1.5 system and I "whitelisted" the "super administrator" and I then removed the "script" from the tinymce configuraion page but this didn't solve the problem. In the HTML code editor for an HTML module, the system keeps deleting my code after I click "update". P.S. I am trying to insert a facebook "like" button. I am a customer of yours; help would be appreciated! TY

  • Robert Wilson
    Robert Wilson Wednesday, 22 February 2012

    Hi Jacob,

    This post is geared towards version 2.5, which means that it's probably also good for 1.6 and on. If you're on version 1.5, you may need to install an extension that will allow you to include code in your articles. There are several of these in the JED.

    Sourcerer seems to be a very popular one for including code:
    http://extensions.joomla.org/extensions/edition/custom-code-in-content/5051

  • Guest
    Brad Tuesday, 21 February 2012

    I was one of the forum members that asked about RSForms for Joomla 1.7. In that thread, Chronoforms was recommended. I am now pretty well invested down that path, but I could not find any written documentation. Today I went to the Chronoforms Forum, and found a few answers. Then I noticed a post that referred to YouTube tutorials. I went to YouTube, typed in Chronoforms, and voiala! Just wanted to share this tip in case any other Chronoforms users are struggling.

  • Ian Hayward
    Ian Hayward Tuesday, 28 February 2012

    One of the great benefits of a site like this is our ability to share user experiences.

    Richard commented elsewhere on a new RS Media Gallery recently and I was quite impressed with the marketing email I received from them - but after reading the comments here, I think I might just leave it on the shelf!

    One sees so many positive comment about the support offered by some developers I think they should be actively rewarded. Why choose to make life hard for yourself!

    Ian

  • Brad
    Brad Monday, 23 April 2012

    Following your steps, but there is no "Text Filters" tab sitting between the "Integration" tab and the "Permissions" tab. I am using Joomla 2.5.3. I am lost and need to get several previously configured Wufoo forms embedded into a newer site.

  • Richard Pearce
    Richard Pearce Monday, 23 April 2012

    You might not have the appropriate permissions to make this change. Do you know if you have a super user account? If not, ask the person who built your site to upgrade your level or make this change for you.

  • Guest
    GuitarMan Thursday, 26 April 2012

    Thank you!!! :)

  • Joe Podcast
    Joe Podcast Thursday, 14 February 2013

    I am looking at using Wufoo form code in Chronoforms. As far as I am aware Chronforms includes an option to store the the data submitted via the form in the website database. I still have to check out how to implement this in my new Joomla 3.0 site, but it the option does not seem to be available in many of the other form extensions. Maybe I'm wrong? Maybe RSforms also includes this option? I would be interested about form extensions compatible with J3.0 which also offer this option.

  • Kevin Morrison
    Kevin Morrison Friday, 15 February 2013

    I have not heard of anything that does not use the database to store information in Joomla. Joomla is a database driven CMS and everything that is collected is saved in the database and I would be cautious of any extension that writes to a file for anything but primary function.

  • Robert Wilson
    Robert Wilson Friday, 15 February 2013

    Storing your form info in your Joomla database is a common feature of good form builders actually.

    RSForm Pro gives you the ability to go back through all of your form submissions. The free version may also, but there's quite a large difference in quality between the Pro and free versions unfortunately.

Leave your comment

Guest Thursday, 24 July 2014