I’m using CSS editor on a main website and a mobile app built with Apppresser. The brings two themes rather than one into the process so I’m trying to understand how I can use CSS Editor on this.
Here’s some background:
– Apppresser loads a second theme (with child) that is used by the mobile app. It can also be used in a Preview app and in a browser test mode. So right now I have 4 themes loaded — the main theme, main theme child, apppresser mobile theme (Ion) and apppresser theme child. The main theme child is “active”.
– I can use CSS editor nicely in the browser test mode to modify the mobile theme CSS. However I’m seeing some changes also showing up back up stream with the main theme. I assume what is happening here is where there are common class names in both themes the changes are applying to both via CSS Editor, even though the themes are completely separate. I’d also like to use CSS Editor on the main theme without effecting the mobile theme.
How can I work on these 2 themes separately in the same app? How does CSS editor handle this?
Some guesses:
– Presumably CSS Editor does not understand the two theme concept.
– Presumably CSS Editor is file is one file that is mapped to a theme, but in this case thinks there’s only one theme so is applying to both themes where common classes.
Is it possible to copy the CSS edits out of CSS Editor and put them in the Apppresser child theme style.css, then somehow reset the CSS Editor to start over on the main theme CSS edits? Possible to delete the CSS edits associated with a theme (delete CSS Editor?)? Better, is it possible to move back and forth from editing CSS on the main theme to the apppresser theme?
Please suggest any best practices or work arounds if indeed CSS Editor does not naturally support this.
Hi Paulfh,
Okay so, it’s as you’ve presumed – SiteOrigin CSS currently doesn’t understand the two theme concept and it stores the custom CSS with a theme based slug (ie. mapped to it). We’ve (myself and Greg) have come up with a possible solution to allow for this in the future but obviously, I can’t provide you with an ETA at this time.
In the meantime, it’s… well it’s going to be slightly an annoying experience. You’ll have to manually change themes to apply styling changes to the mobile version of the theme. This, obviously, isn’t ideal. I would recommend just directly editing the mobile themes child stylesheet. :(
Regardless, to answer your question. To reset the Custom CSS page all you need to do is blank it.
I’m sorry that I couldn’t be of more help, but please note that you’ve helped us greatly by giving us a push in the right direction in terms of future developments.
Let me know if this makes sense.