Customize module styles in the content editor
Last updated: January 18, 2023
Applies to:
All products and plans |
In the content editor, you can edit module styling options, such as margins and padding, on the Styles tab of the sidebar editor. Available style options for custom modules and themes are set by the developer who created the module. Learn more about module and theme style options in our developer documentation.
If you're using a starter template, a theme template, or a coded template with a drag and drop area, you can also apply background styles to rows, columns, or sections of your page.
Please note: older modules may contain deprecated styles, which are no longer available on new modules and templates. Deprecated styles can still be edited on the Styles tab, but will be removed from the module if cleared.
Customize styles for a default or custom module
You can customize styling options such as alignment, spacing, and colors on the Styles tab. The available style options for custom modules are set by your developer in the design manager. Learn more about style options for custom modules in our developer documentation.
-
Navigate to your content:
- Website Pages: In your HubSpot account, navigate to Marketing > Website > Website Pages.
- Landing Pages: In your HubSpot account, navigate to Marketing > Landing Pages.
- Hover over your content and click Edit.
- In the content editor, click a module to edit it.
- In the sidebar editor, click the Styles tab.
- To adjust the module's spacing, select Padding or Margin, then enter pixel values in the fields. Select the Apply to all sides checkbox to apply the same margins or padding to all sides of the module.
- Customize the borders, fonts, or colors available for your module.
Customize style options from a starter or theme template
If you're using a starter template or theme template, some style options may appear on the Content tab of the sidebar editor.
-
Navigate to your content:
- Website Pages: In your HubSpot account, navigate to Marketing > Website > Website Pages.
- Landing Pages: In your HubSpot account, navigate to Marketing > Landing Pages.
- Hover over your content and click Edit.
- In the content editor, click a module to edit it.
- In the sidebar editor, click the Content tab.
- Click to toggle the Override default style switch on.
- In the Style options section, customize the additional styling options included in your starter or theme template.
Related content
-
Customize the Read More button on your blog
Changing the look of your Read More button on the blog listing page can be useful if you want this button to stand out.
Community -
Export your content and data
Learn how to export HubSpot content and data from your account, such as pages, contacts, and files. Please...
Knowledge Base -
Require member registration to access private content
Users with publish permissions can control which contacts can access specific HubSpot-hosted pages, blogs and...
Knowledge Base