Header Logo and gallery photos not loading on Debut theme

Header Logo and gallery photos not loading on Debut theme

vpaskaleva
Tourist
16 0 1

Hi! I have a problem with the loading of the pictures of a Debut theme website I am helping a friend with. 

The header logo only shows in full once you scroll a little.

There is a similar problem with the product photos, except the main photo, on the product page. Initially, it shows as an empty rectangle. Once you move the mouse around, the full gallery shows. I welcome any advice! Thank you!

Replies 5 (5)
vpaskaleva
Tourist
16 0 1

Yes please!

Artzen_tech
Shopify Partner
555 114 111

Hi @vpaskaleva 

In your header.liquid or theme.liquid, look for how the logo is rendered. Shopify uses the lazyload class like this:

<img src="{{ logo | img_url: '200x' }}" alt="{{ shop.name }}" class="lazyload">

👉 Change it to:

<img src="{{ logo | img_url: '200x' }}" alt="{{ shop.name }}">



This disables lazy loading for the logo, ensuring it loads immediately.

Let me know if need further assistance
Regards,
Artzen Technologies


If helpful, please Like and Accept this Solution to help others
Artzen Technologies | A Shopify Development Agency
WhatsApp - 9877983930

Book FREE CONSULTATION who want to migrate to Shopify or want to start an eCommerce business with Shopify
vpaskaleva
Tourist
16 0 1

Thanks! But it's not working. Here is a link to the website to see: https://www.northumbriancandleworks.co.uk/

tim
Shopify Partner
4249 483 1560

This is a result of speed optimization, most probably by SpeedBostr app.

The strategy is to output an image with "width" and "height" attributes set to 1. I guess, browser would not load this image.

 

Then immediately on load, check images in viewport and remove these attributes to force image loading.

Then, when you scroll, remove the attributes from all images.

 

However, this does not work properly -- for whatever reason first step does not work properly.

And while doing that, they also ruined theme native lazyloading....

 

Unfortunately, I can't suggest anything -- I am not familiar with the app settings and whether it's possible to undo these changes...

It would be possible to repair manually, but ned to see the code.

 

You can try reaching to the SpeedBoostr people and ask for help, even threaten them with bad review, but ...

 

Frankly, I believe your time is probably better spent moving to a modern theme -- they would be faster by design and offer seriously more configuration options and flexibility.

 

 

If my post is helpful, consider liking it -- it will help others with similar problem to find a solution.
I can be reached via e-mail tairli@yahoo.com
vpaskaleva
Tourist
16 0 1

I uninstalled the app, but it is still happening...