Adjusting Hubspot Template Columns
Let's say I wanted adjust the width of the sidebar in the 3 column layout like the example below.If you open the page in the "quick preview" mode, you'll be able to see it rendered without the module code. Hubspot renders the columns with the prefix naming convention of "foxboro_". Right click the quick preview window and inspect element. The green code is code that hubspot generates for you.
If you want to target the side bar, that would be the first column. Hubspot gives it an ID of "foxboro_col1".
#foxboro_three-column #foxboro_col1 {
width: 18.9%;
}If you want the new sidebar width to be a global change, you'll have to paste it in your custom.css file which can be found and edited using the file manager.
For just this page: click page properties> advanced options> HTML Head Tag Text
Create a <style> tag and paste your code within it.
Click Save and you should see your change reflected on the page now.
All done!

























