Custom HTML

Last updated
Save as PDF

Custom HTML fields allow for users to customize some form types to include pictures, videos and hyperlinks. Using this field can really enhance the look and feel of the front end user experience. Learn some basic ways how you can meaningfully use the Custom HTML content tool.

Using the Custom HTML Field in TAP

The Custom HTML field in TAP allows you to add visually styled content to your forms, going far beyond what’s possible with plain text. This feature helps you include rich information such as formatted instructions, links, images, and even custom HTML code directly within your forms. Whether you want to guide users with messages or add branded visuals, the Custom HTML field gives you full flexibility.

What is the Custom HTML Field Used For?

The Custom HTML field works similarly to a static text field but offers more customization. You can use it to:

Display formatted text and instructions
Add hyperlinks to external resources or policies
Embed images to enhance visual presentation
Insert your own HTML code for full control
Show content inline or as a pop-up window based on your preference

How to Add a Custom HTML Field to a Form?

Open the Form Builder within the TAP Designer.
From the left-hand menu, drag and drop the Custom HTML field onto your form.
Click the field to open the built-in HTML editor.

Working with the HTML Editor

The embedded editor offers two editing modes:

1. Rich Text Editing (No HTML Needed)

You can easily create styled content without writing any code. The editor allows you to:

Apply bold, italic, and underline styles
Change font size, type, or color
Add bullet points or numbered lists
Align text, insert horizontal lines, and more

2. Advanced HTML Editing

If you're comfortable with HTML, you can click the "Source" tab to:

Paste custom HTML code
Build layouts, banners, or styled sections
Add formatted tables or conditional content

This gives you full control over how your content appears.

Common Use Cases

✅ Styled Text

Use headers, subheadings, and paragraphs to guide users clearly.

🔗 Hyperlinks

Link to policies, help articles, or external websites by:

Highlighting text
Clicking the link icon
Entering the URL

🖼️ Images

You can display images by:

Clicking the image icon
Providing a hosted image URL
Adjusting properties such as size, borders, and alignment

💻 Custom HTML Code

Add your own HTML snippets to display customized elements like:

Branded messages
Icons
Layouts with divs and classes

Just paste the code into the source editor.

Displaying Custom HTML as a Pop-Up

Instead of showing content directly on the form, you can configure the field to appear as a pop-up window.

How to Enable:

In the field settings, choose “Display as Pop-Up.”
To show it automatically when the form opens, enable “Show by default.”
To trigger it manually (e.g., via a button), disable “Show by default” and link it with another HTML field.

Ideal for:

Welcome messages
Legal disclaimers
Optional help or instructions

Best Practices

Start with separate HTML fields for each content type while learning.
For production forms, combine multiple elements into one HTML field for a cleaner layout.
Host images online and ensure they are publicly accessible.
Use clear headings and consistent formatting to improve readability.

Where Else Is It Used?

You’ll also find the Custom HTML editor in other areas of TAP, such as:

Email templates
Thank you pages
Conditional pop-ups

The Custom HTML field gives you powerful tools to personalize and enhance the user experience in TAP. Whether you’re using basic formatting or embedding advanced HTML, it allows you to communicate clearly, brand your forms, and create polished, engaging content for end users.