Browse categories

Form Editor

Exact matches only
Search in title
Search in content
Search in posts
Search in pages

Can I use images as options in a radio buttons list?

Yes, you can use images as single or multiple choices to make your form look more dynamic. Create a regular single choice or multiple choice list. Now, instead of typing text in the Available Choices box, paste the images URLs, one on every 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 123FormBuilder logo. Make sure to have the hosted link of the image SSL secured (https).

images as radio buttons

SIGN UP FOR FREE

6 comments

  1. 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

  2. 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

  3. 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