I’ve added some custom CSS and HTML. Checked the preview, and everything looks great. Now I want to commit these changes, but how? I don’t see any commands for this, and I tried rebuilding the discourse app, but nothing happens. My searches come up empty. This is probably so easy, nobody ever asked how to do it, but this noob could use a hint…

[image] lyseoy: nav#bar #logo { display: flex; justify-content: center; flex-basis: 100%} This is wrong, should be nav#bar #logo { display: flex; justify-content: center; flex-basis: 100%; }

Seems irrelevant but I don’t really understand.

[image] lyseoy: I’ve added some custom CSS and HTML. Where? Custom Theme, default theme? Common css / desktop css / mobile css? More details on what you have done will be helpful. Usually you just select a theme /admin/customize/themes and do this: [Theme Css] Once you hit that save button, changes show up pretty much instantly as long as the theme you have edited is active.

What you did. In the video. Except I can only see the changes when I hit the Preview button.

Have you got the theme selected as the active default theme? See the green tick? [screenshot-vapingcommunity.co.uk-2020.09.08-15_44_09] [screenshot-vapingcommunity.co.uk-2020.09.08-15_45_16]

Yes. I’ve edited the standard light theme, and it’s active and default.

Ok, can you list the changes you made please Link to the website would also be helpful

CSS: @import url("https://fonts.googleapis.com/css?family=Open+Sans:400, 400i, 700"); .docked #main-outlet { margin-top: 0; } .docked nav#bar { display: none; } nav#bar { font-family: 'Open Sans', sans-serif; font-size: 16px; display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; } nav#bar ul { display: inline-flex; list-style-type: none; margin: 0 0 0 25px; align-items: center; } nav#bar ul li { margin-left: 20px; } @media (max-width: 650px) { nav#bar { flex-wrap: wrap; justify-content: center; } nav#bar #logo { display: flex; justify-content: center; flex-basis: 100%} nav#bar #logo img { width: 120px; } nav#bar ul li { margin-left: 8px; } nav#bar ul li a { font-size: 14px; } nav#bar ul li a.www-btn { padding: 3px 8px 5px; } } nav#bar li a { text-decoration: none; color: #333; } nav#bar li a:hover { border-bottom: 5px solid; } nav#bar li:nth-of-type(1) a:hover { border-color: #D13239; } nav#bar li:nth-of-type(2) a:hover { border-color: #f15c22; } nav#bar li:nth-of-type(3) a:hover { border-color: #F2E88F; } nav#bar li:nth-of-type(4) a:hover { border-color: #00953A; } nav#bar li:nth-of-type(5) a { font-weight: bold; } nav#bar li:nth-of-type(5) a:hover { border-color: #14A0F4; } nav#bar img { width: 150px; height: auto; max-height: 40px; } nav#bar .www-btn { border: none; border-radius: 100px; background: #13a0f5; color: #fff; padding: 5px 20px 7px; } nav#bar .www-btn.big { font-size: 1.5rem; padding: 7px 30px 10px 30px; } nav#bar .www-btn:hover { background: #0a5783; } nav#bar .www-btn:active { background: #08476b; box-shadow: none; } nav#bar a.www-btn { text-decoration: none; color: #fff !important; } .d-header { background: linear-gradient(-90deg, #F2E88F, #a3e6ff); background-size: 100% 100%; background-repeat: repeat-x; box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.15); } .d-header .icons .icon { color: #555; } I’ll post the content of the Header in a bit. The forum keeps rendering the html when I paste it…

Glad you got it working :smile: Any errors in your CSS will render that CSS void. I’ve never used preview before so I can’t comment on that. I’m sure there used to be an error notification on the page :thinking: Oh and Happy Birthday @tshenry :tada: Have a good one

Activating custom CSS/HTML

Product Support

lyseoy September 8, 2020, 3:07pm 10

That’s it! Well spotted, you’ve got a keen eye!

Funny that the preview didn’t mind that syntax error.

Topic		Replies	Views
Custom CSS/HTML in non-default theme (without component) UX css	17	1440	February 26, 2023
There is no option to add additional css/html Product Support	6	569	August 24, 2022
How to Edit Html and Css of Theme? Development	1	624	March 3, 2024
I don't see option to edit CSS/HTML for a theme Product Support	1	1062	January 31, 2021
Custom CSS/HTML Development	12	1766	June 23, 2023

Activating custom CSS/HTML

Related topics