Multilingual forms

Universally automatically translates form elements on your pages so visitors can interact with forms in their language. No additional configuration is needed.

What Gets Translated

Labels and Text

All visible text associated with forms is translated as part of the normal page content:

• <label> text
• Heading and paragraph text near forms
• Button text (i.e. <button>, <input type="submit">, <input type="reset">, <input type="button">)
• Help text, descriptions, and error messages rendered in HTML

Placeholders

The placeholder attribute on <input> and <textarea> elements is automatically detected and translated.

<!-- Original -->
<input type="text" placeholder="Enter your name">

<!-- Translated (French) -->
<input type="text" placeholder="Entrez votre nom">

Accessibility Attributes

• aria-label on inputs, textareas, and buttons
• aria-labelledby and aria-describedby references (the referenced element’s text is translated)

Select Options

Text inside <option> elements within <select> dropdowns is translated as regular page content.

<!-- Original -->
<select>
  <option>Choose a country</option>
  <option>United States</option>
  <option>France</option>
</select>

<!-- Translated (French) -->
<select>
  <option>Choisissez un pays</option>
  <option>États-Unis</option>
  <option>France</option>
</select>

What Is NOT Translated

Input Values

User-entered data is never touched, and a pre-filled value on a plain text input is left alone:

• <input type="text" value="John">: the value “John” stays as-is
• <input type="hidden" value="42">: not touched

Form values are data, not UI, and translating them would corrupt form submissions.

Two exceptions, both worth checking on your own forms:

• An input with a title attribute has its value translated, including a hidden one. <input type="text" title="Search field" value="John Smith"> comes back with the value translated. If a prefilled value is data, remove the title or add class="notranslate" to that input.
• Text inside a <textarea> is translated. <textarea>Draft note</textarea> is treated like any other visible text. Exclude it the same way if it holds data rather than copy.

The value on submit, reset and button inputs is translated by design, since that text is a label.

See Include and exclude CSS selectors for excluding an element.

Field Names and IDs

HTML attributes like name, id, class, and data-* are never modified. Your form processing logic works exactly the same regardless of the display language.

Validation Messages

Browser-native validation messages (e.g., “Please fill out this field”) are handled by the browser in the user’s system language, not by Universally. Custom validation messages rendered in HTML are translated normally.

Form Submissions

Form submissions work identically in any language. When a visitor fills out a translated form:

• The action URL is not modified (forms submit to the same endpoint)
• Field name attributes are unchanged
• The submitted data is whatever the user typed, in their own language
• Hidden fields pass through untouched

Your backend receives the same form structure regardless of which language the visitor used.

Tips

Use glossary rules for form-specific terms. If a form contains domain-specific terms that should not be translated (e.g., plan names, product codes), add them as Keep glossary rules. See Glossary Rules.

Keep labels in HTML. Labels rendered as text in the DOM are translated. Labels injected via JavaScript after page load may not be.

Test form flows. After enabling translation, submit a test form in a translated language to verify the submission works correctly.