How can I change the background image of specific sections on my webpage?

Store Design
1

Hi, I would like to change background to image of specific sections of my pages. I tried some codes but nothing worked, could you please help me. Thanks. Web: www.luxur-looks.myshopify.com Pass: luxurlooks

2

Hi @noapaxx ,

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Customize theme

Step 2: Click on the section where you want to change the background image

PageFlyRichard_0-1677513512915.png
PageFlyRichard_0-1677513512915.png1859×922 299 KB

And you can add the following css to this setting:

.gradient {
  background: url("url_image_path")
    no-repeat;
  background-size: cover;
}

I hope it would help you
Best regards,

Richard | PageFly

3

Thanks for that. But one more thing, how to do this to make the background for mobile.

4

Hi @noapaxx ,

Shopify’s css settings do not support using @media to be responsive on mobile. I think if you want to edit on mobile, you can css according to each section Class in the file base.css

PageFlyRichard_0-1677564239087.png
PageFlyRichard_0-1677564239087.png1538×832 152 KB

This requires you to know about css code.

I hope it would help you
Best regards,

Richard | PageFly