Product page - Help changing background color during loading of images/page - Ride theme

[JayFinlay]

When a user first clicks any product page, prior to it loading the images it briefly shows a dark blue box as seen in the photo. Once the images load it's fine and goes away but I can't find anywhere to change the loading/background color to white so it doesn't look off while the page loads in.

Any help would be great, it appears I am useless at shopify.

My website is https://downunderthunder.com.au

[Moeed]

Hey @JayFinlay 

I'm not exactly sure if this one would work or not but you may try this code

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
.product-media-container.constrain-height.media-fit-contain {
    background: white !important;
}
</style>

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[JayFinlay]

Unfortunately that didn't work! Thank you for giving it a shot though. It does seem to load quicker but the blue is still there.

[BSS-TekLabs · Accepted solution]

@JayFinlay 

- Here is the solution for you
- Please follow these steps:

 

- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.global-media-settings {
     background: white !important;
    background-color: white !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.