Appearance

Hubspot ​

Follow these steps to integrate your Videobot widget with your HubSpot website.

Step 1: Log in to HubSpot 🛠️ ​

  1. Open your web browser and navigate to HubSpot.com.
  2. Click on the Sign In button at the top-right corner and log in to your account.

Step 2: Navigate to the HubSpot Website Editor ​

  1. After logging in, navigate to the content management system to see a list of your web pages.
  2. Click Edit on the webpage where you want to add the custom code. This will take you to the HubSpot Site Editor.

Step 3: Choose Advanced Settings ​

  1. In the HubSpot Site Editor, click on the Settings button in the right upper corner.
  2. In the window that appears, choose the Advanced option.

Step 4: Copy the Embed Code from Videobot ​

  1. In a separate browser tab, log in to your Videobot Dashboard.
  2. Select the Videobot you want to embed.
  3. Navigate to Share & Embed, then choose either Widget or iFrame.
  4. Click Publish, then Show Embed Code.
  5. Copy the generated HTML code.

Copy code

Step 5: Add the HTML Code to Your Page Settings ​

  1. In the Advanced Settings section (Step 3), you will see two boxes: one for Head HTML and one for Footer HTML.
  2. To embed your Videobot, paste the Videobot HTML code (from Step 4) into the Footer HTML.
  3. After adding the HTML code, close the settings window and preview your changes.

Step 6: Success! Adjust to Your Liking 🎉 ​

  1. Click the Save button in the HubSpot Site Editor to save your changes.
  2. Preview to see your Videobot and make adjustments if necessary.
    • You might need to adjust the size of the element in the editor if the Videobot appears cropped or too small.
  3. After adjusting everything to your liking, click Publish to make your changes live.

Success

That's it! You've successfully embedded Videobot on your HubSpot site. 🎉