I’m new to Roots and Sage so bare with me if this is a stupid question. We’re about to build a bunch if sites using the Roots stack and we’re now looking into how to handle themes. Our main idea is that we’d like one base theme for all of our sites and create all of our base functionionally there and then, if needed, create child themes of sorts for each individual site. The child theme would then contain overrides and edge case functionality for each site. But a couple of questions arise:
Is this the recommended way of doing it? If not how can we solve this and still maintain a common codebase for our standard stuff?
I can’t find any real documentation for how the create a child theme to a Sage based parent theme. Is there a guide out there somewhere?
There’s nothing wrong with the way you’re proposing. You’d want to set up a separate build process for your child theme style overrides and you might end up loading more styles than are strictly necessary.
To resolve that problem for one of my projects I created sub-themes, selected in Customizer and had Sage build whole separate “main” stylesheets per sub-theme. It increases the build time significantly (I’m building 5 “main” stylesheets rather than 1) but it means each site only gets the styles they actually need.
For example I can set Bootstrap’s $theme-colors per sub-theme and I don’t have to override anything.
Functionality is a little harder, so for site-specific functions I’ll usually make an mu-plugin and include it in that site’s Bedrock composer.json only.