Image Hotspots

How to Configure & Style Image Hotspots #

Content #

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

Image Hotspots 19

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

Image Hotspots 20

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

Image Hotspots 21

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

Image Hotspots 22

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

Image Hotspots 23

  • 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 24

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

Image Hotspots 25

Style #

Image: Set the width of the image.

Image Hotspots 26

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 27

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

Win With Elementor!

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