Using HTML to Add Images, Links, and Text Formatting

HTML formatting is supported in lots of places across Wufoo:

This article goes over a few popular ways to use HTML in Wufoo, but w3schools.com is a great resource where you can learn how to do more with HTML.

Embedding Images & Media

Learn how to add visuals into your form with HTML.

TIP! Use a Section Break Field We suggest pasting the HTML code for images, videos, maps, and other media into the Instructions for User field setting in a Section Break field, which doesn't collect any data. It's an empty canvas perfect for embedding media in your form!
Images

To add an image, enter the following HTML:

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

Just replace http://example.com/puppy.gif with your own image URL.

TIP! Add Logos in the Theme Designer You don't need to use HTML to add a logo to the upper-left corner of your form. Instead, use the Theme Designer. Learn more: Adding a Logo
Videos

To embed a video, grab the embed code from a video website like YouTube or Vimeo and paste it into your form. You can usually find the embed code for a video in the Share options for that video.

The embed code will look something like this:

<iframe width="420" height="315" src="https://www.youtube.com/embed/fJ9rUzIMcZQ" frameborder="0" allowfullscreen></iframe>

The video will end up looking like this when you view your form:

Maps

To embed a map, grab the embed code from a maps website like Google Maps and paste it into your form. You can usually find the embed code for a video in the Share or the Link options for that map.

You can usually find iframe codes in the Share or Embed options for a map, and the HTML will look something like this:

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d228611.25294358036!2d-82.59650605382204!3d27.997780751096553!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x88c2b782b3b9d1e1%3A0xa75f1389af96b463!2sTampa%2C+FL!5e0!3m2!1sen!2sus!4v1462565615208" width="400" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>

Formatting Text

Learn how to style text in your form (like bold or underline), or make text into a link, with HTML.

Style (Bold, Italic, etc.)

Here are some popular tags you can use to format specific text in your form.

Tag
Description
Example Text
<b>Your text here</b>BoldYour text here
<i>Your text here</i>ItalicYour text here
<del>Your text here</del>StrikethroughYour text here
<sup>Your text here</sup>SuperscriptYour text here
<sub>Your text here</sub>SubscriptYour text here
TIP! Use Themes to Make Global Style Changes Themes let you control the fonts and styles across your entire form. For example, if you want to remove the bold style from all field titles in your form, change the Typography settings in your theme and then apply that theme to your form. Learn more: Designing & Applying Themes
Links

To make text into a link, use the following HTML:

<a href="https://www.wufoo.com" target="_blank">Wufoo</a>

This example would create a link that looks and works like this: Wufoo

Just replace https://www.wufoo.com with the URL of the website you want to link to, and replace Wufoo with what you want your link text to say. The piece that says target="new" ensures that when people click the link, the website will open in a new tab or window so they won't be taken away from your form.

This article goes over a few popular ways to use HTML in Wufoo, like embedding images, videos, and maps into your form. You can also use HTML to format text or add links into your form.

Create online forms

Add HTML forms to your site in a snap—no coding required.

Change Language