Skip to main content
Every field in your HubSpot form becomes a component in a WhatsApp Flow, and Meta caps how much label text each component can display. Labels longer than the cap get clipped on the customer’s phone, most noticeably on iPhone. The Flow still publishes, and the answers still reach HubSpot correctly. The only consequence is visual, which is why this is easy to miss until a real customer opens the form. This page covers how to build HubSpot forms that read well on every device. For how a form becomes a Flow, see Flows.

The short version

Keep labels short

Aim for 20 characters or fewer on dropdown and text fields. That is roughly three short words.

Use radio buttons for short lists

Fewer than eight options read better as radio buttons than a dropdown, and give you a longer label.

Put long questions above the field

Use a rich text element for the question and keep the field label itself short.

One task per form

Each form becomes a single screen. If you need two tasks, use two forms.

Use a WhatsApp-only copy

Changes to a HubSpot form also change it on your website. Keep a separate copy for WhatsApp.

Test on an iPhone

Android is more forgiving. If it reads correctly on iPhone, it reads correctly everywhere.

What happens to your field labels

Each HubSpot field type maps to a WhatsApp Flow component, and each component has its own label limit. The fields people use most are the tightest. Option labels within a dropdown, radio group or checkbox group get 30 characters each. Help text, placeholder text and option descriptions from HubSpot do not carry over to WhatsApp, so every word the customer needs must be in the label, the options or a rich text element. Rich text becomes a heading only when the whole element is a single H1, H2 or H3 heading of 80 characters or fewer. Anything else becomes body text, which keeps bold, italic, links and lists.

Why it looks fine on one phone and wrong on another

The character counts above are a guide, not a precise threshold. What actually decides whether a label is clipped is how much room the text has once the device has taken its share for padding, the chevron on a dropdown, and the customer’s own font size setting. That varies a lot. The same 33 character question can render in full on one Android handset, lose its last word on another, and be cut mid-word across two lines on an iPhone. The practical consequences:
  • iPhone is the strictest surface. Design for it and the rest follow.
  • Testing on one device is not enough. A form that looks correct on your own phone can still be clipped for a large share of your audience.
  • Non-Latin scripts and wide characters run out of room sooner. If you are collecting in Arabic, Hindi, Thai or Turkish, treat the character counts above as generous and aim shorter.

Choosing the right question type

Most clipping problems come from using a dropdown where a dropdown was never the right control.
Set the field to Radio select in HubSpot. You get a 30 character label instead of 20, the label sits above the options as a block of text that wraps rather than being squeezed inside the control, and the customer answers with one tap instead of open, scroll, select, close.Meta’s Flows best practices recommend dropdowns only for eight or more options. Following this resolves most clipped labels on its own.
Long lists belong in a dropdown. A country list or a product catalogue as twenty radio buttons is a wall of text.A dropdown holds up to 200 options. Radio and checkbox groups are capped at 20, so anything longer has to be a dropdown regardless of how the label reads.
Multiple checkboxes in HubSpot becomes a checkbox group, with the same 30 character label allowance as radio buttons and the same 20 option ceiling.
A two option dropdown is the worst case: the tightest label allowance on the shortest possible list, and two taps to answer a question that deserves one.

Writing labels that fit

A WhatsApp Flow is a conversation, not a paper form. Short labels read better here even where there is room for more. A few rules that keep labels tight without losing meaning:
  • Drop the polite scaffolding. “Please select your” and “What is your” add nothing on a phone.
  • Use a noun, not a question, wherever the answer is obvious from the options.
  • Put extra detail in a rich text element above the field. Help text and option descriptions do not appear in WhatsApp.
  • Put shared context in a rich text heading at the top of the form instead of repeating it in every label.

Name the form for your customers

The HubSpot form name becomes the title at the top of the WhatsApp screen, so customers see it. Use a short, task-focused name such as “Book a callback” rather than an internal name such as “Website contact form v3”. Meta’s Flows best practices recommend sentence case for screen titles. Choose the name before you sync. Flowella uses the form name to find the Flow in Meta, so renaming the form later creates a new Flow, and templates you have already made keep opening the old one. See Flows.

Use a WhatsApp-only copy of the form

The Flow and your website use the same HubSpot form. Shorter labels, a customer-facing form name and question copy in rich text also change the form on your website. To design for WhatsApp without affecting your website, make a copy of the form in HubSpot and sync the copy. The copy has the same fields, so answers land in the same contact properties. Workflows that wait for Form Completed must filter on the copy’s form name.

When the question genuinely needs to be long

Some questions cannot be shortened without changing what you are asking. A qualification question, a consent question or anything with a legal wording requirement needs its full text. For these, put the question above the field and keep the field label minimal:
1

Add a rich text element

In the HubSpot form editor, drag a rich text element into position and enter the full question.
2

Add the field underneath

Place the dropdown, radio group or text field directly below it.
3

Give the field a short label

Use one word, such as “Answer”. The question is already above it. Avoid a single full stop: if a required answer is missing, the customer’s error message names the label, so it would read “Missing required field: .”.
4

Repeat for each long question

Alternate rich text and field down the form so the pattern stays consistent.
The result reads as a question with an answer control underneath, which is what customers expect. Rich text has far more room than a label: up to 4,096 characters as body text.
Use this pattern only where you need it. Every rich text element is an extra component, and a screen holds a maximum of 50. If a form would need more than 50 components, Flowella keeps every input and drops all of the rich text, so none of your question copy appears. Mixing the pattern into a form where most labels are already short also makes the layout look uneven.
After you change a form in HubSpot, select Sync WA Flow on the Flows page to publish the change.

How many questions to ask

Completion drops sharply as forms get longer, and WhatsApp is a more impatient surface than a web page.
  • Three or four questions per form is a good target for a first touch. Ask the rest later in the conversation.
  • One task per form. Flowella builds each form as a single screen, followed by a thank-you screen. If you are collecting an address and a delivery preference, use two forms.
  • Ten options per screen at most. Meta recommends no more than 10 options per screen. More than that and customers stop reading and start guessing.
  • Five opt-ins and one photo picker per screen. These are Meta limits. Single checkboxes and consent checkboxes both count as opt-ins, and each file upload field becomes a photo picker. A form over either limit fails to sync.
  • Conditional fields always show. WhatsApp shows HubSpot’s dependent fields to everyone, straight after their parent field. If a dependent field is required, every customer has to answer it, so make dependent fields optional or leave them out.
  • Split long forms in two. A short qualifying form followed by a second form usually beats one long one, and it lets you branch on the first answer.
See Lead capture and qualification for a worked example of the two-form pattern.

Before you sync

1

Read every label as it will appear

Count the characters on your dropdown and text field labels. Anything over 20 is at risk.
2

Check your field types

Any dropdown with fewer than eight options is a candidate for radio buttons. Check the form has no more than five single and consent checkboxes in total, and no more than one file upload field.
3

Sync the form and preview it

On the Flows page, select Create WA Flow or Sync WA Flow, then Open in Meta to see Meta’s preview of the Flow.
4

Send it to a real iPhone

The preview is a guide. A handset is the only true test, and iPhone is the strictest one. Use the Test Template card on a template with the Flow button to send it to your own number.
5

Check WhatsApp Web if your audience uses it

Controls render differently on a laptop. See WhatsApp Web and Desktop.

Flows

Sync your HubSpot forms to WhatsApp Flows and check their status.

WhatsApp Web and Desktop

How Flows render when customers reply from a laptop.

Workflow recipes

End-to-end recipes that put these patterns to work.

HubSpot sync failures

Diagnose forms that will not sync or submissions that never arrive.
Meta publishes the underlying constraints in its own documentation. For the full component reference, see WhatsApp Flows components, and for Meta’s design guidance see Flows best practices.
Last modified on October 30, 2026