Discover the Image Hotspots Widget and its features here.
The Image Hotspots Widget allows you to overlay interactive hotspots on an image. This is perfect for product displays, maps, or any visual element requiring additional context. Users can click or hover over these hotspots to reveal more information or access links.
Activate the Widget
To enable the Image Hotspots Widget:
- Go to the aThemes Addons dashboard in your WordPress admin area.
- Find the Image Hotspots Widget.
- Toggle it on to make it available in Elementor.
Widget Options
Content Section
- Choose Image: Upload or select an image to serve as the hotspot background.
- Hotspot Elements: Add multiple interactive hotspots with customizable icons, labels, and tooltips.
- Hotspot Positioning: Define the X and Y position of each hotspot on the image.
- Hotspot Content: Add descriptions, HTML, or links to be displayed in tooltips or popups.
- Hotspot Animation: Choose from animations like pulse, glow, or bounce to make hotspots visually engaging.
- Tooltip Display: Configure when tooltips appear (hover, always visible, or click).
- Tooltip Position: Set the position (top, bottom, left, right) relative to the hotspot.
Style Options
- Image: Adjust the image’s size, alignment, and border radius.
- Hotspot Icon: Customize icon size, color, background, and border styling.
- Hotspot Animation: Control animations to draw user attention to hotspots.
- Tooltip: Configure typography, padding, background, and alignment for tooltips.
Usage Tips
- Enhance Product Displays: Use hotspots to highlight product features or specs.
- Interactive Maps: Create engaging maps with clickable or hoverable regions.
- Optimize Images: Ensure images are optimized for fast loading without losing quality.
- Balance Hotspot Density: Avoid overcrowding hotspots to maintain clarity.
- Maintain Consistent Styles: Align tooltips and icons with your site’s design language.
Conclusion
The Image Hotspots Widget is a versatile tool for creating interactive visual content. Whether for product presentations, educational diagrams, or detailed maps, this widget ensures an engaging user experience.