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

Solved

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

JayFinlay
Tourist
11 0 2

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

 

thumbnail_IMG_9207.jpgthumbnail_IMG_9208.jpg

Accepted Solution (1)

BSS-TekLabs
Shopify Partner
608 174 205

This is an accepted solution.

@JayFinlay 

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

step.png

- 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:

BSSTekLabs_0-1719922124312.png

 

 

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

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

View solution in original post

Replies 3 (3)

Moeed
Shopify Partner
4361 1123 1380

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


 

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
JayFinlay
Tourist
11 0 2

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
Shopify Partner
608 174 205

This is an accepted solution.

@JayFinlay 

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

step.png

- 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:

BSSTekLabs_0-1719922124312.png

 

 

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

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency