Skip to content
Marketplace Assests

Interactive Image Hotspots Documention

1. Introduction (Overview)

Interactive Image Hotspots module lets you add clickable hotspot dots with tooltips directly on images. Fully responsive and customizable for desktop, tablet, and mobile.

2. Key Features

  • Image-Based Hotspots – Add interactive dots directly on images
  • Multiple Hotspot Support – Place several hotspots on a single image
  • Click-to-Open Tooltips – Display detailed information on user interaction
  • Fully Responsive – Seamlessly adapts across desktop, tablet, and mobile devices
  • Responsive Tooltip Positioning – Adjust tooltip alignment for desktop, tablet, and mobile
  • Flexible Dot Position Control – Easily manage hotspot placement using percentage values
  • Adjustable Tooltip Width – Control tooltip minimum and maximum width for better readability
  • Fully Customizable – Customize tooltip styles, spacing, colors, and layout
  • Mobile-Friendly Behavior – Hotspots remain stable and usable on smaller screens

3. Installation – Downloading the Module from HubSpot Marketplace

  • Log in to your HubSpot account.
  • Go to the Marketplace from the main navigation menu.
  • Search for your module by name.
  • Find the module in the results and click Install.
  • If it’s a paid module, you can also click Buy Now to purchase and install directly.

4. How to Use – Adding the Module to Your Page

  • Open your HubSpot page editor.
  • Click on Add Module.
  • Search for your module by name.
  • Drag and drop the module into the desired section of your page.

  • Interactive Image Hotspots lets you add clickable dots with tooltips on images. Fully responsive and customizable for desktop, tablet, and mobile.

5. Module Settings Guide

1. Content Tab 

  • Image-Based Hotspots – Add interactive dots directly on images
  • Multiple Hotspot Support – Place several hotspots on a single image
  • Responsive Tooltip Positioning – Adjust tooltip alignment for desktop, tablet, and mobile
  • Flexible Dot Position Control – Easily manage hotspot placement using percentage values

Group 1000002176 (1)

2. Style Tab

  • Module Width Control – Choose full-width or custom container
  • Fully Customizable - Adjust colors, typography, shadows, and spacing.
  • Heading & Description – Fully customizable text, including font color, font size, line height, and separate settings for mobile and tablet.
  • Spacing – Tooltip spacing adjustable for desktop, tablet, and mobile.
  • Dot Color – Customize hotspot dot background color, border color, and shadow color.
  • Dot Size – Set different hotspot dot sizes for desktop, tablet, and mobile.
  • Tooltip Content Box Width – Customize tooltip box width independently for desktop, tablet, and mobile.

Group 1000002177

6. Examples / Demo Preview

View the module in action:https://www.modfrybus.shop/interactive-image-hotspots

7. Support & Contact

For questions or support, contact us at productqueriemodfrybus@outlook.com We’re happy to help!