How can I implement lazy loading on the Debut theme?

has- · ‎04-09-2022

please someone help me in adding lazy loading on Debut theme. I have added lazysizes.min.js Asset but couldn't find it in Theme . liquid File . i just find lazysizes.js

AvadaCommerce · ‎04-09-2022

Hi @has- ,

You can try copying the code of lazysize.min.js, paste it at the end of lazysizes.js

Hope it can help you,

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

banned

MS_WEB_DESIGNER · ‎04-12-2022

Hi @has-

Welcome to the Shopify Community!

I am Alex From MS Web Designer (Top Rated Shopify Certified Experts and eCommerce Consultant from Singapore ) I helped 1000+ Shopify Store owners to Optimize their website loading speed for both mobile and desktop and increase their conversion rate.

I will love to help you with some experts feedback here

- Kindly Provide your Store Url,
- Also Mention Which Shopify theme you are using

- How many Apps you are using?

Note: If your store is protected with ‘store Font password’ please Send it here or DM me.

If you have any concerns feel free to ask me!

Regards,
Alex

banned

Cedcommerce · ‎04-27-2022

Hi @has-

To add lazy loading in your theme, you can follow these steps -

1. Spend sometime and read this documentation carefully.
2. Then upload the lazysize.min.js in your theme’s asset folder.
3. Include this script in theme.liquid [inside <head> tag] {{‘lazysizes.min.js’ | asset_URL | script_tag}}
4. Then apply all the changes for images and other files based on documentation.

For eg,
<img
data-sizes=”auto”
data-src=”image2.jpg”
data-scrset=”image1.jpg 300w,
Image2.jpg 600w,
Image3.jpg 900w” class=”lazyload” />

Try doing this and we are sure you will be able to add lazy loading in your theme. In case you need assistance, feel free to drop us a message and one of our experts will assist you with it.

Hope it helps!
Thank You,
Team CedCommerce.

CedCommerce || Shopify Expert
- Let us know if our reply is helpful for you. Like it.
- Was your question answered? Mark it as an accepted solution.
- For further discussion contact: Email ID- apps@cedcommerce.com
- Whatsapp:- Join Here

How can I implement lazy loading on the Debut theme?

How can I implement lazy loading on the Debut theme?

Community Blog Articles