Skip to content
maka-img_mm_marketplace
maka marketplace

Discover Products to help you POWER up with CMS Hub

maka-img_mm_power-pro
Power Pro Theme

Check out the POWER demo and see all the latest features

maka-img_mm_performance
Performance

POWER is optimized to perform, review the results

maka-img_mm_customer-showcase
Customer Showcase

See how our customers used the POWER Theme

POWER Pro V25 released on August 18th 2022 – Read Changelog

maka-img_mm_documentation_3
Getting Started

Follow our guide to save time and avoid missing a step

maka-img_mm_module-library
Module Library

From page speed impact to set up instructions, you'll find it all

maka-img_mm_video-tutorials
Video tutorials

Find all POWER videos in the same spot for quick answers

maka-img_mm_faq
FAQs

Have questions?
We have answers

Experiencing an issue with POWER? Submit a support ticket here

maka-img_mm_about-us
About us

“Would I rather be feared or loved? Easy. Both. I want people to be afraid of how much they love me.”
– Michael Scott, not us

maka-img_mm_blog
Blog

This is mostly a demo right now. We are working on some really cool things around the office.

maka-img_mm_career
Career

Quite possibly the most fun you will have at work, ever. Did we mention how cool we are?

Having issues with POWER?
SUBMIT A SUPPORT TICKET


Schedule a Q&A or Demo
PREPURCHASE CONSULTATION


Looking for Custom Development?
REQUEST A QUOTE


Other questions?
CONTACT US / LIVE CHAT

LIVE Chat 7CT AM – 7CT PM – Get in touch here

Child Theme Setup

How to set up a child theme for your HubSpot website

pwr-icon-getting-started

CHILD THEME

A child theme creates a theme file for marketplace themes that allows you to customize the theme and still receive future updates and bugfixes.

power-child-theme-hubspot-theme-settings

FAQ

What is a child theme?

A child theme inherits the assets and files from the POWER THEME within the marketplace folder.

A child theme allows you to continue to receive updates from the HubSpot Marketplace and also provides the flexibility to customize the theme as needed.

A child theme also allows us to quickly resolve any issues you may encounter due to installing an update. While this is rare, it is just one of the many reasons we recommend using a child theme.

How do I customize the theme?

We're happy to help with minor customizations and CSS changes if you aren't able to find what you're looking for in the theme settings.

If you are a developer or are working with a developer, customizations can be made directly in the child.css or child.js code contained in the child theme.

We only recommend cloning a module to the child theme if you are making changes to the functionality of the module settings, otherwise, these changes can be made in the child code files.

I'm not going to customize anything, do I have to create a child theme?

We highly recommend you set up a child theme of the marketplace POWER THEME before you start configuring and building your site.

This gives you, us, or a third party the ability to change code, extend it with specific requirements, or change styles that are not configurable at this stage, and retains the ability for updates to be applied from the parent theme as they are released. 

Can I still get updates with a child theme? Yes! This is exactly why we ask you to set up a child theme. Doing so ensures you can customize as needed and still accept the updates from the marketplace.
Can't I just clone the theme?

Cloning a theme detaches it from the marketplace and makes a full copy of the theme.

HubSpot has recently removed the ability to clone themes from the marketplace.

Creating a child theme allows you the same customization ability while also retaining the connection to the marketplace for future updates.

How do I set up multiple websites with the same theme?

Each website needs to have its own child theme.

You will be able to configure the brand style for each website in the theme settings and also configure the header and footer for each child theme.

How many child themes can I create?

Once you have purchased the theme, you can setup up to 5 child themes that each have unique branding within the same account.

CMS Hub Enterprise users can setup up to 10 child themes.

My Website was built with a clone, should I switch to a child theme?

If your website was built using a clone of the theme (either before HubSpot allowed child themes or while they still allowed clones to be created), we recommend creating a child theme that matches your clone.

Once you have created the child theme, you could build new pages with the child theme to use new features.

If you want to migrate your website from a clone to a child theme, you will need to rebuild the pages using the child theme templates. 

It is not possible to just swap the templates for each page because the modules on the page will still tie back to the cloned theme.

There are no templates in the child theme folder, how do I edit them?

The child theme does not create a copy of all of the files, it only creates the files necessary to allow for customizations without overwriting existing content in the parent theme.

If you want to customize a specific template, you would need to find the template in the marketplace theme, right-click, and choose clone to child theme.

This will create a copy of the template in the child theme templates folder where you can now customize the file.

You can do this with templates or modules, but any file you clone to the child theme will overwrite the same files from the parent theme and will no longer receive updates from the marketplace.

Setup Instructions

In HubSpot, it is not possible to edit files for themes purchased from the asset marketplace. While it is possible to build your website using the original parent theme, using a child theme is a future-proof way of building your website in CMS Hub.

Creating a child theme requires access to Design Tools (formerly Design Manager), don't worry, no code skills are required! Just follow these steps to create a child theme in your HubSpot account.

Create a child theme in HubSpot Design Tools

Marketing  → Files and Templates → Design Tools

  • In the theme directory on the left sidebar, navigate to @marketplace → maka_Agency → POWER THEME
  • Right-click on POWER THEME and click Create child theme

child-theme-marketplace

  • Enter a name for your child theme
    • we suggest replacing "POWER CHILD THEME" with "POWER x YOURCOMPANY"
    • make sure that each child theme has a unique name that you can search by (i.e. for system pages)
  • Choose the location of the theme
    • The default location is in the root folder, we don't recommend changing this
  • Click Create Child Theme
    • If you expand the advanced options, you can also customize the name of the child.CSS and child.JS files that are created with your child theme (the defaults are preferred for simplicity)
  • Once your child theme is created, a success message will appear telling your child theme is ready to go
  • You can now Click Close
  • You should now see a child theme folder and its contents in the left sidebar

child-theme-files

These are the ONLY files needed in the child theme to build your website, all of the templates and modules are inherited from the marketplace theme and would only be cloned to the child if you are creating a custom-coded template or module.

Congratulations, you have a future-proof theme structure now and are ready to create a stunning website with the child theme you just created 🎉

For any customization requests our team helps with, the child theme folders are where we'll add those changes to be available for your theme.

Using Your Child Theme

When you create a new page, you'll have to choose your child theme and from then on it will be the default for all pages you create. 

power-child-theme-hubspot-theme-settings

You will need to configure the theme settings for each child theme you create, as well as the global header and footer.

Child Themes for Developers

If you would like to add your own CSS styles of JS code you can now do that within your newly created child theme folder by editing the child.CSS or child.JS files that were created during the setup.

You'll need to add the include statement for the primary power theme CSS file as shown here (line 2):

If you plan on creating a custom version of an existing theme module, we recommend only cloning the necessary module to the child theme. Once it is cloned to the child theme, this module will no longer receive updates from the marketplace. If you want to create a variation and retain the existing module, simply rename your custom module and it will not overwrite the parent module.

POWER is one of the most comprehensive HubSpot Website Themes and includes 49 templates and 49 custom modules that are coded to the highest standards making it easier than ever to further customize your child theme.

Video Tutorial

HubSpot Video

Next Steps

After creating your child theme, you're ready to start bringing your brand to life by updating the global theme settings.

Next up:

NEVER MISS A POWER UPDATE

We are continuously improving our modules and updating our documentation. Stay in the loop.