Back to Community
Home / Community / Plugin → Ninja forms – the contact form builder that grows with you

How to Add and Customize Images in Your Ninja Forms

16 threads Sep 16, 2025 Plugin → Ninja forms – the contact form builder that grows with you

Content

Images can significantly enhance your forms, making them more engaging and intuitive for users. Whether you want to use images as selectable options or simply add visual flair, Ninja Forms provides several methods to achieve this. This guide covers the most common ways to work with images in your forms, from basic implementation to troubleshooting display issues.

Using the Select Image Field

The most straightforward way to incorporate images into your form is by using the built-in Select Image field. This field allows you to present users with a set of images as choices, similar to radio buttons or a dropdown. Users can click on an image to make their selection, which is then captured in the form submission.

Enabling Image Popups for Enlargement

A common user request is to make the thumbnail images in a Select Image field clickable to enlarge them. While Ninja Forms itself does not have a built-in feature for this specific type of popup, it can be accomplished by integrating with a third-party popup plugin. Plugins like Popup Maker are popular choices for creating such lightbox effects without needing to write custom code.

Troubleshooting a Multiple Selection Display Issue

Some users have reported a specific display issue when the Multiple Selections option is enabled on a Select Image field. While the submitted data is correctly recorded in emails and the submission management area, the preview popup that appears after submission may not properly display the selected images. This popup is built with JavaScript, and the display logic may not update correctly for multiple image selections in the free version. The 'Ninja Forms – The Contact Form Builder That Grows With You' team is likely aware of this inconsistency.

Renaming Uploaded Image Files

If you are using a File Upload field and want to control the name of the image saved on your server, you can configure a custom naming convention. This is typically done using merge tags within the File Uploads add-on's settings to create a unique filename based on form data, such as the submission ID or a field value from the user.

Key Takeaways

  • Use the Select Image field for creating image-based choices.
  • For image enlargement popups, a third-party plugin is recommended.
  • A known display glitch may occur in the submission preview popup when multiple image selections are enabled.
  • File Upload fields can be configured to rename images using merge tags.

By understanding these features and their limitations, you can effectively use images to create more dynamic and user-friendly forms on your WordPress site.

Related Support Threads Support