On May 23, 2016, we released updates for active themes that split out support for individual plugins into separate style sheets. This article details why and what you need to be aware of if you are using a child theme.
As we’ve added support for popular plugins, the main style sheet started ballooning to sizes that were a little unwieldy, especially considering not everyone uses all the plugins. With that in mind, we split the CSS for individual plugins into separate style sheets.
Doing this offers a number of benefits:
- It improves performance by reducing the size of the main style sheet
- Only loads plugin styles when they’re actually needed
- Increases organization, readability, and maintainability
- Makes it easier to introduce support for additional plugins in the future
With a handful of potential style sheets being loaded from the parent theme, in can be a challenge for a child theme to make sure everything is loaded in the correct order. Instead, we updated each theme to automatically load the child theme’s style sheet.
For the most part, this change should not cause any negative side effects. However, we are keeping track of potential issues and will update this article as we become aware of them.
The documentation for each theme has also been updated with a new sample child theme that you can download for reference.
Child theme style sheet is loaded twice
If you were using a child theme prior to this change, it’s possible that your child theme’s style sheet may be loaded twice. We added some code that automatically accounts for child themes based on the samples we provided, but if you created your own child theme, you may need to update it.
View the source on the front end of your site to see if the child theme style sheet is loading twice. If it is, modify your child theme’s functions.php to remove any code that loads the style sheet (the parent theme will load it automatically). Be sure to back up your child theme before making any changes!