Adding Images to Your Forms

Did you know that you can add images to your forms with Gravity Forms?

In this video tutorial, we’ll show you how to easily add images to your forms using the Gravity Forms HTML field.

To get started, open your WordPress dashboard and select ‘Media’.

Then, select ‘Add New Media File’ to upload the image you’d like to use with your form.

Next, select the image you just uploaded and copy the File URL.

Save this URL, we will use it in just a minute.

Now, open the form editor for the form to which you’d like to add an image.

Add the HTML field wherever you’d like the image to appear, then open the Field Settings.

To add an image, we’ll need to use the HTML image tag with source and alt-text attributes.

You can find a customizable code template on our docs site, linked in the video summary.

Copy the code template and paste it into the ‘Content’ section within the HTML field settings.

Next, replace the image URL with the one you copied moments ago.

Be sure to paste the URL in between the quotation marks.

You’ll then want to edit the alt-text to a description of the image you uploaded.

Screen readers have the ability to read out alt-text, making this attribute important for user accessibility.

Be sure to place your alt-text description between the quotation marks.

Once you’re done, save your form and embed it on a page or post.

And that’s all there is to it.

Your image will now be embedded within your form thanks to the HTML field.

For more guides and tutorials on all things Gravity Forms, be sure to check out our video library.

From everyone on the Gravity team, thank you for watching!