Changing the background

[Jack_Nixon]

Can someone answer me how can i change my themes background into an image and what resolutin to use beacuse everytime i try it doesnt work out

[m4z]

Which theme are you using? What have you tried?

[Jack_Nixon]

I have used many themes and i am asking how can i change it i mean the image

[Arantor]

So which version of SMF are you using?

Also, it really matters which theme you're using as every theme can do it differently.

[Jack_Nixon]

Im using smf 2.1 and i've tried in the boru theme rdd theme and ux theme tu change the background in index cs but it didnt work out 

[Arantor]

So you changed the background colour... presuming you saved the file back to the server with the new colour in, did you then force your browser to load the new file correctly? Chrome in particular is very good at not doing that.

Ctrl-F5 is usually enough but if not, make sure 'Disable cache' is selected in the network tab of the browser inspector while force-refreshing.

[Jack_Nixon]

But how can i change the background to an image?

[Arantor]

Change the colour to url(path-to-image.png) as per normal CSS...

[Jack_Nixon]

In index cs and it needs to be in the ong format?

[Arantor]

Yes, in index.css.

No it doesn't have to be png, it can be gif or jpg, but odds are if you end up adding a huge image it'll just annoy people.

[Shades.]

But how can i change the background to an image?

I'm trying to figure this out too (im not a coder, still learning)!

But looking at my default themes index.css using 2.1RC3, what and how do I change the background color to my "images/background.gif"?

Is this the right area and if so which one of the background colors do I change to a url and how?

Code Select Expand

html {
background: #3e5a78;
}
body {
background: #e9eef2;
font: 83.33%/150% "Segoe UI", "Helvetica Neue", "Nimbus Sans L", Arial, "Liberation Sans", sans-serif;
color: #4d4d4d;
display: flex;
flex-direction: column;
min-height: 100vh;
}

[Kindred]

Body

Look at what I did here... test2.turtleshellprod.com

[Shades.]

Body

Look at what I did here... test2.turtleshellprod.com

Very Nice!

I've tried changing this:

Code Select Expand

background: #e9eef2;

to this:

Code Select Expand

background: .../images/background.gif;

but im sure its missing some more code cause its not working?

[Sir Osis of Liver]

Code Select Expand



background-image: url(".../images/background.gif");



[Shades.]

I changed the code:

html {
   background: #3e5a78;
}
body {
   background-image: url(".../images/background.gif");
   font: 83.33%/150% "Segoe UI", "Helvetica Neue", "Nimbus Sans L", Arial, "Liberation Sans", sans-serif;
   color: #4d4d4d;
   display: flex;
   flex-direction: column;
   min-height: 100vh;
}

But the background just turned a blueish color!?

[Sir Osis of Liver]

It's displaying background: #3e5a78;.  The image url is probably incorrect.  Use an absolute path to image, not relative (i.e., http://yourdomain/...........).

[Shades.]

It's displaying background: #3e5a78;.  The image url is probably incorrect.  Use an absolute path to image, not relative (i.e., http://yourdomain/...........).

Ok thanks! I got it to work!

[Shades.]

Body

Look at what I did here... test2.turtleshellprod.com

Hey Kindred how did you make the background stationary?

[Sir Osis of Liver]

Code Select Expand



background-attachment: fixed;



[Shades.]

Code Select Expand



background-attachment: fixed;



Awesome thank you!

[Kindred]

as a hint: If you want to know how someone did something on a site (and you think it's CSS --- which my site is (cruve 2 theme with only MINOR code changes, almost every change was done via CSS) -- use your browser Inspect tool... 

[Shades.]

as a hint: If you want to know how someone did something on a site (and you think it's CSS --- which my site is (cruve 2 theme with only MINOR code changes, almost every change was done via CSS) -- use your browser Inspect tool... 

Yeah I'm still learning how to do that! Been a way for a couple of years (work work work) and trying to pick up where I left off now that I'm semi-retired but so much has changed and I've forgotten half the things I learned back then but It's coming back slowly...lol!

[Shades.]

Code Select Expand



background-image: url(".../images/background.gif");



Changed to background-image: url("https://testsite/images/background.gif"); works on RC3 but doesn't seem to wanna work on RC4!?

[Shades.]

Ok i just figured out that the edits above do work on fresh install of RC4 but is conflicting with the Curve2 Color Changer mod so I'll just have to wait and see if/when that mod gets updated.