Adding a background image to the password page on the narrative theme

Solved
Highlighted
Tourist
5 0 3

Hi everyone!

I was hoping to get some help with the coding to get a background image added to the narrative theme. Any help would be appreciated!

Thanks

2 Likes
Highlighted
Excursionist
25 6 11

hello @Blueskiesskiesa 

Welcome to the Shopify community! and Thanks for your question.

Please share your site URL,
So I will check and provide a solution here.

Belgacem Ben ltaif
Web consultant /Shopify Expert/ CTO Powerful Consulting
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
https://about.me/benltaif
0 Likes
Highlighted
Shopify Partner
7560 1042 2619

This is an accepted solution.

Hello, @Blueskiesskiesa 

Welcome to the Shopify community!
and Thanks for your Good question.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

 

body.password-template {
 background-color: transparent;
  background: url({{ 'nnatural_scrub_background.jpg' | asset_url }});
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

 

 

 

also, please check attachment this flow step

Design Sky _ Edit _ Narrative _ Shopify.png

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
2 Likes
Highlighted
Tourist
5 0 3
1 Like
Highlighted
Tourist
5 0 3

It did not work

0 Likes
Highlighted
Tourist
5 0 3

I have:

.password-html {
//background-color: $color-main-bg;
background: url({{ 'nnatural_scrub_background.jpg' | asset_url }});
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

0 Likes
Highlighted
Shopify Partner
7560 1042 2619

@Blueskiesskiesa 

Yes, i have update my above code can you please read again proper li ignore attachment 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
2 Likes
Highlighted
Tourist
5 0 3

Thank you so much!!

0 Likes
Highlighted
Shopify Partner
7560 1042 2619

@Blueskiesskiesa 

Thanks for your support and your compliments.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
Highlighted
Tourist
3 0 0

Is there an easier way  to find that one line of code where we place the password background image?

There are 14,000 lines I'm looking at lol

0 Likes