Custom CSS display on Admin pages broken - clarification please

(Scott) #1

Does custom css show up on the admin pages unless you refresh the admin page?

Is that correct and intended behavior? Just looking for a confirmation since most of the topics I found were old.

(Jeff Atwood) #2

You should not expect custom CSS to show up on admin pages. Open another browser window to a regular page and test there.


I’ve noticed that if I go to Admin off the hamburger menu, my custom CSS to keep the avatars square remains active. I consider that a bonus, so I’ve taken to using that method to get to the admin pages instead of my bookmark.


Why? It generates a feeling of discontinuity between the admin pages and the site that they are administering, which should probably be considered a Bad Thing™.

(Mittineague) #5

Isn’t that exactly the case? i.e. the ACP is not the public pages.

(from TDWTF) #6

I think it makes sense.

Let’s say you were dumb and made the follwing custom css-changes:

If it applied at the admin-section - where you administer such changes - as well, you'd have more or less bricked your instance (unless you hunt down the responsible CSS-File manually).

Filed Under: [I also don't think seperating admin- and userspace stylewise is a bad thing](#tag)
Also Filed Under: [I do admit there could be exceptions like the round avatars but I'd say they are neglectible on an admin section](#tag)


Yeah, but you should know that already. You click on Admin, or flags, or something admin sounding to get there. Also, there’s already differences between the admin pages and the public site, simply because they do different jobs. You aren’t using the same layout for the admin dashboard, or the flags anywhere in the public pages. So what’s wrong with letting the custom CSS override the shape of the avatars?

My point is, the layout of the pages already provides enough of a discontinuity, why heighten it by disallowing the custom CSS? On WTDWTF, we override the round avatars, so it’s always confusing for me to see the round avatars in the admin panel.


Discourse allows you to test out CSS changes before applying them. I don’t know if you’ve seen that back at WTDWTF, but every now and then, one of our admins will post a link to a test style and ask for opinions. If you apply a style wholesale without testing, you really need to be more careful doing custom CSS.

Not really, there’s always tools like Stylish or developer tools to get around it long enough to fix the issue. And if you don’t know how to do that, you shouldn’t be messing with custom CSS in the first place.

(Sam Saffron) #9

It shows up fine on admin provided you don’t enter the site on an admin page. This is by design.

Reloading on an admin page is your escape hatch for when you messed up CSS so bad you can no longer see the admin page.

(Scott) #10

It makes sense, I was just freaked out a bit when I hit refresh and the CSS wasn’t displaying properly.

I’m only using it to create a header navigation that matches the main website, and don’t really need it on the admin pages. So really, I would be ok if the nav menu didn’t appear on the admin page, but what I don’t like is the nav displaying all messed up. Understanding why it’s doing what it’s doing is ok with me.

Thank you for the clarification.

(Kane York) #11

Wait, can’t you include <script> and <style> tags in the place where the nav menu goes? So you could still mess it up.

(Sam Saffron) #12

Fact is they are not, and before we had this escape hatch we had weekly support requests on meta complaining about “how the hell do I disable my customization now that I messed up my site”


Ok, this is understandable. Though I still think that people should be relying on their browser’s dev-tools for this a little bit more, instead of relying on the software to include an escape hatch.

Just curious, why didn’t you include a URL slug like #no-custom for this?

(Sam Saffron) #14

We always had a magic URL ?preview_style= … but people just have to much trouble discovering it.

(Mittineague) #15

Where is it documented?

(Jeff Atwood) #16

There is a preview link right under the editor


Part of the problem with that is remembering the correct UUID. If you need to clear a CSS, you may not be able to find the necessary UUID, and good luck remembering what you need. Better to have ?clear_custom_css

(Sam Saffron) #18

nope, you don’t need to remember a uuid, preview_style with nothing will simple remove all custom styles.

(Kane York) #19

No, ?preview_style= gets you to the set of “Enabled” customizations; ?preview_style=default removes all customizations.