Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

attempting to set unique background image for one page, CSS not working with SquareSpace

Go to solution Solved by colin.irwin,


Hello Squarespace Answers community,

I'm working in the Encore template and I would really like to set a background image for one of my pages. I have an image in the background of my info page and a default black background set for the rest of the website. The encore template currently only allows 1 unique background image-on the info page. I looked into other templates and found that it would be best for me to try to work with the Encore template. I contacted Squarespace Customer care and they recommended that I try using Custom CSS.

I looked up several tutorials on CSS coding within squarespace and CSS coding in general. I tried to code the image into this one page. Squarespace will not (no matter what I do) show the image on this one page. It seemed like it was not responding to the code, but when I put in the background-color command, squarespace responded no problem. I'm also not getting any error messages with the current code.

Could it be that the Encore template background overrides the custom CSS background image? Or maybe the image is stuck behind the default background image I selected for the rest of the site. Is it even possible for me to have an image on one page (other than the info page) in the encore template using Custom CSS? And if so, am I going down the right path to do so? Maybe there's something wrong with my code-or a different code that would work better.

Custom CSS code:



background-position: center center;
background-size: cover;
background-attachment: fixed;
background-image: url ('http://a-image-url.jpg');


Any help at all is appreciated,

Thank you,

Edited by calebCaming
Initial Revision
Link to post
  • Answers 27
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

This worked for me on Mentor (part of the Brine family) #collection-599ddf2ef9a61e945ba20a96 .Main { background-image: url("//static1.squarespace.com/static/598cdb67e3df282ea8b16720/t/599f370fcf81e02

My Custom CSS code is: #collection-55a5af43e4b0aac39df22df0 { #outerwrapper { background-image: url ('http://static1.squarespace.com/static/55a48db1e4b03b84d36b22fb/t/571e6768746fb924e954224b

Something like this should work: body#collection-55a5af43e4b0aac39df22df0 { background-position: center top !important; background-image: url("//static1.squarespace.com/static/55a48db1e4b03b84

Posted Images

Recommended Posts

  • 0
On 8/24/2017 at 11:34 PM, allisonstratton820 said:

Thanks this worked for me on the Margot Template.

This worked for me on Mentor (part of the Brine family)

#collection-599ddf2ef9a61e945ba20a96 .Main {
background-image: url("//static1.squarespace.com/static/598cdb67e3df282ea8b16720/t/599f370fcf81e02b63285958/1503606545633/sky.jpg")!important;
background-position: center center;
background-size: cover;
background-attachment: fixed;
background-repeat: repeat;




Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...