Skip to content
Landing Pages

Use flexible columns in HubSpot pages

Last updated: March 1, 2022

Applies to:

Marketing Hub Professional, Enterprise
CMS Hub Professional, Enterprise
Legacy Marketing Hub Basic

After you add flexible columns to a page template, you can add or rearrange modules in the content editor within those columns.

Flexible columns are not available on blog, email, or system page templates, . Learn more about editing a blog listing page in the content editor

Add flexible columns to a template

To use flexible columns in the content editor, you need to add them to a page template first. Any modules you add to a flexible column in the design manager will appear in that column in the content editor.

Please note: modules added to flexible columns in the design manager will only appear on newly created pages.  Modules can be added to existing pages from the content editor. 

  • In your HubSpot account, navigate to Marketing > Files and Templates > Design Tools.
  • In the finder, click a template to open it in the layout editor. 
  • In the inspector, click the + Add tab.
  • Enter flexible column in the search bar, then click the Flexible column module and drag it onto the template. 
  • On the + Add tab, click any module you want to add to the flexible column and drag it over the flexible column on the template. 

flex columns split

Edit flexible columns in the content editor

Once you've created a new page with a template that uses flexible columns, you can customize the structure and content of those flexible columns in the content editor.

  • In your HubSpot account, navigate to Marketing > Website > Website Pages.
  • Hover over a page and click Edit
  • To add a module to the flexible column in the content editor, click the module in the sidebar editor and drag it over the flexible column. 

flexible%20columns%20add%20module

Please note: you can only add modules into areas of the page that use flexible columns. 

  • To delete a module in a flexible column, hover over the module and click the delete delete icon.
  • To rearrange the modules in a flexible column:
    • Hover over any module in a flexible column and click the flexColumn flexible column icon.
    • Click the four arrow icon on top of a module and drag it into position within the flexible column. 
    • To finish rearranging modules, click Exit layout mode.

rearrange-modules-in-a-flexible-column

  • In the top right of the content editor, click Publish or Update to take your changes live. 
Was this article helpful? *
This form is used for documentation feedback only. Learn how to get help with HubSpot.