I would like to add an body background image for my site. What do I need to add for the CSS? I know for the header it is

.ipsHeader__primary {
  background-image: url(https://www.mysitename.com/images/header.jpg);
  width: 100%;
  height: 100px;
  background-position: center top;
  background-size: cover;
 background-repeat: no-repeat;
}

Also, I would like to suggest maybe making it a little easier for people to be able to do so rather than having to add custom CSS

Edited December 6, 2024Dec 6 by ghinton

This is where @Ehren custom themes will come in handy when released!!!

.ipsLayout__main {

background-image: url(https://www.mysitename.com/images/header.jpg);
  width: 100%;
  height: 100px;
  background-position: center top;
  background-size: cover;
 background-repeat: no-repeat;
}

You could also use your resources

.ipsLayout__main { 
background-image:url({resource="custom/header.jpg" app="core" location="front"}); 

 width: 100%;
  height: 100px;
  background-position: center top;
  background-size: cover;
 background-repeat: no-repeat;
}