As many of you have already noticed, we’ve been rolling out some changes to Wufoo. As we approach our 10th birthday, we’re excited to highlight the recent updates and give you a little preview of what’s coming next.
The most obvious change is probably the new background. We’ve opted for a simpler style this time, removing the old yellow stripes. This is a big step towards our plans to bring a fresh look and feel to Wufoo.
Easy Form Builder access
Clicking on a form title in the Form Manager now takes you directly to the Form Builder. This is a great way to make some quick changes or additions to a form. You can still access the Form Builder through the Edit button under the form as well.
Got new entries? Find them fast!
If you’ve gotten some new entries in the last day, the Form Manager displays a count of those entries next to the form title. To make it even easier to check on your latest entries, clicking the green Entries notification will now take you straight to the Entry Manager. As before, you can also continue to use the Entries button under the form.
Quickly share or embed a new form
After saving your changes in the Form Builder, we provide some handy links to help you take the next step in preparing your form. Our latest addition to these options is a direct link to your form’s Share page. Since this is the best place to find all of the options for sharing or embedding your form, it felt only natural to make the Share page only a click away from the Form Builder.
Updated Share page
The Share page has been updated before but we’ve got some new ideas that we’re getting ready to roll out. As with the rest of the changes, the focus will be on helping to streamline your workflow and making it easier to find the most commonly used features.
Form Manager design and layout
The Form Manager is where many of you spend a lot of time, and we’re hoping to make that time a little more enjoyable and productive. We’ll be looking at ways to better organize some of the existing features and continuing to make the Form Manager a little easier on the eyes. The new design should also make it easier for us to adapt and expand the Form Manager to accommodate any additional changes in the future.
As always, our goal is to make building online forms fast, easy, and fun. We hope these updates will help with that goal, and we’d love to hear what you think too. If you have any thoughts, comments, or suggestions, please share them with us!
It can be rather satisfying when you no longer need your form.
Maybe you’ve received all the entries you need and you’re ready to start digging through your data with a report or you’re done with a major project and you can finally put your form to bed.
Whatever the reason, when you do close your form, there is always a chance a straggler will still attempt to view it. When this happens, they’ll see a little message telling them the form isn’t accepting entries. Depending on if you made the form private or if it hit the entry limit, the message will be different:
Those do the job. They let your user know the form isn’t accepting entries, which may be all you really need to tell them. What if you want to change the message though? Perhaps you want to tell your users the form is closed, but they can get check out your website or you just want to show them a picture of a dinosaur eating pizza.
There’s not a setting that will let you change that message on your form, but as with most things Wufoo, where there’s a will there’s a way. We can keep the form “live” and hide the submit button and all the fields in the form so that the only thing left is a section break with your personal message.
First off, we need to make sure the form is active again. So if the form has hit an entry limit, make sure to reset that or make the form public once again.
After that, we need to make all fields in the form admin only. That way, you hide the fields on your form from everyone but yourself.
Here’s how you do it:
- Click the Forms tab at the top of your page.
- Click Edit on your form.
- Now click on your field and change the Show Field to to Everyone.
Job’s a good’un. Now add a section break field to the form and add your custom message in there. Your form should be looking a bit like this:
All the fields are admin only, which means they won’t show up in the form, but you keep all the data you received from those fields. However, if you view the form, you can still see the submit tab, which looks a bit…rubbish.
We can add some simple custom CSS to get rid of that title, the grey line below it, and the submit button.
That CSS will use “display: none;” to essentially hide the submit button, title and grey line from the form. All that’s left is to apply the finishing touch by enlarging the size of the section break text via the Theme Designer. Put it all together and the final piece should look a bit like this:
You’ve got yourself a custom message for a closed form and a T-Rex with a full belly. Beautiful.
And behold, another post with the most(est) from our expert, Kane. Questions for him? You know where to go!
When there are loads of users in your account, you may want to keep an eye on all the changes happening to your forms. Wufoo’s got you covered.
With the activity log, you can dig in to everything that’s been going on. From when each user’s logged in down to when you last upgraded the account—you can use the activity log to keep a keen eye on all those exciting forms of yours!
Here’s a quick run-through for you.
The best forms are the ones that are created with all the right fields form the get-go. Wufoo’s got a lot of fields—some regular, some Fancy Pants—and though they seem similar, each field has its own specific function.
Today, we’ll go over a three of our most common fields (Checkboxes, Multiple Choice and Dropdown) and give you some examples and tips to help you pick the field that’s right for you! This might be review for you experienced Wufoo-ians, but stick around anyway—you just might learn something.
- Checkbox Fields: A question with a group of answer choices that the user can select. They can select any combination of answers. Best used when there are multiple “correct” answers.
- Multiple Choice Fields: A question with a group of answers choices that lets the user select one choice only.
- Dropdown Menus: A question with an answer fields that expands into a list of options that lets the user select one choice.
I’m thinking of hosting a little event the whole Wufoo team for St. Patrick’s Day. This year’s event is a Leprechaun Fun Run to raise money for charity, and I’m going to create a registration form with all three of these fields!
Now how to pick—just ask yourself: “Do I want the user to be able to select more than one option?”
If the Answer is YES the choice is clear—CHECKBOX.
I’ll need a little help (one dinosaur can only do so much!) for my event, so I’ll provide them with a set of options to pick from. I don’t want to limit people who want to help, which makes a checkbox the perfect field — They can select as many of the answer choices as they want.
Field tip: Because you can select multiple checkboxes, each answer choice appears as a separate column in the Entry Manager’s Datagrid.
Moving on…let’s say the answer is NO to the question. Maybe you only want to user to have ONE choice. You’ve got a few options: Multiple Choice Fields or Dropdown Menus.
Multiple Choice Example
I’m going to make event t-shirts (obviously) so I’m asking the other Wufoo peeps to help me pick the design. But I want only ONE design, so I’m going to force them to pick their favorite. This is where multiple choice fields come in. Unlike checkboxes, multiple choice fields only allow the user to select one choice.
Field tip: The Multiple Choice field lets you add in an “Other” option that can be selected.
Lastly dropdown menus—-They also only let you select one option, but with the added bonus of not taking up unnecessary space.
Drop Down Example
I want to collect the t-shirt size, and people all pretty much have an idea of what sizes are available. I don’t need to take up precious space on the form listing them out a multiple choice field, so a Dropdown menu is the better choice. Dropdown fields are designed to let the use only select one option, but with as little space as possible.
These generally come in handy when you have some answer choices that the user doesn’t need to necessarily see all of in the beginning. Chances are, each person knows what size shirt they wear.
Field tip: If you a list of the items you want to include in a Dropdown menu (or even a multiple choice menu!) you can import directly by clicking Import Predefined Choices button.
And there you go, form fans. A perfect form that’s going to collect all the correct data in all the right places. Now aren’t you happy we got that all sorted out? Forms can be fun, but they’re the most fun when you make them correct right from the beginning.
Let Nicola know below if you have questions! And don’t forget to check out Guides for even more info and tips.
It’s easy to let clutter accumulate during the year and all that junk can really make life more difficult. Likewise, forms often end up with incorrect or unnecessary design elements that will frustrate users. So roll up your sleeves because we’re going to get started on some spring cleaning!
Know your audience and design to their expectations
An inventory checklist for your co-workers will differ greatly from a public newsletter signup, for example. This one is more general, and not a specific action to take, but it’s important to keep in mind for the rest of the tips. The following suggestions won’t apply identically to every form, and the best form design will depend on your specific goals and users.
Use the best field for the job
With Wufoo, we provide a bunch of different fields to ensure you have the right tools available while building your form. However, sometimes forms use a less than ideal field and that can cause that range of choices to backfire.
Our fancy pants fields like Address, Email or Website are pretty easy to use correctly, but the standard field types can be a bit more tricky. Dropdown, Multiple Choice and Checkbox fields are the usual troublemakers. In general, here’s where each field is best suited for the job:
- Multiple Choice: Use when you have 5-7 options and a user can/should only pick one. These fields are perfect for Yes/No or similar “binary” questions.
- Dropdown: Like Multiple Choice, but better when you have more than 7 options, of if you’re trying to save vertical space (embedded forms can benefit greatly from this).
- Checkbox: The only field of the three that allows for more than one option to be selected. If a user should be able to select multiple choices, Checkbox fields are the way to go. They can also be great for situations that only allow a single choice (like an opt-in or confirmation field).
#2: Adjust field size to match desired inputWe’ve discussed some of the advantages to changing field size before, but another great use for the field size is to signal your expectations. Since you can adjust each field’s size separately, don’t hesitate to experiment a bit and observe how the entry data you receive changes accordingly. Our built-in Address field uses this approach by keeping some fields full-width and setting others to be shorter.
#3: Only show fields when they’re neededOne of the great advantages of online forms over paper is that you can add and remove fields in response to user input. While a paper form needs to include every possible field, online forms like Wufoo can adapt to the individual user. To keep things clean and simple, consider using Field Rules to hide optional or conditional fields when they aren’t relevant to the particular entry. We’ve got even more info using Field Rules to adjust your fields here.
#4: Give users a clear pathTo maximize the available space, paper forms often rely on a multi-column format. With online forms, multiple columns can be a useful tool for replicating a familiar layout (Address fields are a great example again), but overuse of columns can make things more difficult for the user. Having to scan back and forth to find the next field is tiresome and the increased width can often interfere with a mobile-friendly design, so keeping things simple with a single column can be a significant improvement.
#5: Customize button labels to provide contextWhile the standard “Next Page” and “Previous” labels will get the job done, tailoring the text to fit your specific form can be an easy way to improve the user’s experience. Giving users an idea of what’s coming up, or what they just left, can make moving between pages pain-free. This can be especially important when you have more than a few pages, since a user may not be able to remember where they are in the process. If you’re feeling particularly bold you can customize the “Submit” button as well, for another opportunity to delight your users. Questions for Michael? Let him know below!
St. Patrick’s day is looming and nobody is finding the dosh at the end of the rainbow. Rather than exploring the Irish hills for gold, try making some money through your form. The payment settings section lets you set up your form to collect money for anything from a donation form for your next holiday to Dublin, to order forms for your business.
Check out our video to learn how to apply payments to your form. Then buy yourself a Guinness to celebrate.
Hey there, everyone! Cody here and newest kid on the Wufoo block of product experts. So just like you, I was new to Wufoo once. With a little practice and the good company of our Newbie series, you should be a pro in no time. Sometimes, you just want to get your logo on your form—is that too much to ask? We don’t think so, and I’m going to show you how!
The first thing you’ll need is your logo. “I already have that, Cody.” you’re probably saying. Well, great! Grab that logo, and let’s get it up on the internet. In order to display your logo in Wufoo, you’ll need to host your logo somewhere. Hosting just means you’re uploading that image somewhere that can be viewed by Wufoo whenever it needs it.
Upload your favorite Logo: We suggest hosting your logo using a service like Dropbox.com, HTTPSImage.com, or SSLpic.com. Whatever you decide, you’ll need to find your direct link.
Dropbox is an amazing solution. If you decide to use Dropbox, getting your direct link is easy. Once you’re logged into Dropbox, click on the New Upload button up at the top of the page.
You’ll then be able to select your logo and upload it to Dropbox. When the upload is finished, click on Share just to the right of your fresh newly-hosted logo and copy the link that’s provided. Once you have it copied, you’ll need to make one small change. At the end of that link you’ll find a 0, change it to a 1, and you’re all set.
It will look like this when you’re done: https://www.dropbox.com/t/4sb2h8crnrm9e3n/bestlogoever.png?dl=1 *And hey, don’t try and click on that link of course, cuz it’s not real.
SSLpic.com is great. They’ll email you a copy of your direct link that you can use to get your logo up on Wufoo! They do have a strict no-robot policy when it comes to hosting logos, so you’ll have to make sure you’re not one of those before you use their service.
If you’re not a robot, then you should be good to go. The direct link you get from them will look something like this: https://static.e-junkie.com/sslpic/65357.518de12jwk29m20ee85b2339.jpg *Same story with this link—it’s not real.
HTTPSimage.com is another gooder. Your direct link will be provided straight away once you’ve clicked that Upload button. It appears that while they do not allow illegal content to be uploaded, they’ll allow robots here, which is very kind of them.
Host it using SSL
What do all of these hosting options have in common? No one? They all begin with https:// and that’s very important! Who would have thought that one little s could cause so much trouble. Here’s what’s up: In order to view your logo on a secure form, you’ll need to have that s at the end. Logos that are hosted without the s might just not show up, which would be terrible! Only some hosting services allow you to use https. Luckily, all of the options above are nice like that. Make sure your link starts with https:// and you’ll be all set.
Create a Theme
Once you have that fresh new direct link, log into Wufoo and we can get down to business. The first order of business is making a new theme. Themes let you breath life into a stale form by adding all sorts of wonderful patterns and colors. Really great stuff! But don’t let me get side-tracked, we’re here to talk about logos.
Click on Themes up at the top of the page. Create a new theme by selecting Create New from the Theme dropdown. Select Logo from the Properties Menu, and Your Logo from the Logo menu. This will reveal a beautiful field that was custom made to accept your fresh new direct link. Notice the warning above, “Make sure you host your image on SSL to avoid warnings!” As I mentioned earlier, this is serious business, but we’ve done our homework. Our tickets are already paid for, and they’re waiting for us at the box-office of new logos, so pat that warning on the head, tell it to hush, and let’s press forward.
Paste your direct link into the field just below that pleasant warning, and click Apply. If your logo appears to be chopped in half, don’t despair. Immediately to the left of that Apply button, you’ll see a field labeled Height. This field will let you adjust how tall you want the space where your logo is displayed. Match this up with the size of your logo through trial-and-error. If you know how tall your logo is, then you’re a smarter human than I am.
I’m going to change the background of my header to white to match the rest of my theme. Once the preview is looking good, take a sip of water, then click on the big green Save Theme button up in the top-right corner. Specify a Name for your theme—I’m calling mine Henry—then click Submit. Your theme is now saved and ready to be applied to your form!
Applying your Theme
Click on Forms Up at the top of the page, and find an unsuspecting form in your account to test out your new logo-clad theme.
View your Form
Hover your mouse over your unsuspecting form and click View. That’s all there is to it!
How do I center my logo?
Glad you asked that question. While Wufoo doesn’t have a built-in way to center your logo, we are smarter than Wufoo gives us credit. To get your logo to appear in the center, you’ll need to create an image with a bit of space on each side. The default width of our forms is 640 pixels. This means that if you create an image that is 640 pixels wide with your logo right in the center, you will have your logo centered like a pro.
You can also use this technique to adjust the position and padding around your logo without fiddling with any code or scripting.
That’s all I have for you today, folks. You’re well on your way to learning the secrets of Wufoo.
Have tips of your own? Share them with us in the Comments!
Hi Form Friends! Hope your 2016 form building resolutions are off to an auspicious start. For me this year is going to be all about efficiency and making sure that I use my time wisely. With that in mind, I’ll answer two of our most common customer questions with the hope that you can absorb all that important info here and never have to worry about contacting us and waiting a few tantalizing hours for a response. So let’s get to it.
> Dear Support,
> Why isn’t all my data showing in report/excel export/datagrid?!
> Help me, Obi Wan Kenobi!
> Sincerely, > Worried User
My Dear Padawan,
Not to worry—the force is with you! When you set up a datagrid on a report, that grid is set by default not to show all of the fields from your form. In order to make sure that all of the fields or the fields you want are showing properly, you will need to make changes to the widget settings for that datagrid The steps for making this change are as follow:
- Click on the Reports tab at the top of the page
- Click on the Edit button for your report
- Click on the Datagrid in the preview section of the report builder
- The field checkboxes to display will open in the tab above
- Select all fields or select individual fields to show
- Save Report
You can learn more here.
Alternatively, you can click the “Allow User to View Columns Not Checked” button in the report settings — this will not add any more fields to the default datagrid, but anyone viewing the datagrid will be able to add them using the green plus sign attached to the grid within the report itself. Additionally, they will be included in an export of that report.
Cheers, Joss Wufoo Support
> Wufoo Gurus,
> Why am I not receiving my notification emails?
> Namaste, > Wufoo Yogi
Sorry to hear you’re not receiving Notification emails! Without having a link to the form, I have three guesses as to what could be happening here.
Check your notifications page to make sure that notifications are set to trigger. On the notifications page, the entries box should be ticked.
Know that any form rules will override the notification settings. If you want the email addresses on the notification page to receive all notification emails, then you’ll want to add them to each of the form rules as well. If all the above seem right, it is likely that a firewall is placing our email in a spam folder or blocking the notification entirely. We strongly recommend adding firstname.lastname@example.org and email@example.com to an email whitelist or “safe senders” list on your email server or account.
Additionally, we recommend trying the notifications with another email address not associated with your domain (such as a Gmail or Yahoo account) just to test if the problem is isolated to that particular email address or domain. If that works, you could set up an email forward from that address to the original address on your domain.
Hope this helps!
Best, Joss Wufoo Support
Even more questions for our wonderful Joss? Let her know below!
The Wufoo Form Builder makes it so easy to add fields and customize their options that sometimes many first time form creators go overboard and end up with a form that, even though it was created with the best of intentions, ends up being totally unusable. This post will help highlight a couple of common form design mistakes that most first-time form creators make.
Ready? Good. Let’s get to it then.
1. Asking For Way Too Much Information
The first common mistake we see with first time form creators is that they usually get carried away with adding fields for information that believe they need to do their jobs and end up with a form that has way too many fields that no one will fill out.
Let’s say you’ve created the most perfect sales lead form with like 80 input fields to make sure you get all of the information from potential customers that you think you may need just in case someone like Mike from Marketing asks for it (like, “Do you have more than three pets in your household?”).
After you’ve got the form complete, you embed it on your site and wait for the submissions from potential customers to come in. And then…nothing. Zero people have filled it out. Uh, what’s going on?
What happened was that potential customers visited your site, got a little bit interested, and were thinking about filling out your More Info form. But then they got to it and saw it was like 80 questions long and were like, “Whoa, that’s way too long of a form for something that I’m not even sure I need” and then they just abandoned your form.
What you need to do is really rethink what information you really, really, really need at this point in time and only have those fields on your form. For most sales lead forms, you’re only going to need someone’s name and a way to get in touch with them, whether it’s an email address or a phone number. That’s probably it. You can find out other info later when you follow up with the potential customer. There’s a ton of research out there that shows that removing even one field can make a huge difference in completion and conversion rates. So make sure you only ask for the information that is extremely crucial for the purpose of your form.
2. Making Everything Required
This is similar to #1 above, so this’ll be short and sweet. After you’ve pared down your 80 input field form down to say, like 11 fields, you decided to make everything required. But I bet that even in those 11 fields, you have some fields that aren’t actually required and you could get away with some submissions not requiring that information.
It can be difficult to have the discussion with whomever thinks that that information is crucial so one way to prove it is to test it. Make the field optional but leave it on the form. Then after a couple days or weeks, follow up to see if that piece of information wasn’t as important as previously thought. If so, you have the data to back it up. And, going back to #1 above, if you find out that you can live with the information being optional, you might want to consider removing it altogether, making your form even shorter, and increasing completion rates overall.
3. Put The Verification Question at the End of Your Form
In most forms where the form taker needs to provide truthful information, at the bottom of the form there’s usually a question that says something like:
> “I confirm that all information that I’ve provided is true.” > “Your Name”
It’s usually a checkbox and a name field and most people kind of gloss over it at the end of the long information providing form. But what usually happens is that some people fudge the info (like your milage in an insurance in take form) but by the time you get down to the bottom of the form to say, “yes all this information is true” you’ve already committed to not providing the actual truthful information so you just check the box and continue on.
Francesca Gino, a professor at Harvard Business School, recently showed that by putting the signing or truth verification question at the top of the form, you’ll actually increase the truthfulness of the information being provided.
> “Using lab and field experiments, we find that signing before rather than after the opportunity to cheat makes ethics salient when it is needed most and significantly reduces dishonesty.”
While she tested on forms where people sign at the end, we can apply her learnings on our forms by asking for people’s names and confirm that the information provided is true at the beginning of the form instead of at the end.
Got some other tips you’d like to share? Comment below!
“You’ve always been there.”
Now what business owner wouldn’t want to hear that from their customers on a daily basis, right? Well, we feel incredibly lucky to have customers who not only feel that way but tell us too. Please welcome Built With Bootstrap (BWB) to the blog—an online showcase of sites, apps and tools built with/for and on Bootstrap.
Based in London, Simon Hamp, trusty web developer extraordinaire at BWB stops by the blog for a quick chat ‘n share.
I’m serious when I say that Wufoo has always been there. We can’t even remember what life was like before Wufoo in fact. For over three years, online forms have been an integral part of operations.
I built BWB in an afternoon way back in 2011 just after the public launch of Bootstrap (then known as Twitter Bootstrap). We got featured on the official Bootstrap docs, leapt up onto the first page of Hacker News and got cemented into the community.
Who the heck are ya?
Built With Bootstrap is the biggest collection of sites built with the world-famous Bootstrap front-end framework. Thousands of sites have been submitted and hundreds of designers and developers return every day to check out the latest sites for inspiration and to find new tools and services.
How the heck do you use Wufoo?
So our first form was a survey to gauge designers and developers reactions to Bootstrap as a framework. This continues to be interesting, but as far as I know, no one has really done much with this data.
The most important forms for BWB on Wufoo were developed for our Featured Listings. This allows us to easily integrate payments and other parts of the process. What does this mean? Automation, automation, automation. A massive win for me personally as I still have a day job to do, hah.
How the heck have we changed the way you do business?
It’s drastically improved it. In the early days, people were submitting featured posts and I was manually going through our queue and hand-delivering a PayPal money request. A lot of these fell by the wayside.
With Wufoo, folks have a more direct payment experience and it’s clearer what we’re offering and how much it costs.
Integrations with our other key tools, like Campaign Monitor, have been essential too.
Enough with the ‘heck’ - favorite Wufoo experience?
When I first started getting people paying me through a form that only took me a few minutes to set up…that’s incredibly powerful.
We couldn’t agree more. It’s an incredibly powerful feeling for us to be able to provide the tools our customers need to keep their businesses running the way they want. Happy customers means happy dinos here at Wufoo.
Cheers! To learn more about Built With Bootstrap, visit them here.
And of course, don’t forget to check out the Guides page for even more tips, tricks and best practices using Wufoo.