Additional CSS lost when changing themes

[scottwyden]

When you change themes, the Additional CSS is lost. Change the theme back and it returns. I think there should be an option to retain the Additional CSS across any theme used. If we do not implement that, I have a funny feeling that many users will be confused as to where their custom CSS went.

[lukecavanagh]

@scottwyden

So an option to copy over the CSS when changing themes to the new theme maybe?

[scottwyden]

Replying to lukecavanagh:

@scottwyden

So an option to copy over the CSS when changing themes to the new theme maybe?

That would be sufficient in my opinion, yes.

[westonruter]

Instead of there being an option to push the CSS into another theme when switching, it would probably be preferred to have a dropdown to pull CSS from another theme. So if you're editing a twentyseventeen child theme you there could be a dropdown for importing CSS from twentyseventeen parent theme.

Aside: the CSS pulled from the other theme would need to first check the current changeset to see if there are any CSS changes for that theme stored in it, and if so, use those instead of the changes in the custom_css post type for that theme.

I'm not 100% sure this is a defect. It seems more like an enhancement.

[georgestephanis]

There could be some mitigation w/r/t if someone changes to a parent theme or a child theme, retaining the existing styles as well.

[lukecavanagh]

Or maybe CSS that is marked global, could be copied over for the custom CSS when the theme is changed. But then you would need a way to define CSS as being global, as in this CSS changes how this plugin is displaying on the front-end, or this element is being hidden.

[helen]

The two most common existing custom CSS solutions out there are ones that are bundled with themes and Jetpack, neither of which persist CSS between theme changes. I'm a pretty heavy user of custom CSS myself, and while occasionally I like to go back and see what I had before, I've never wanted to wholesale import it over with a theme change, as the selectors are often quite different and I tend to have made changes that are very theme-specific, as CSS really should be for the most part. Even if it's for a plugin, it's usually scoped to some selector within the theme.

[lukecavanagh]

@helen 

But certain custom CSS would be related specifically to an active plugin and not the active theme.

[helen]

Replying to lukecavanagh:

But certain custom CSS would be related specifically to an active plugin and not the active theme.

Right, hence occasionally finding it useful to refer back to what I had. But not importing it wholesale:

Even if it's for a plugin, it's usually scoped to some selector within the theme.

(And styled to go with the theme.)

[lukecavanagh]

@helen 

What about a warning message or notification to the user, if they do have CSS stored in the custom CSS and are going to change active themes. Something to the effect, your custom CSS will be lost if you are changing themes.

[dlh]

There are a lot of user-friendly ideas here, but it seems to me like it now need someone to hash out a prototype, either in a rough patch or as a mockup, to begin the process of iteration.

Replying to westonruter:

Instead of there being an option to push the CSS into another theme when switching, it would probably be preferred to have a dropdown to pull CSS from another theme. So if you're editing a twentyseventeen child theme you there could be a dropdown for importing CSS from twentyseventeen parent theme.

Aside: the CSS pulled from the other theme would need to first check the current changeset to see if there are any CSS changes for that theme stored in it, and if so, use those instead of the changes in the custom_css post type for that theme.

Perhaps there's a dropdown that allows the user to first view the custom CSS saved in another theme in a read-only field, which might be enough for the use case of plucking a few styles to reuse in the new theme (akin to comment:8). Then, if the current changeset also is free of CSS changes, a button could also be available to copy the whole thing into the new theme.

[celloexpressions]

The Modular Custom CSS plugin addresses the use case of persisting some CSS for all themes while maintaining separate theme-specific CSS: ​https://wordpress.org/plugins/modular-custom-css/

I still use this plugin on all of my sites and end up with a mix of mostly things that stay specific to the current thing and a few things that need to persist across theme switches. I don't think there are many cases where it would make sense to bring in all of the CSS that was used to customize another theme. And given this plugin's current usage level, I'm not sure that core needs to do anything else here.