Hi, So I’m in the process of changing the background image of the password page for the Shopify theme Venture. So far, I’ve already added the image in the assets section as a png file. Then I was able to add the code at the bottom of my theme.scss.liquid.
By doing so, I was able to add the image I wanted, but it is formatted all the way wrong. Most of the image I uploaded I cannot see at all; it is way too big. What should I do to fix this issue?
Thank you for the sample of the code you are using. I’d be happy to help you configure this. Try replacing that code snippet with the one below, replacing the image asset name with your own:
I tested this on my own store and it appeared to work. Also, as a friendly reminder we always recommend duplicating your theme file before making any theme code changes so that you have a safe recovery point at all times.
Also, the venture theme is an older theme style that is no longer supported and won’t be receiving any additional updates. I would recommend reviewing some of our newer themes on the 2.0 architecture, customization is much easier with these themes. If you like Venture, you might also like our new Ride Theme or our Refresh Theme.
Hi thank you for the tip also regarding the venture theme. So i added that code you provided with the file name of my choice at the bottom of theme.scss.liquid but it made my password page pretty much blank. What did i do wrong?
I can’t say for sure. Have you made other changes to the code for the password page or installed any apps that do? I tested this on Venture 12.6.1 (no code changes otherwise) and it worked as expected.
I would test in a fresh copy of the theme to see if the issue still happens. If it doesn’t then you can confirm that there is some other code customization to the password page that is conflicting.
If you wish to undo any coding changes you have made to the password page template you can use the “recent changes” roll back option at the top of the theme code editor in that specific section.
Hmm, so I just tried adding the code in the duplicate theme, and I’m still having the same issue. The code is supposed to go in theme.scss.liquid. correct?
I did not make any changes to the actual pw page or download any apps. The only thing I did was what i stated above regarding adding the photo i wanted in the assets folder. Maybe i should try another theme
What are the size dimensions of the background image you are using? Have you tested with a different image?
Also, instead of uploading the image into the assets folder of the theme, please try uploading it into your FILES section and using the URL for the image in the theme code.
If you are able to, please also share a link to your online store password page so I can check and see if I can provide an alternate option for you.
Hi so i tried another photo that is a 3024x 2696 and nothing happened. The actual photo i want to use is the size 2500x 3531. Both photos are uploaded under the asset folder. You mentioned try uploading a photo under the files section, but im not sure where that is. I’m sorry im struggling here.
Upon further review, I am the one that needs to apologize! There is a mistake in the code I shared with you originally. There were some extra curly brackets in the background image line. Please try this code snippet instead. I tested using the browser inspect tool on your password page and it worked on my end!
When checking your password page link you sent and I can see there is a bit of broken code building up. There are two floating apostrophes in the upper left corner of the page.
Outside of the background image, have you made any coding changes to the password page, or are you using any design apps for your theme? If you do not have any other coding changes specific to the password page, I recommend rolling back your theme code to undo any changes. This will eliminate any broken code hanging around there. PLEASE make sure to create a backup copy of your theme file before making any coding changes.
Lastly, the FILES section in your admin is the place where your uploaded images and content go. Files uploaded here are then provided a direct URL link as well as access to them through various areas of the admin (example: product pictures). You can check these out in your admin, inside the right hand column under Content > Files.
Thank you for the update and for sticking with me through this process! So, I added the photo in my files section and copied and paste the link into the updated code you provided. Upon trying, it turned the page white, im sure it’s an error on my end. Does the link go inside where the photo name would be correct?
I also, tried just adding the name of the photo in the bracket, which ultimately ended in the same result, pw page turned white/blank. This is a huge head-scratcher. lol
I am sorry that it isn’t providing the same result on your end. I recommend reaching out to our authenticated support channel to see if this is something our theme support team can assist with further.
To access our authenticated support, please follow this link: Shopify Help Center. Next, you will want to follow the on screen prompts to sign in, choose your topic and issue and at the bottom of the help articles provided will be all available support options.