# Custom CSS/HTML

**URL:** https://meta.discourse.org/t/custom-css-html/269362
**Category:** Development
**Created:** [June 23, 2023, 7:53am UTC](https://meta.discourse.org/t/custom-css-html/269362 "2023-06-23T07:53:57Z")
**Posts on this page:** 14
**Page:** 1

<div class="post-metadata">

### Author: ![denvergeeks](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/denvergeeks/32/327671_2.png) [@denvergeeks](https://meta.discourse.org/u/denvergeeks)
#### Post date: [June 23, 2023, 7:53am UTC](https://meta.discourse.org/t/custom-css-html/269362/1 "2023-06-23T07:53:57Z")

</div>

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](https://global.discourse-cdn.com/meta/original/4X/1/7/1/171994d08413d06605ba0eaa73347ab0a61c8496.png)

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](https://global.discourse-cdn.com/meta/original/4X/4/5/d/45d03d944631174285a707978715b19f3110dbb1.png)

Save that file, and create a new .zip which includes, for example…

 ![discourse-zip-tc](https://global.discourse-cdn.com/meta/original/4X/1/b/5/1b512a7d57f8c0757caf99ca162ea0f3c1d270b2.png)

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.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [June 23, 2023, 8:21am UTC](https://meta.discourse.org/t/custom-css-html/269362/2 "2023-06-23T08:21:29Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![denvergeeks](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/denvergeeks/32/327671_2.png) [@denvergeeks](https://meta.discourse.org/u/denvergeeks)
#### Post date: [June 23, 2023, 8:38am UTC](https://meta.discourse.org/t/custom-css-html/269362/3 "2023-06-23T08:38:55Z")

</div>

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

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [June 23, 2023, 8:40am UTC](https://meta.discourse.org/t/custom-css-html/269362/4 "2023-06-23T08:40:34Z")

</div>

> [@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.

---

<div class="post-metadata">

### Author: ![denvergeeks](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/denvergeeks/32/327671_2.png) [@denvergeeks](https://meta.discourse.org/u/denvergeeks)
#### Post date: [June 23, 2023, 8:43am UTC](https://meta.discourse.org/t/custom-css-html/269362/5 "2023-06-23T08:43:45Z")

</div>

> [@merefield](#):
>
> It is in any case better practice to use source control to manage your Theme.

What does that mean?

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [June 23, 2023, 8:46am UTC](https://meta.discourse.org/t/custom-css-html/269362/6 "2023-06-23T08:46:07Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![denvergeeks](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/denvergeeks/32/327671_2.png) [@denvergeeks](https://meta.discourse.org/u/denvergeeks)
#### Post date: [June 23, 2023, 9:00am UTC](https://meta.discourse.org/t/custom-css-html/269362/7 "2023-06-23T09:00:05Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [June 23, 2023, 9:06am UTC](https://meta.discourse.org/t/custom-css-html/269362/8 "2023-06-23T09:06:48Z")

</div>

> [@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?

---

<div class="post-metadata">

### Author: ![denvergeeks](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/denvergeeks/32/327671_2.png) [@denvergeeks](https://meta.discourse.org/u/denvergeeks)
#### Post date: [June 23, 2023, 9:09am UTC](https://meta.discourse.org/t/custom-css-html/269362/9 "2023-06-23T09:09:42Z")

</div>

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

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [June 23, 2023, 9:30am UTC](https://meta.discourse.org/t/custom-css-html/269362/11 "2023-06-23T09:30:26Z")

</div>

This information might be useful to you:

> [@What controls the order of execution for Theme components' j/s?](https://meta.discourse.org/t/what-controls-the-order-of-execution-for-theme-components-j-s/190410/14):
>
> 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.

---

<div class="post-metadata">

### Author: ![merefield](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/merefield/32/176214_2.png) [@merefield](https://meta.discourse.org/u/merefield)
#### Post date: [June 23, 2023, 9:38am UTC](https://meta.discourse.org/t/custom-css-html/269362/12 "2023-06-23T09:38:21Z")

</div>

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.

---

<div class="post-metadata">

### Author: ![denvergeeks](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/denvergeeks/32/327671_2.png) [@denvergeeks](https://meta.discourse.org/u/denvergeeks)
#### Post date: [June 23, 2023, 9:51am UTC](https://meta.discourse.org/t/custom-css-html/269362/13 "2023-06-23T09:51:12Z")

</div>

Yes that makes perfect sense, thank you!

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [June 23, 2023, 11:06am UTC](https://meta.discourse.org/t/custom-css-html/269362/14 "2023-06-23T11:06:36Z")

</div>

Also check out [Install the Discourse Theme CLI console app to help you build themes](https://meta.discourse.org/t/install-the-discourse-theme-cli-console-app-to-help-you-build-themes/82950)

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [July 23, 2023, 11:07am UTC](https://meta.discourse.org/t/custom-css-html/269362/15 "2023-07-23T11:07:19Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.
