I was bummed out when (I think it was last year) the Custom CSS/HTML fields were removed from all but the default theme. A workaround I’ve discovered is to make modifications to the default theme and then use the Export button… [image] Then, unzip the file, and change the settings in about.json… give it a new name, and change the theme component to true [discourse-about-json] Save that file, and create a new .zip which includes, for example… [discourse-zip-tc] Then, if you upload that .zip file as a theme or a theme component, you will get the Custom CSS/HTML fields that were removed from all but the default theme.

This information might be useful to you: [image]What controls the order of execution for Theme components' j/s? The only guarantee that’s portable across Discourse instances is that theme code is always executed before theme component code. So your approach is a good one, in that a Theme Component should always be able to override what you have in a Theme.

Theme development is not my forte, but could you not just create a new theme on your site to achieve a similar thing? It’s only the remote themes that don’t have the edit css/html button.

@JammyDodger I hope (and it seems) that you are correct about that!

[image] denvergeeks: the Custom CSS/HTML fields were removed from all but the default theme. Yep that option doesn’t appear when the Theme is remote, as you are expected to update the remote repo. Here, the Default Theme is not cloned from a repo, that’s why that option appears. The option will appear for any local Theme. When working with Remote Themes, one option is just to fork it and make your amendments to your fork. It is in any case better practice to use source control to manage your Theme.

[image] Robert: It is in any case better practice to use source control to manage your Theme. What does that mean?

In order to manage the evolution of your Theme, just as with any code, it is good to use a system like Git(Hub) to control change. This will allow you to track how the Theme evolves, easily roll back changes that don’t work or cause unexpected issues, mitigate loss of code (e.g. local corruption, loss of back-up). On the more advanced end, you can then also consider publishing your Theme to third parties and manage contribution via PR.

Thank you so much @merefield for clarifying that! In this instance, I’m just wanting only to make super-minor CSS tweaks, not to establish or distribute a new theme. For some unknown reason, the whole Git thing just scrambled-eggs my brain with a very unfortunate barrier (which I’m working hard to overcome!) There might be others here in this community like me who (currently in their learning process) can only edit a certain amount of CSS which is only accessible through the Custom CSS/HTML settings in the default theme.

[image] denvergeeks: In this instance, I’m just wanting only to make super-minor CSS tweaks, not to establish or distribute a new theme. Would creating a theme component and attaching it to the theme(s) you want to tweak work for what you need?

@JammyDodger definitely. Making it as a Theme Component seems best as then I can apply it to any theme(s)!

Sorry, just to add you could consider this additional extra refinement: keep the main Theme as is only keep the changes in a Theme Component and delete all the other code that already exists in the main Theme.

Yes that makes perfect sense, thank you!

Custom CSS/HTML

Development

JammyDodger June 23, 2023, 9:06am 8

Would creating a theme component and attaching it to the theme(s) you want to tweak work for what you need?

Topic		Replies	Views
Missing "edit html&css" and "uploads" button for components Feature	7	1369	December 4, 2020
Please support any theme/component. css+html can be customized UX	8	392	December 7, 2024
Custom CSS/HTML in non-default theme (without component) UX css	17	1440	February 26, 2023
I don't see option to edit CSS/HTML for a theme Product Support	1	1062	January 31, 2021
What is the new best way to tweak distant theme component? Development	2	639	February 17, 2021

Custom CSS/HTML

Related topics