Skip to main content
To embed a responsive video on a HubSpot blog post, copy the embed code from Sendspark’s share modal, paste it into an embed field in your blog, then open the blog editor’s advanced source code, remove the wrapping <div></div> around the iframe, manually set the iframe’s height and width to your video’s ratio, and remove the position, left, and top attributes. Setting 100% width will not work.

​
Key takeaways

  • HubSpot automatically forces embedded videos to a 16x9 ratio, which can cause an unwanted crop or scroll effect, so you must set the video dimensions manually.
  • 100% width will not work; enter the actual height and width in the iframe using your video’s ratio (9x16 for vertical, 4x3 for MacBook recordings, 16x9 for standard).
  • In the blog editor, use advanced then source code to remove the wrapping <div></div> and the position, left, and top attributes from the iframe.
When you embed a video on Hubspot, it automatically forces the video to a 16x9 ratio. This can cause an unfortunate crop or scroll effect on your video. To embed a responsive video on your Hubspot blog, you have to manually set the video height and width yourself. 100% width will not work!

​
Here’s how to make your video display correctly on Hubspot

  1. Copy the video embed code from the share modal Copy Code Snippet
Embed tab on share modal
  1. Paste the code into an embed field in your blog.
Hubspot Embed option
  1. If you preview now, you’ll notice that your video is forced to a 16x9 ratio, no matter what the actual video size is. Not pretty! 😬
  2. Go back to your blog editor, and click advanced and then click source code.
Advanced Hubspot
  1. Remove the**<div></div**> around your video iframe
  2. Manually set the height and width of your video within the iframe to the correct size of your video. Here are some common ratios for video: vertical videos: 9x16, videos recorded from macbooks: 4x3, “normal” videos: 16x9.
  3. Remove the position, left, and top attributes. Your code should look something like this:
  1. That’s it! Your responsive video should be displaying beautifully on your blog. 👏

​
Frequently asked questions

HubSpot automatically forces embedded videos to a 16x9 ratio no matter the actual video size, which can cause an unfortunate crop or scroll effect. To fix it, manually set the video’s height and width in the iframe source code.
No. 100% width will not work for embedding a responsive video on a HubSpot blog. You have to manually set the video height and width yourself.
Set the iframe dimensions to match your video’s ratio. Common ratios are 9x16 for vertical videos, 4x3 for videos recorded from MacBooks, and 16x9 for “normal” videos.
In your blog editor, click advanced and then source code. From there, remove the wrapping <div></div> around your video iframe and remove the position, left, and top attributes.

​
Additional resources

As a Hubspot user, you might appreciate these additional resources:
  1. How to send hyper-personalized videos in Hubspot Marketing Hub emails
  2. How to send hyper-personalized videos in Hubspot Sales Hub emails
  3. How to connect the Hubspot CRM
Updated July 2026.