Embedded forms: translating select options

forms

#1

How would you translate select options for dropdown items on an embedded form? The form might look something like this:

<select name="select_field">
    <option value="option_1">Option 1</option>
    <option value="option_2">Option 2</option>
    <option value="option_3">Option 3</option>
</select>

I would guess to translate the fields like I would any other, using fieldLabels:

hbspt.forms.create({
  portalId: '1234567',
  formId: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
  locale: 'ja',
  translations: {
    ja: {
      required: "必須",
      submitText: "送信する",
      fieldLabels: {
        select_field: "あかさ",
        option_1: "いきし",
        option_2: "うくす",
        option_3: "えけせ"
      }
    }
  }
});

However, this does not work. Only the tag is translated.

Any ideas?


#2

Why would you need to?

When you create a form, you can assign the label and value in the form options on hubspot, and when you pull the form, it will have all the labels and values as assigned.


#4

The form is originally in English but needs translation into Japanese and Chinese. The example code I gave is simplified for illustration.


#5

Hi @friendofdog,

The options of a select cannot be translated in the same way other form options can. Form field labels are set in the form editor (like dannio said) and must be managed there. You could also do custom translation via Javascript.


#6

Ah, okay that makes sense. I thought I was missing something as I was combing over the documentation. Thanks for the clarification.