COS-Blog

How can I change the size of the featured image in my HubSpot blog?

Last updated: May 31, 2018

Requires any of:

Marketing Hub: Basic, Pro, Enterprise

The size of your blog's featured images is set universally and cannot be changed by default. However, if you are comfortable working with CSS, you can set the size of your featured images within the stylesheet for your blog.

Please note: if you are not familiar with CSS, please work with a website designer to make this change. You can find design partners here

  • First, ensure that the featured image setting is enabled by following the instructions here.
  • In your HubSpot Marketing Hub Basic, Professional, or Enterprise account, navigate to Marketing > Files and Templates > Design Tools.
  • Click the name of the stylesheet used in your blog. You can see where stylesheets can be applied at the template and domain levels here. Blog-specific stylesheets may also be applied. 
  • Add the following code to the stylesheet attached to your blog, replacing WIDTHPERCENTAGE with the desired width percentage. It's recommended, for organizational purposes, that you add this to the section of your stylesheet where other blog-specific styles appear. The image width is a percentage of the post's width and the height is set to be auto to the width.
.hs-featured-image {
width: WIDTHPERCENTAGE%;
}
  • If the above code does not have the desired result, try replacing .hs-featured-image with .hs-featured-image-wrapper.

Was this article helpful?