The key in making this work is the inline frame element, more commonly referred to as the iFrame tag. Inline frames can be used to embed not only content like videos, maps, & even Wufoo forms within an HTML file, but you can even embed other HTML files.

Adding Video

Sites like YouTube & Vimeo offer the ability to access and copy iFrame codes. By copying these code snippets and pasting them into your Section Break field you can display the video right inside your form.

Here’s an example on how to locate the embed code in YouTube:

1. Just below the video title and view count you’ll see a row of links. Click the “Share” link. This will present a shortened link to the video on YouTube as well as sharing options for various social media sites.
   
   

   

2. Mouse over, and click the “Embed” link.

3. Ta-da! It’s iFrame time. Here you’ll find the default iFrame embed snippet. YouTube will even allow you to customize features of the embedded video. Allowing you to adjust parameters such as display size and whether or not to have the video be served over https:// protocol.
   
   

   
   Special Note
   In Part 1 we covered how embedding non-https:// content in a form that is being served over https:// can trigger security errors in most major web browsers. In some cases even preventing the embedded content from loading. To remedy this you’ll want to make sure to check the https:// box before copying your embed code, especially if you’re on our Bona Fide or higher level plans.

4. Select & copy the iFrame embed code and then paste it within the instruction section of your Section Break field.
   
   

   

5. Click ‘Save’ and you’re good to go!

Adding Maps

To embed an interactive map is pretty much the same process! You’ll just want to be on the look out for the Share/Embed links, or even an image of a chain link. Here are some visual aids on where to find the embed snippets for the 3 major players in the Map game.

Google Maps

bing

MapQuest

Just as with the video embed, copy & paste the code into the instruction area of your Section Break. Save those edits, and bang-zoom you’re golden!

For more ideas on the types of forms you could use maps, you can head on over to our form gallery.

Have questions?

Feel free to leave a comment below or reach out to your friendly, neighborhood Wufoo support team!

Take it away, David!

As a co-founder, the CFO and VP of Operations, I wear a lot of hats here at Rev. Our company’s been in operation since late 2010 - having grown from a tiny start-up to a slightly less tiny startup with fourteen fulltime employees.

Currently, we offer two services, primarily for small businesses and consumers: Audio Transcription and Document Translation. Both services are done by our global teams of work-from-home freelancers.

My role within the Rev engine has many parts. These days I’m focused on Operations - improving turnaround time, quality, and consistency. This involves everything from improving the customer experience on our website to managing how we attract, hire and manage our freelancer workforce.

How are you using Wufoo?

Recruiting, recruiting, recruiting. This is where Wufoo’s stepped up to the plate for us. With their awesome and easy-to-create forms, our audio transcription and document translation services can collect job applications hassle-free.

Who is using Wufoo in your organization?

Our recruiter is the one who evaluates all candidate applications through Wufoo every day. With the Wufoo API, we’re able to bring all the form data into our own system so we can use it there. We’re then able to customize it in order to fit into our recruiting workflow. Which leads us right to…

How has Wufoo changed your workflow or the way you do business?

Well, pre-Wufoo, we had to use our email inbox and a spreadsheet to help manage our application submissions which got to be pretty inconvenient. Wufoo has made it so much easier to manage inbound applications, especially as our volume continues to increase. Also, using the Wufoo API has meant the death of the dreaded manual data entry. We’ve cut it out completely from our new account creation process which has saved us precious time not to mention our sanities!

What’s been your favorite Wufoo experience?

Definitely how we’ve used the API to automatically pull data from our application forms into our own user management system. It’s cut down on the manual labor needed to manage our recruiting process in a big, big way.

Anything else?

Here at Rev, we’ve only just begun to scratch the surface of how we can use Wufoo in the future.

High-five to you, David and your entire Rev team! Thanks for sharing your experience with us.

Check out Rev if you’re interested in more information about their powerful audio and business transcribing services.

OnePage CRM gives you a clean and simple interface to work with that lets you focus on what really matters in your business - sales actions. With the added punch of our Webhook API, you’ll have more than luck on your side when it comes to capturing those leads.

To Use This Integration

1. You’ll need an account with Wufoo and one with OnePage CRM. Wufoo has both free and paid plans and click here to see which of OnePage CRM’s plans will work best for you.

2. Create a form in Wufoo and you’ll see that OnePage automatically matches the standard Wufoo fields. You can also add existing Custom Fields as long as you match the fields’ labels in both apps.

3. Connect Wufoo to OnePage CRM. Head to Wufoo > Forms > Select form and click on Notifications for this form:

Send Notification to Another Application and select Webhook from the dropdown then click “Add integration”:

Next, go to the Wufoo configuration page back on OnePage. In Step 2 below, you’ll need to copy both the Webhook URL as well as the Handshake Key.

Return to your Wufoo Notification Settings page. Paste both the Webhook URL and the Handshake Key you copied from OnePage into the Webhook URL and Handshake Key:

Be sure to check the box labeled, “Include Field and Form Structures with Entry Data”. Then click Save.

Configure data capture in OnePage CRM. You can set the default parameters for leads gathered via web form:

You’re all set! Need another run-through? Watch the video below:

Highest of high-fives to Anna Narolska-Cielecka from OnePage CRM’s dev team for getting this integration together. If you’re looking to integrate your web app with Wufoo, be sure to check out our Ultimate Guide to Integrating with Wufoo.

Using our handy-dandy Wufoo Form Embed Kit, Strikingly gives your Wufoo form a beautiful place to live. Their professional, elegant designs will set you apart from the rest. Don’t just take our word for it either, check out this stunner of an example here.

To Use This Integration

1. You’ll need an account on Wufoo as well as one on Strikingly. Wufoo has both free and paid plans. *You’ll need to have a Pro account at Strikingly in order to use the Wufoo integration.

2. Add a new section to your Strikingly site by clicking on the “Add new section” button in the left editor toolbar.

3. Select the “App Store & HTML” section. Click on the Wufoo Form app icon and a popup will direct you to login or create an account with Wufoo. Once you’re logged-in, you’ll be able to create and edit your forms. Once you have a form, click “Insert” to add it to your Strikingly site.

Want a visual step-by-step? Watch the video below:

And there you have it! You’ll be on your way to big and beautiful things in no time. Many thanks goes to Dafeng Guo and Teng Bao for striking up this integration. Looking to integrate your web app with Wufoo? Take a look at our Ultimate Guide to Integrating with Wufoo.

We’ve added over 90 new templates to the gallery and we think you’re really going to love them. Obviously, we can’t highlight all of them in this blog post, but here’s a few we thought were worth highlighting:

• Wedding Planning Survey
• Product Evaluation Existing Product
• Non-Profit: Volunteer Interests & Skills
• Fundraising Ideas
• Community Satisfaction
• Marketing Planning Survey
• Employee Satisfaction Training Development
• Win/Loss Survey: Business Lost
• Hypothesis Testing Research

Keep up to date and get the most out of Wufoo. Sign up for the Wufoo newsletter.

In this installment we’ll cover how to make clickable links and add additional images to your forms. And awaaay we go…

The Method

Adding hyperlinks or images to your form is a snap, and there are a bunch of areas where they can be included:

• Form Titles
• Form Descriptions
• Section Break Fields
• Field Instructions
• Confirmation Messages
• Confirmation Emails

Here’s an example of HTML used to create a hyperlink:

<a href="http://wufoo.com" target="_blank">My Link</a>

When you add the link to your form you’ll want to swap the URL you’d like to link to in place of the Wufoo URL within quotes. Adding those <a> </a> tags around any words or phrases turns them from regular old un-clickable text into a clickable link.

Also, the target=”_blank” portion will ensure that the link will open in a new window. Change your mind? Simply remove that part from your link.

Example of an HTML image tag:

<img src="http://example.com/puppy.gif" width="304" height="228" />

Similar to the hyperlink, you’ll want to include the URL location of where the image is hosted. You can host the image on your own server or if you don’t have your own server you can use a free image hosting site like Photobucket.

It’s good practice to adjust the height and width of your embedded image to better fit the surrounding area of your form. Additionally, if it’s a larger image you may want to scale it down in size or crop it. There are many open source image editors as well as web based tools that can help you accomplish this.

Creating a clickable image!

It’s even possible to wrap your image embed code with hyperlink code to create a clickable image like in this example:

<a href="http://daftpunk.com/" target="_blank"><img src="http://i.imgur.com/ecTVwDZ.gif" width="500" height ="262" /></a>

Which gives us:

A Caveat

While including HTML tags in your form can allow for some extra pizazz, you’ll want to make sure that your tags are properly closed. For example, if a closing </a> is missing from your code it can cause some weird results within the Form Builder as well as your live form. Weird how? Weird as in causing the code that runs the builder to think that every bit of text from where you’re adding your link down is part of the link itself.

Most often, any weird behavior from the builder can be traced back to an unclosed HTML tag so that’s where you’ll want to look first.

Forms with SSL

If you’re on a Bona Fide or higher level plan that includes the SSL feature you’ll have an additional consideration. Web browsers will trigger security warnings if any embedded content—images or video—within an SSL enabled page isn’t also SSL secure.

If you’re hosting images on your own server, and that server is SSL-enabled, you can edit the image url to https:// in your link. There are also services that provide secure image hosting, but typically for a fee.

However, if it’s a form where you don’t need the SSL encryption, there’s a way to turn it off. We have instructions on how to do that here:

Once you’ve gotten a new prospect, you need to figure out a game plan - how do you groom your newest player until they’re ready to become a paying (or playing!) customer? Now that Solve360 has integrated with Wufoo, your new prospect’s instantly available. Not only will your team see data from many sources in a single user-interface but it’s a snap for Wufoo users who can tap into the power of Wufoo’s Login API key - making life easier for everyone.

To Use This Integration

1. You’ll need an account with Wufoo and Solve360. Wufoo has both free and paid plans and check out Solve360’s pricing plans here.

2. Whip up a form in Wufoo with all of the data fields you want to capture. Be sure to name the fields exactly the same as in your Solve360 account and make sure they’re the same field types.

3. Watch the video below on how to hookup that form into your Solve360 account and if you can keep yourself from whistling along to that tune, extra three points to you (we couldn’t help ourselves):

Big shout-outs to Alex, Rahul, Steve and Mike for working on such a slam-dunk integration! If you’re looking to integrate your web app with Wufoo, check out our Ultimate Guide to Integrating with Wufoo.

Big thanks to Emma for taking time out of her day to share how she’s whipping up some Wufoo wonderful at both Frog2Prince and Grasshopper. We’re thrilled to have her in the dino family.

Say howdy to Emma!

When my co-founder and I started building Frog2Prince, we were researching different options for getting our clients’ information quickly, efficiently, and reliably. We needed the complete contents of their online dating profiles (including photos) in order to provide them with the services we offer—which are what exactly?

Frog2Prince specializes in helping improve the online dating profiles for all those eligible bachelors out there. Since we’re a business, we also needed to figure out a way for us to get paid for these services. Although my co-founder was able to build a decent site—he’s a mathematician, not a web developer—we were at a coding loss when it came to creating a sign up form that had all the necessary features. Enter Wufoo.

After a quick Internet search, we discovered Wufoo and were soon amazed at how easy it was to set up on our own. We made our first form in just one night—I was ecstatic, jumping around my apartment exclaiming, Now we have ourselves a real live business!

Wufoo gave us the ability to create a custom sign up form, one that stays on my site, links easily to Stripe, and sends text notifications whenever a client clicks the Submit button. Wufoo has saved us hours of research and coding time. Need your online dating profile edited? With Wufoo, my clients can quickly enter their profiles, upload their photos and make a payment with plenty of time left over to focus on their real goal—online dating success.

On my first day as a Content Marketing Specialist at Grasshopper, where we offer small businesses and entrepreneurs a virtual phone system, I happened to see Wufoo’s homepage on the screen of one of my team members. “Wufoo!,” I yelped, “What do we use it for?”

Allison, our Social Media and Community Manager, explained that Grasshopper uses Wufoo to collect information about our customers through a custom “Tell Us Your Story” form. We pride ourselves in providing excellent customer support at Grasshopper, so we use the form to get information about our customers’ businesses. Through their submissions, we’re able to get a better understanding of who they are and what they need. This helps us get them press attention, include them on our Happy Customers page, and we can showcase their work in the Customer Spotlights section of our blog.

Recently, I was working on a blog post about working from home and wished that I had customer interviews on hand. Allison demonstrated how I could key in search phrases like “work from home” and “telecommute” in Grasshopper’s Wufoo account or through the emails that Wufoo sends us. In a snap, we were able to find five customers who’d submitted their stories through Wufoo and who were open to talking about their experiences working from home. Voila!

Writing blog posts that feature our customers’ companies and personal stories is important to us and so we depend on the information we receive from the Tell Us Your Story Form to keep Grasshopper’s content engines running. Although Grasshopper is a more established company than Frog2Prince, Wufoo is absolutely essential to how both businesses operate, no matter what their scale is. One of Wufoo’s strengths is that it offers the kind of features that give Frog2Prince—a small fledgling business—the support it needs, while also acting as an extremely useful resource for Grasshopper—a company that’s been around for 10 years.

I’m a big fan of Wufoo at Frog2Prince, and we have lots of love for it over at Grasshopper too.

Kudos to you, Emma and we’re jazzed that Wufoo can help support both of your rockin’ businesses.

Don’t forget, single dudes—if you’re looking to spiff up your online dating profile, be sure to check out Frog2Prince.

Whether you’re an entrepreneur or a small business owner, click here to find out how the fine folks over at Grasshopper can help you with all your phone needs.

Here to share how Savoir Faire Media’s been using Wufoo to help them overcome some of the challenges they’ve faced is owner and founder, Natalie Lambert.

Take it away, Natalie!

“Wufoo has transformed our business model…”

Two years ago, as we were struggling to keep up with the volume of inquiries coming into our site and how best to organize those, we stumbled upon Wufoo. Suddenly, the clouds parted and the sun came out! We figured out that by using one of Wufoo’s free contact forms and embedding it into our site, we could capture new sales leads and make notes on each one through the website. With the easy-to-use search field, we could quickly find someone who’d called us and pull their information right up. We were also able to use the email feature to send out the contact form submission to other team members as needed.

“And has transformed our client management…”

Our next challenge was that once a client purchased a service from us, the collection of data processes were cumbersome, notes varied widely depending on whom was collecting and calls and emails were getting unmanageable. We decided to upgrade our free account to a premium account so we could create more in-depth and detailed data collection forms by service. Now we could make important questions required, provide an easy and pain-free way to collect what we needed on their schedule, and allow them to upload images, logos and screenshots as needed.

The information is stored in our form manager in Wufoo for reference back throughout the process. We were able to “edit” the entry as needed for additions and changes through the back end and enable the comment notifications to the team to keep everyone apprised of status.

Here’s a partial peek at one of our customer contact forms:

“But wait, there’s more!”

As a Project Management Professional (PMP) ®, I’m positively giddy about the vast efficiencies we’ve been able to implement because of Wufoo. Most recently, we were searching for a service by which we could create online proposals and acceptance of Terms and Conditions for our standard packages, while also collecting a deposit for services. After researching expensive and cumbersome systems, we went back to our cornerstone—Wufoo.

We created branded Agreements with key acknowledgement areas, the ability to promote additional services with a visible running total as they “shopped”, the incorporation of promo codes for special promotion discounts, and upon submission take them directly to “checkout” using Wufoo’s PayPal integration. Another win with Wufoo!

Our need to communicate with our clients on an ongoing basis regarding new products, services and promotions led us to partner with a premiere email marketing firm so we could send permission-based email campaigns on a regular basis. We simply login to Wufoo, export our contacts through the reports tool, import into our client management system on a recurring basis and voila!

“SFM + Wufoo = BFF”

From professional matchmaking services who use the forms for private personality information collection, to cake-bakers taking custom orders for sweet treats—this has been a win for us both professionally and through improved customer efficiencies as well. Thanks Wufoo for being awesome and helping us reach the success and growth we’ve experienced.

You’re very welcome, Natalie and all of us here at Wufoo are super stoked that we’ve been able to help support the awesome work that Savoir Faire Media does!

Is your organization looking to create a brand identity and need guidance from seasoned design professionals? Check out Savoir Faire Media today!

Do.com recently launched Do More, a social productivity app for your team, and we’re proud to be a featured integration in their new solution for organized individuals everywhere. Now you can engage with a customer through a Wufoo form and automatically create actionable projects, contacts, deals and tasks in Do. Do’s motto is “Work better, together.”

Can I kick it (asked Do)? Yes, you can (said Wufoo)!

To Use This Integration

1. You’ll need a Wufoo and a Do.com account; this integration’s available to free users. Wufoo has both free and paid plans and Do.com offers free and paid plans as well.
2. Create a form on Wufoo that will capture the data you want to add in Do and you’ll be in touch with your customers in no time.

Take a gander at our snazzy example here:

Big thanks to the entire team at Do for doing such an awesome job in creating a great integration! If you’re looking to integrate your web app with Wufoo, check out our Ultimate Guide to Integrating with Wufoo.