TL;DR: Image Choices transforms boring radio buttons and checkboxes into visually engaging image selections. It’s one of the most popular free add-ons from JetSloth and is essential for any form where visual selection improves user experience.
What Does Image Choices Do?
Image Choices replaces standard radio buttons and checkboxes with clickable images. Instead of text options, users see and select visual representations. It’s perfect for product configurators, design selection forms, mood boards, and any scenario where “show, don’t tell” applies.
Key Features
Visual Selection
Upload images for each option in radio button or checkbox fields. Users click to select, just like they would with text options—but with immediate visual confirmation of their choice.
Flexible Image Sizing
Configure image dimensions to fit your layout. Square thumbnails, landscape banners, or custom sizes—Image Choices adapts to your design needs through simple CSS classes.
Selection States
Customize how selected images appear. Add borders, overlays, opacity changes, or checkmark indicators. Make it clear which options are selected at a glance.
Text Labels
Show text labels alongside images, below them, or hide them entirely. Mix visual and text information based on your form’s needs.
Responsive Layouts
Images arrange themselves in responsive grids. Control columns per row for desktop, tablet, and mobile to ensure your forms look great on all devices.
Real-World Use Cases
1. Product Configurators
Build a “Design Your Own” t-shirt form where users select from image swatches of colors, patterns, and styles. Visual selection reduces errors and returns compared to text-based options.
2. Room Design Forms
Interior design consultations where clients select furniture styles, paint colors, and flooring options from image galleries. “Modern,” “Traditional,” and “Industrial” are abstract—showing them is clearer.
3. Event Theme Selection
Wedding planners, party venues, and event coordinators can let clients choose themes, decor packages, and color schemes from visual mood boards rather than description text.
4. Service Package Selection
Photography packages, website design tiers, or consulting services—show representative images of what each package includes. Visual hierarchy helps users understand value differences.
5. Character/Persona Selection
Games, personality quizzes, or team-building exercises where users select avatars, characters, or personas. Images make the experience more engaging and memorable.
Pros and Cons
| Pros | Cons |
|---|---|
| Free plugin (GPL licensed) | Requires careful image optimization (page load impact) |
| Works with all Gravity Forms field types (radio/checkbox) | No built-in image library management |
| Customizable selection states (CSS) | Accessibility requires alt text attention |
| Responsive grid layouts | Limited built-in styling options (relies on CSS) |
| Lightweight and well-maintained | No conditional logic integration (separate plugin) |
| Active support and regular updates |
Pricing
Image Choices is FREE and available from the WordPress.org plugin repository.
JetSloth also offers premium add-ons:
| Plugin | Price | Purpose |
|---|---|---|
| Image Choices | FREE | Visual radio/checkbox selection |
| Bulk Actions | $29/year | Bulk edit/delete Gravity Forms entries |
| Collapsible Sections | $29/year | Accordion sections in forms |
| All Access Bundle | $69/year | All 8 premium JetSloth plugins |
The free Image Choices plugin is fully functional. Premium add-ons extend functionality but aren’t required for core image selection features.
Technical Implementation Notes
- Image Optimization: Use appropriately sized images (200-400px wide). Don’t upload 2000px+ images and scale down—this kills page load times
- Alt Text: Always add descriptive alt text for accessibility and SEO
- Lazy Loading: Enable native lazy loading for images below the fold
- CDN: Serve images from a CDN for faster global loading
- Custom CSS: JetSloth provides CSS hooks for custom styling—use .gfield_image_choices classes
Integration with Other JetSloth Plugins
Image Choices works well with:
- Collapsible Sections: Group image selections in accordion sections for cleaner long forms
- Bulk Actions: Manage entries from image-based forms more efficiently
Accessibility Considerations
Visual forms can exclude screen reader users if not implemented carefully:
- Always include descriptive alt text for every image
- Don’t hide text labels unless the image is purely decorative
- Ensure sufficient color contrast for selection states
- Test with keyboard navigation (Tab to focus, Enter/Space to select)
When to Use Image Choices vs Standard Fields
Use Image Choices when:
- Visual distinction matters (colors, styles, designs)
- Users need to see what they’re selecting
- The form is part of a visual/branded experience
- Options are concrete (products, locations, people)
Stick with standard fields when:
- Options are abstract (satisfaction ratings, preferences)
- Space is limited (mobile-first designs)
- Screen reader accessibility is critical
- Images would slow page load significantly
Bottom Line
Image Choices is one of those “why isn’t this in core?” plugins. It transforms mundane form fields into engaging visual experiences that reduce user errors and improve completion rates. And it’s free.
For e-commerce configurators, design consultations, event planning, or any form where visual selection helps users understand their options, Image Choices is essential. The price (free) makes it an obvious choice; the quality makes it a staple.
Get it: JetSloth Image Choices
Comments