Harnessing the power of child themes makes creating distinct websites with their unique styles and global elements a breeze.
Kick-off with Child Theme Creation
To differentiate each website, you'll need individual child themes. If you're new to creating a child theme, no stress—I have a tutorial ready to help you start your child theme journey.
Begin by establishing a child theme for each of your websites.
Global Module Duplication
Each child theme requires its unique Global Header and Global Footer modules. Thankfully, HubSpot has streamlined this process.
From your PARENT theme, navigate to the MODULES folder, locate the Global Header(v2) and Global Footer, and clone them directly into your desired child theme through a simple right-click action.
You'll then be prompted to select the child theme you wish to clone these modules into. Proceed accordingly.
Optional: Should you wish to tweak the CSS or JS at a code level, consider cloning these files into your child theme now. This step is optional and can be skipped if not needed. Should you choose to proceed, remember to attach these files correctly to the global module within your child theme by replacing the pre-existing links with those specific to your child theme.
Multiplying Your Child Themes
After tailoring your initial child theme, it's time to replicate this process for additional websites or microsites. Simply clone your modified child theme, ensuring each clone is distinctly named for easy identification and management.
IMPORTANT: Dive into each new cloned theme to adjust the global modules. Detach the original CSS (and JS if applicable) files and reattach the correct versions from within your new child theme. This ensures each website maintains its unique branding and functionality.
Celebrate Your Achievement
You've navigated through the complexities of setting up multiple websites within HubSpot like a pro. Take a moment to appreciate your hard work.
And yes, somewhere in the galaxy, Baby Yoda is nodding in approval at your accomplishment.