Shopify Design

betbuech · ‎11-29-2021

Hi there

I have tried to change my background images for each page in the STORY Theme.

First I have added the following code on theme.css

body.background-region { background-image: url("https://cdn.shopify.com/s/files/1/0609/2813/1331/files/Vineyward_with_Alistair_close_cut_3.jpg?v=163...");
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover; background-size: cover;
}

body.background-making { background-image: url("https://cdn.shopify.com/s/files/1/0609/2813/1331/files/back_winemaking.jpg?v=1637456470");
background-repeat: no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover; background-size: cover;
}

Then I made the following changes in theme.liquid:

Unfortunately this does not work in the Story-theme anymore, but it worked in the Debut-Theme before.

Your help would be very appreciated.

Thanks in advance

betbuech · ‎11-30-2021

Hello LitExtension

Thanks for your reply and thank you so much, it works!

You saved my day

Greetings from

betbuech

View solution in original post

ChoosiZon · ‎11-29-2021

You can try this :

<body id="{{ page_title | handle }}" class="template-{{ template.name | handle }}
{{ settings.decoration_style }} {{ settings.default_background }}" data-animations="{{ settings.animations_enable }}
{% if page.handle == 'the-region' %}background-region{% endif %}
{% if page.handle == 'the-winemaking' %}background-making{% endif %}">

Donate
For faster response with a fee pls email to : choositech@outlook.com

betbuech · ‎11-30-2021

Hello ChoosiZon

Thanks for your reply, but this does'nt work either!

LitExtension · ‎11-30-2021

Hi @betbuech,

Please add this code, it will work fine:

body.background-region .main-content, 
body.background-region .palette--dark, 
body.background-region .palette--light,
body.background-making .main-content, 
body.background-making .palette--dark, 
body.background-making .palette--light{
	background-color: transparent !important;
}

Hope it helps!

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify

betbuech · ‎11-30-2021

Hello LitExtension

Thanks for your reply and thank you so much, it works!

You saved my day

Greetings from

betbuech

LitExtension · ‎12-01-2021

Hi @betbuech,

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

LitExtension - Shopping Cart Migration Expert
Check out our Shopify migration app to migrate your online store to Shopify

Shopify Design

Changing single background images on pages in Story Theme

Community Blog Articles

Shopify Community

Support

Shopify

Quick Links