Form Editor

Generic selectors
Exact matches only
Search in title
Search in content

Can I use images as options in a single choice field?

Yes, you can use images as single or multiple choices to make your form look more dynamic. Add a Single or Multiple choice field to your online form. Now, instead of typing text in the Choices box, paste the image URLs, one on each line. The images will show up in your main view.

Have a look at how we’ve built this form below with images as radio buttons, using our 123 Form Builder logo. Make sure to have the hosted link of the image SSL secured (https).

It’s also important to mention that the links must end in the image’s extension (e.g. img/png).

Images as choices

Related articles

SIGN UP FOR FREE

9 comments

  1. I’m trying to build a simple ecard that will be sent after a donation is made. I have the ecard designs as radio button options, but it won’t display the image in the notification email (the ecard email), only the link to the image. How do I get the selected image to display?

    Reply

    1. Hi Julie! When you use images as choices, the selected images cannot be forwarded via email. However, a solution would be to create custom emails where you can attach each image. Then, you can create rules to send the emails based on the choice/image selected. Here you can find more details about this feature https://www.123formbuilder.com/docs/what-are-custom-recipients-and-how-to-use-them. Please feel free to contact us at customercare@123formbuilder.com and we will gladly help you set up your form!

      Reply

  2. I am afraid that the radio button can only be moved if you apply a custom CSS to change its position. In our themes section you are able to apply your CSS codes.

    Reply

  3. Do you have an example of the suggested workaround using Heading fields?
    How would I group the mix of Headings and Choices to ensure the user can only select one of the options?
    Since there is no text associated to the image, how do I get a value out that can be submitted with the order?

    Reply

    1. I am afraid that you can not combine them, since there are two separate field types. What you can do is to resize the heading fields on top of each choice image.
      To get the value, or to identify the image selected, what you can do is to rename your image before uploading it. For example: apple.jpg and use a hosting image service like https://postimages.org/ which will keep the file’s name in the URL.

      Reply

  4. Is there any way to enter the name of a radio button image under it? For instance if I have a radio button image of fried chicken, baked salmon, and vegetarian lasagna; is there a way that I can have each of those image names typed under them?

    Reply

    1. Hello Lenora,
      If you choose to upload an image for a single/multiple choice field, in order for the URL to show the image you are not allowed to insert any other information in that field. By doing so, instead on the image, it will show the URL link itself.
      As a workaround, you can insert Heading fields above or under each choice so the customers know what each image represents. If you have more questions do not hesitate to contact our Support Team at support@123formbuilder.com.

      Reply

  5. Does it matter where the image URL is hosted, ion regards to using images as options for radio buttons? I have tried copying the link from Google but the image is not appearing?

    Reply

    1. Hello Sara!

      Here’s an example of an image URL from Google: http://dflzqrzibliy5.cloudfront.net/images3/new2/create-web-forms.jpg.

      Right-click on the image on Google when opened and use the option that copies the URL or image address. For Google Chrome, for example, the option is named Copy image URL. Afterwards, go to the form editor and paste the URL within the available choices box in the edit field panel of the Radio buttons field.

      For further assistance, don’t hesitate to contact our Support Team at support@123formbuilder.com or via our contact form.

      Thanks!

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

Frequently Asked Questions

Here is a list of the most frequently asked questions. For more FAQs, please browse through the FAQs page.

Is this service free?
Yes, we offer a free form builder service. Just sign up to the Basic plan and you are all set. This plan is forever free, but you are limited with a few features only, such as 5 forms per account, 100 submissions per month and you have to keep the backlink to 123FormBuilder on your forms. Check out our features matrix for more information.
How many forms can I create?
It depends on the service plan you are on. Higher service plans enable more features, including more web forms for your account. If you need more forms, go to the My Account section of your account and click the upgrade button. To create an unlimited number of forms, either upgrade to the Platinum service plan or higher. Consult our features matrix for more information.
How can I publish my forms?
You can publish your forms in many ways, by using their direct URL or HTML link, embedding them with a JavaScript code, Inline HTML or iFrame, using the Facebook app or the WordPress plugin, using popups, the Blogger code snippet and many more. Once you have created and customized your form, go to the Publish section to complete your work. Read more in our documentation.
How do I change my form design?
You can change the design of your form in the Themes section, which is located in your form settings. We offer a set of more than 30 predefined form themes for your forms, but you can also create your own from scratch. You can customize the submit button, the logo and more. To apply your own stylesheets, all forms come with a custom CSS editor.

Can't find what you're looking for?

Contact our support team