How to show an image based on an option selected from a Single Choice or Multiple Choice element

Hi there,

I can't seem to find the widget that allows me to insert an image into a question.

I'm not looking for the user to pick between images.

I just want to add an image into a Single-Choice or Multi-choice question ; the single image could help the user decide what option to select.

Hi The_Village_Leagues,

Thanks for reaching out to us for help. Unfortunately, it's not possible to add images to the Single Choice or Multiple Choice elements. But, you can use the Image Radio Buttons widget to add images to the radio buttons, with the questions below it. It's really easy to do. Let me show you how:

1. In Form Builder, click on Add Element at the top-left of your screen.
2. Now, in the Widgets tab of the panel on the left, navigate to the Image Radio Buttons widget and drag and drop it into your form.
3. Next, in the General tab of the panel on the right, navigate to the Image URLs section and post the image URLs. Remember that each image should be on a new line.
4. Now, in the Image Labels section, add your questions as the labels.
5. Finally, in the Image Size(s) field, change the sizes of the images and then click on Update. You need to comma-separate each image.

If you only want to show an image based on options selected, I suggest that you add an Image element for each of the options and then use Show/Hide Field conditions to show the image when the option is selected. Let me show you how to do that:

1. In Form Builder, click on Add Element at the top-left of your screen.
2. Now, in the Basic tab of the panel on the left, navigate to the Image element and drag and drop it into your form.
3. In the General tab of the panel on the right, navigate to Image and upload your image. You can also select from your images or enter a URL.

Now all that's left is setting up Show/Hide Field conditions to show the image when an option is selected. Let me show you how to do it:

1. Still in Form Builder, click on Settings in the orange navigation bar at the top of your screen.
2. In the Conditions tab of the panel on the left, click on Show/Hide Field.
3. Finally, set the condition like you see below and then click on Save at the bottom of your screen.

That's it. Remember that you need to set a new condition for each option. Check out the screencast below to see my results:

Give it a try and let us know if you have any more questions.