Archived topic
Aggregating CSS files with Autoptimize is overwriting my custom CSS
3 replies · Started by Eugene on October 1, 2022
Hi there
I am currently wondering why the option "Aggregate CSS-files?" Autoptimise is causing my custom CSS in /wp-content/themes/generatepress_child/assets/css/style.css to be overwritten by the default GP CSS?
I am suspecting that the default CSS loaded by GP in the <head> section is being prioritised over my custom CSS. See screenshot: https://prnt.sc/IQrXmZRnuzne
However, I might be wrong and this is due to something else. Can you guys shed some light here? Ideally, I would like my custom CSS to take preference when the CSS is aggregated
Hi there,
The best way to ensure your custom CSS is loaded after all other CSS is to add the CSS to customizer > additional CSS.
Or use more specific selectors, for example, if the parent theme is using .slideout-overlay, then you can use .offside-js--is-open .slideout-overlay to ensure the overriding.
Hi there Ying
Thanks for your response. I’m wondering if there’s perhaps an alternative to that?
We use scss and the CSS file is quite large and we would ideally want to have version control on the child theme and the styles.
It wouldn’t be ideal for us to do this whole process according to our gir dev practises and update the additional css in customizer each time.
We also make use of this custom css to edit most default classes provided by GP such as the main navigation and footer.
Furthermore, i just want to make clear that this does not happen when we do not aggregate the css, then all is fine.
Would appreciate your feedback on this
Furthermore, i just want to make clear that this does not happen when we do not aggregate the css, then all is fine.
If that's the case, it will be better to reach out to the plugin's support.
As if this only happens when the setting in the plugin's activated, then it's not something the theme can control.
