Restrict editing of remote themes

News and Events Announcements

AI-generated summary

Discourse has removed the ability to locally edit remote themes to enforce best practices, as changes are lost during updates. Users with local edits must either move CSS-only changes to a new local theme component or convert the theme to a local one by exporting and reinstalling it. For more complex changes, users are advised to fork the remote theme on GitHub and install the fork. The remote theme should be removed to avoid duplication. A user asks about previewing changes, and another suggests using the Discourse Theme CLI or a staging site for testing. The CLI is praised as a helpful tool for theme development.

1

For quite a while, best practice has been to avoid editing themes installed from a remote Git repository locally on Discourse. Any changes to theme code or uploads get wiped out when updating the theme from the remote repo.

https://github.com/discourse/discourse/commit/65e123498b4f8f260a8461e48995a3ca166b605e

In this commit, we’ve removed the ability to locally edit a remote theme and are now enforcing this best practice in Discourse.

What happens if I have a remote theme with local changes?

Nothing at this point. Your theme stays as is until you remove it or update it from remote.

How do I keep my local edits?

If your changes are CSS only:

You can copy your CSS-only changes to a brand new local theme component. To do so:

  1. Click Install
  2. Click Create new
  3. Click the Edit button in the right pane.
  4. Copy your CSS changes into the proper file (common/mobile/desktop).
  5. Save and enable the theme component.
  6. Update your remote theme to overwrite the local changes and avoid duplicate CSS.

If you’ve changed more than CSS (JS/Templates):

We recommend if you wish to keep your local edits to transition the theme to a local theme. To do this:

  1. Open the theme under Admin > Customize
  2. Click Export to download the theme with your local changes.
  3. Click Install under the theme list, then From your device
  4. Upload the exported theme, install and enable as previously.

The other option for those interested is to fork the remote theme on GitHub, commit your changes to the forked repository, and install that fork on your Discourse instance. This enables the option of rebasing your changes on top of any future updates to the main repository, which converting to a local theme does not offer.

Lastly, be sure to remove the remote theme to avoid duplication of changes and confusion in the future.

35 Likes
CSS/HTML editor disappeared
Missing "edit html&css" and "uploads" button for components
Edit HTML/CSS button missing on one theme after latest update
Discourse 2.6.0.beta6 Release Notes
No theme html / css section
I don't see option to edit CSS/HTML for a theme
FKB Pro - Social theme
Fakebook Theme
Not able to modify/customize a download theme component after update
Can I turn off location?
Unable to find Edit HTML/CSS for default selected Theme
Upcoming theme components 'use strict' change - themes break after upgrading Discourse
Isabelle, an Animal Crossing inspired theme
Personal Message Bubbles
N00b updating from 2.4.0.beta7 to 2.7.0.beta7
FKB Pro - Social theme
4

I used this feature to quickly preview changes of my remote theme. Is there a way to achieve this now? I don’t want to commit a height change somewhere, push it, pull and update only too see that it was too much or too few of a change :frowning:

1 Like
5

One way is to use Discourse Theme CLI (console app to help you build themes) to try the component with a different name before you push the commit. Another would be a development or staging site.

2 Likes
6

The CLI it is! Awesome! I didn’t know such thing existed, this will help a lot.

Thank you for the tip!

2 Likes
7

It is awesome! And you’ll be glad not to edit on a web browser ever again! :clinking_glasses:

4 Likes