What is a child theme?

A child theme inherits the assets and files from the parent theme, it only includes a few files to create the dependency and allows for customization while still retaining updates

A theme purchased from the marketplace can't be edited directly.

Using a child theme allows you to continue to receive updates when the theme is updated in the HubSpot Marketplace and also provides the flexibility to customize the theme as needed.

There are only a few files included in a child theme:

  • templates folder with layouts sub-folder and base.html file
  • child.css
  • child.js
  • theme.json

The base.html provides the necessary information to associate the child settings with those of the theme in the parent, this should only be modified if instructions are provided as part of the release of a theme update (very rare) or by a developer familiar with developing themes for CMS Hub.

The child.css provides the option to add custom CSS to the theme, for example, if custom fonts need to be configured for your brand.

The child.js provides the option to add custom JS to the theme.

The theme.json file is what connects the child theme to the parent and shouldn't be modified.

Customizing a Child Theme

Many customizations can be made to the theme without creating a custom module, including connecting a module to hubDB.

If you need to customize the functionality of a module, create a global module, or create a custom template, those files would be added to the child theme.

Any file in the child theme that has the exact name of a file in the parent will overwrite the parent.

If an existing module or template is used as a starting point for customization using the Clone to child functionality, we recommend immediately renaming the module to create a unique version rather than overwriting the theme's version for the most flexibility in the future.

Updating a Child Theme

A child theme will inherit updates automatically when the marketplace theme is updated.

Any files in the child theme with the same name as a file in the parent, will not be modified by the update and will continue to overwrite the parent version.