1. Home
  2. Docs
  3. Creative Elements
  4. Image Hotspots

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 10

Image Hotspots 11

Click to See Live Demo!

Tags ,

How can we help?