How to make background image tile the entire page?

Shopify Discussion
1

Hi there,

I’m having issues to tile my background for the entire site. Instead if tiles again for each section.

I’m looking to have only one tile for the whole site, with the image tiling 5x vertically (hence size:20%) on any screen.

My theme is spotlight, and the code I added to theme.liquid is the following:

.page-width { background-image: url("[https://cdn.shopify.com/s/files/1/0900/9286/3833/t/3/assets/background_350.png?v=1732380736](https://cdn.shopify.com/s/files/1/0900/9286/3833/t/3/assets/background_350.png?v=1732380736)") !important; max-width: 100% !important; background-size: 20%; }

You can preview my site here:

https://izlri502ca9pkir2-90092863833.shopifypreview.com

Thank you for the help!

2

Hello @Mercy_Paris

Apply background to the entire body

body {
  background-image: url("https://cdn.shopify.com/s/files/1/0900/9286/3833/t/3/assets/background_350.png?v=1732380736");
  background-repeat: repeat;      
  background-size: 20% auto;         
  background-attachment: fixed;      
}
3

Hi @Mercy_Paris

Try this one.

Replace to your current code.

And Save.

Result:

Made4uoRibe_0-1732398153948.png
Made4uoRibe_0-1732398153948.png1450×732 207 KB

Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better!

4

Thank you! ??‍ :male_sign:

5

Welcome, Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!