Form: Radio element
Räftegård, Elin avatar
Written by Räftegård, Elin
Updated over a week ago

Form: Radio element

Use the Radio element to create a set of options your visitors can choose from - when only one option is allowed to be selected.


In This Article


Radio element

1. Place the Radio element into the Canvas.

2. Add Radio options in Canvas.

Name the options the visitors can choose from (write directly in the Canvas).

3. Edit the text with Inline editor.

4. Adjust colour for Unchecked and checked option with the colour picker
in the Inline editor.

5. Fill out a Radio name at the top of the Design panel. The name is internal and will name the Row or Column in the Structure panel to the left.


Style, alignment and margins

Style

In the Style section to the right, adjust space between radio buttons. Set colour for border and fill with colour picker. Click the X icon next to the icon to make it transparent.

Margins (padding) - max 100 pixels.

Alignment - align the element to the left, center or right.

Clone - to copy Element, select Element in the Canvas and click Clone.


Activate Other option to create an additional input field for a custom choice for visitors. If a visitor doesn't find any of the options suitable, they can pick this option and fill in their custom answer as text.

Activate Required field if the field is mandatory. If toggled on, visitors will not be able to submit your form without filling out this field.

💡 Tip! The design options work interactively. To change style and margin measurements, hold on to the icon and drag left and right to increase and decrease number of pixels. The sizes will change accordingly in the Canvas!


Mapping

Open the Mapping section on the right. This is where you set the values that will be stored on the Profile that fill out the Form.

1. In the Data type dropdown menu, select how to store the responses. Select Attribute to save the visitors' answers as value for their Profile Attributes.

Select Form response only if you would like to collect the answers as Event data.

2. Add Option values in the Mapping section. Fill out the values under Option 1, Option 2, Option 3 etc. When a visitor picks an option, the value you enter here will be added to their Profile as a value for the Attribute (or as Profile Event data, if saved as Form response only).


Results: Populated Profile

Let's have a look at the result.

This is how the responses are stored in Audience when mapped as Attribute versus as Form response only.

Stored as Attribute

Here, the Radio element is mapped to a Gender Attribute.

The image below shows the Profile view of a Profile who have submitted the Form, with a new value for Gender Attribute.

Stored as Form response only

If the Radio element instead is mapped to "Form response only", the value (Gender) is saved as Event data. This data is found in Profile view under "Form & Page Interactions". Click the Submit activity in the timeline.


Next Step

Did this answer your question?