Skip to content
English
  • There are no suggestions because the search field is empty.

Click to Dial HubSpot CMS Module

Setup & Configuration Guide

Overview

The Click to Dial module adds a floating call button to your HubSpot pages. Visitors see an agent card with photo, name, and availability status — then tap to call directly from their phone or click to initiate a call on desktop.

Best for: Sales pages, contact pages, support centres, local business sites, and any page where you want to make it effortless for visitors to call.

Getting Started

  1. Open any page in the HubSpot editor.
  2. Search for Click to Dial in the module panel.
  3. Drag it onto your page.
  4. Enter a phone number and customise the agent card.

Field Reference

Use the tables below to configure each section of the Click to Dial module.

Agent Setup

Field What it does
Agent Name Display name shown on the call card. Default: "Sales Team"
Agent Designation Job title or role shown below the name. Default: "Sales Representative"
Agent Photo Upload a headshot from the File Manager. Shows a placeholder if empty.
Phone Number The phone number visitors will call. Include country code (e.g. +1234567890). Required.
Is Available Toggle the agent's online/offline status. When OFF, shows the offline message.

Content

Field What it does
Greeting Message The message shown when the popup opens.
Call Button Text The CTA button label. Default: "Call Now"
Offline Text Message shown when the agent is marked offline.
Bubble Text Short text shown next to the floating bubble. Default: "Call Us"

Layout & Display

Field What it does
Bubble Style Shape of the floating button. Options include Circle, Square, and Rounded Square.
Popup Animation How the agent card appears when the bubble is clicked. Options include Slide Up, Fade In, and None.
Position Left or Right side of the screen.
Show on Mobile Toggle mobile visibility. Default: ON.
Theme Light or Dark appearance.

HubSpot Integration

Field What it does
Enable Calling SDK Enables HubSpot's native Calling SDK so that every call is logged automatically in the CRM. Requires a Sales Hub subscription (Starter or above).
Call Source Label The label attached to calls in HubSpot CRM. Default: "Click-to-Dial Widget"
Enable Tracking Event Fire a HubSpot tracking event when a call is initiated. Default: ON.

How It Works

  1. A floating bubble appears in the bottom corner of the page.
  2. Clicking the bubble opens the agent card with photo, name, status, and greeting.
  3. Clicking "Call Now" triggers a tel: link — on mobile this opens the dialer, on desktop it opens the default calling app.
  4. If HubSpot tracking is enabled, a custom event is logged for conversion attribution.

Tips

  • Phone format: Always include the country code with + prefix (e.g. +44 for UK, +1 for US).
  • Availability: Manually toggle "Is Available" to show/hide the offline message. For automatic scheduling, upgrade to Pro.
  • Tracking: Enable tracking events and create a HubSpot workflow triggered by the "Click-to-Dial Widget" event for automated follow-up.

Upgrading to Pro

The free Click to Dial module supports a single agent and manual availability toggling. Upgrade to Click to Dial Pro to unlock:

  • Multiple agents
  • Automatic availability scheduling
  • Callback request forms
  • Agent search and directory views
  • Advanced animations

See the Click to Dial Pro module documentation for setup instructions.


Need help with your HubSpot CMS? If you're building, rebuilding or improving a HubSpot website, see how ARISE GTM approaches HubSpot CMS builds and migrations.