How to edit this area?


(أنس) #1

in the admin panel CSS manager i can’t control the right & left area of the instance

see the below picture for more details or simple check live demo


(Christoph) #2

You could try the Custom Layouts Plugin


(أنس) #3

I’m not sure of this plugin will work in the last version of discourse.

i’m concern that it could rise some issues


(Angus McLeod) #4

If you have any issues with the plugin just post in the plugin topic and we can work them out.


(أنس) #5

Hi Angus, is the plugin the only way to do this adjustment to the theme?

thank you,


(أنس) #6

@angus

also, if you noticed the areas in the right & left are not a plain color rather an image

is possible for the plugin to support images as well?


(Murat Demirten) #7

You need to set background propery of the body element:

body {
    background:url('/uploads/default/original/1X/bf7c6bc6836a7b23da4162d958c5af69d4495783.png');
}

(Angus McLeod) #8

Explain a little more what exactly you want to do. As @Murat_Demirten mentioned, the body element on your instance is currently using an image as the background. But you added this yourself, and it seems you’re not yet happy with the current style. Tell us exactly what you want to do and we can point you in the right direction.


(أنس) #9

@Murat_Demirten

hi Murat

I’m glad to see you joining the discussion.

i did added the code you provided but it not reflected

it keeps showing me the code it self in each page.

see the below pic


(أنس) #10

hi @angus

biscally i would like to use this the below pic to be the background of the whole instance, exactly as used in Linux tips


(Angus McLeod) #11

Go to Admin > Customize > CSS/HTML. Create a new style. Add any CSS you want. Make sure your style is enabled E.g.

Equals


(أنس) #12

@angus

worked well, thank you so much the issue was with the image link wasn’t complete

unfortunately the overall look is different because now the image is covering every thing

the way my instance now

the way i want it

notice that one subject with light brown & the other is wight just like an excel sheet

thank you again Angus


(أنس) #13

@angus
@Murat_Demirten

any tips for the last inquiry؟

thank you


(Marko Kaartinen) #14

Alternating rows can be achieved with css. There is a topic for that:

And the different background and content area can be done via css also. I have this css in my Discourse installation:

body {
    background:rgba(210, 224, 233, 0.4);
}

#main-outlet {
    background:#FFF;
}

I recommend using dev tools of the browser to figure out right elements and try colors etc.
Chrome: Chrome DevTools Overview - Google Chrome
Firefox: Firefox Developer Tools | MDN