Top contributors sidebar Backgound

[Nestor_Matias]

Hi Discourse i need some help i added this Top-contributor-sidebar theme to my Foum but i want to know how can i add or change the backgound of it? is there any way to custom the style.

[ondrej]

Welcome @Nestor_Matias!

@Nestor_Matias

change the backgound

Do you mean the background colour or?

If its something relatively easy you may find this guide below helpful

Make CSS changes on Your Site

Want to make some CSS changes on your Discourse site but not sure where to start? You’ve come to the right place! You only need to read this topic if you’re very new to CSS. If you already know how to write and add CSS to your Discourse site, then you will most likely not need to read this topic. We’ll cover a few subjects. We’ll start with a brief introduction of what CSS is and some terms that you need to know. We will then move on to how you can add CSS to your Discourse site. Final…

[Nestor_Matias]

thanks @ondrej but i need to change the background of this TOP CONTRIBUTORS theme only. if you can see it looks white like the general theme Top contributors i want to customize it?

[ogulcan1787]

Send forum url i will help you

[Nestor_Matias]

hi @ogulcan1787 i only testing on my Localhost:4200 but also i need some help i’m using Sublime theme but why my category’s boxes don’t change color can you help me please?

[ogulcan1787]

You can edit very easy.

While on the page, press the F12 key on the keyboard.

Click this icon at the top left of the console.

Then select the area you will edit.

Try changing the codes on the right.

Once it’s the way you want it, copy the codes.

Admin > Customize > themes and click EDIT CSS HTML

> Desktop

Paste and Save.

You can instantly see what you saved on the site.

You can find the codes you are looking for on the internet. For example, if you want to change the background color, search on Google for “Background change code CSS”.

The codes you will find are “background-color: #fff”

You can give the background color you want by adding the code you found to the edited field.

Since your native language is English, you can find resources much more easily.

I edited the site in my profile without any coding knowledge. You can do it too.

Good luck.

[Lilly]

Nice work and great post with the screenshots

[ogulcan1787]

Thank you Lilly. I hope I helped.

[Nestor_Matias]

hi @ogulcan1787 thanks but i don’t think you understood my question i use sublime theme there’s no edit css option on this theme. i’m not using Default theme btw.

i hope i explained myself more clear😊

[Moin]

You don’t have to edit the css of that theme. You can create your own theme component and add that to your theme

Open the login popup Or trigger event when button is pressed

You can create a new Theme component and attach it to your theme. Go to Admin → Customize Click on Install button [image] Then attach it to your theme and click on Edit CSS/HTML button [image] You add code in Head section: [image] Hope that helps.

[ogulcan1787]

Maybe you can do it this way.

I think the best thing is to make your own design. It’s really not that difficult.

[Nestor_Matias]

hi @ogulcan1787 thank you so much it helped. but this is not working for category’s box. they have different color if you can see on the inspection it shows they are dynamic but those colors are not showing or working i don’t how to fix this ? can you help pls

i want it like this can anyone help please?

[Moin]

You can change the category-badge-color in the category’s settings.

Just visit the category, click the wrench and choose a different background color.

[Nestor_Matias]

@Moin of course that is the first thing i did, then i tried to do it manually but the css is dynamic as you can see? can anyone help here? pls

[ogulcan1787]

.categor-boxes .category-box border-top: 2px solid #colorcode;

These codes will give them all a single color.

But I think, You’d better do as @Moin says.

[Nestor_Matias]

@ogulcan1787 i already tried this of course but it’s not working i don’t know what else to do