Meetings

Embed the meeting widget on a page

Last updated: May 7, 2019

Applies to:

Sales Hub  Starter, Professional

Embed the meetings widget in one of your pages to allow visitors to book time with you while they're on your site.


Embed the meetings widget on a HubSpot page

To embed the meetings widget on a HubSpot page, install the Meetings module created by HubSpot and add this module in your page templates. Then, customize the meeting link for the widget on the page.

Install the Meetings module

  • In your HubSpot account, navigate to Marketing > Files and Templates > Template Marketplace.
  • In the upper right, search for Meetings. You'll see a listing for the Meetings module.
  • Hover over the listing for Meetings module, then click View details.
  • In the upper right, click Get module for free to install the Meetings module in your HubSpot account.

Add the Meetings module in a template

  • In your HubSpot account, navigate to Marketing > Files and Templates > Design Tools.
  • In the finder, click the name of the template.
  • In the template inspector, click + Add.

  • Search for the Meetings module, then drag and drop it into the desired area in the template.

  • In the upper right, click Publish to add the meetings widget onto all HubSpot pages using this template.

Customize the meetings link on a page

  • In your HubSpot account, navigate to your landing pages or website pages.
  • Hover over the page with the meetings widget and click Edit.
  • In the page editor, click the Meetings module.
  • In the left panel, click the Meetings links dropdown menu and select the meeting link for the widget, then click Apply.
  • In the upper right, click Publish or Update to take your changes live.

Embed the meetings widget on an external page

  • In your HubSpot account, navigate to Sales > Meetings.
  • Hover over the meeting and click Embed.

  • Click Copy code.

  • Paste this embed code into the code of your external pages to display the meetings widget to visitors.

The widget will appear on your page where the code is embedded.

Style the meetings widget

You can make changes to the color of the widget and the logo that appears on the widget when it's embedded on your site.

Please note: these settings apply to all users in your account for all sales features except the conversations tool

  • In your HubSpot account, click the settings icon settings in the main navigation bar.
  • In the left sidebar menu, select Account Defaults.
  • Click the Branding tab, then navigate the tabs to edit the widget's logo and color.
    • Click the Logo tab, then click Upload to add a new logo image, or select Browse images to choose a logo from your file manager.
    • Click the Color tab, then select a primary color. You can also select a custom color by clicking the color to the right of the hexadecimal value field, then using the color gradient to select a custom color or manually enter a hexadecimal value. You can do the same for the secondary color and any accent colors if needed.branding-tab-pick-colors
  • Click Save.