Image Hotspots

How to Configure & Style Image Hotspots #

Content #

Image: Select an image from the MEdia library or upload a new one.

Image Hotspots 1

You can use the drop-down menu to specify an image size or opt to a custom size.

Image Hotspots 2

Hotspots: Each Hotspot that you add over the image will be presented as a separate card in the Hotspots section.

Image Hotspots 3

  • Content: From here select the type of content you want to use. You can use icon, text or keep the field blank.

Image Hotspots 4

  • Position: You need to use two separate bars to pick a position for the hotspot marker.

Image Hotspots 5

  • Tooltip: Tooltip is the dialogue box that will appear once visitors hover their mouse over it. Use the drop-down menu to select a position for the Tooltip. you also have a mini Editor at the bottom part of the card.Image Hotspots 6

Tooltip Settings: You can set the Tooltip’s size and its animation from here.

Image Hotspots 7

Style #

Image: Set the width of the image.

Image Hotspots 8

Hotspot: From here you can adjust the border, background color padding for the Hotspots. Click on the little pencil icon at the bottom to open the Box Shadow pop-up.

Image Hotspots 9

Tooltip: Adjust the text and background color. Click on the pencil icon at the bottom to open the Typography pop-up.

Image Hotspots

Watch Video Tutorial #

Click to See Live Demo!

Powered by BetterDocs

🔔600K+ People Using Essential Addons To Build Online Presence. To Fight Coronavirus, Stay Safe 🏠 & Get 25% OFF with Coupon Code:

Win With Elementor!

It’s easy: all we need is your eternal love. But we’ll settle for your email.