Why isn't my preloader code functioning in theme.liquid file?

Store Design
1

I have added the preloader code to my theme.liquid file in the header section but it’s not working.

preloader.JPG
preloader.JPG903×456 62.7 KB

1 Like
2

@KetanKumar @WoodyDev plz help

1 Like
3

@rehansaeed

{% if template contains 'product' %}
    
  {% endif %}

Try out this code.

This will, help you.

4

@SpeedyDev

I want to show the brand logo (preloader) on every page of the website, This will not work

5

@rehansaeed

Add your brand logo url on href

6

@SpeedyDev not working

7

@rehansaeed

can you try this way

https://codepen.io/tag/loading-screen

8

hi @rehansaeed

please follow the steps carefully

1. Add the following code to the head section of theme file

2. Add the following code just after the body tag
1 Like
9

@Ahsan_ANC it worked thanks

10

This worked for me, but it significantly reduced my pagespeed insights scoring?
How can I optimise this code for better performance?

Thanks

11

Ah, I’m going to reply to my own comment here(…)

Note to all, ensure your preloader .gif is no larger than 150x150 as this will cause very significant “Largest Contentful Paint Element” delays.

I improved my mobile speed from 44/100 to 66/100 by simply resizing my .gif :slightly_smiling_face:
Desktop is at 91/100 so that’s great…

Thanks