How to Add Background Image on just the Index Page

[gaius 0]

We can target the header and make a gradient shift for two colors:

#ipsLayout_header>Header{background: linear-gradient(#3e6eb2, #144580)}

 We can target the whole background:

body{background: url({resource="whatevername.jpg" app="forums" location="front"}) no-repeat center top scroll #000; height: 100%; background-attachment: fixed; background-position: center top; background-blend-mode:screen; background-size: cover;
}

We can, in ACP settings, go into each forum and manually set a theme for every forum, but it creates additional themes in the Theme menu, and will override other theme selection when you visit that forum (which significantly impairs the viewing experience).

Since every forum has a number, how can we use CSS to target specific forums to achieve the goal? In the default theme, I want the index page to have a specific background image (if I can target each forum to set a different background image for that forum within that theme, it'll be great).  

 

[mr-pimpen 387]

what theme are you using

try this

#ipsLayout_header>Header{background: #046092 url('https://www.yourwebsite.com/image/') repeat 50% 50%;
background-repeat: no-repeat;
background-size: cover;

}

 

[titcrunch 182]

you can target specific page with ll this code

https://invisioncommunity.com/4guides/themes-and-customizations/tips-tricks_362/targeting-elements-on-specific-pages-with-css-r179/