Fixing Flashing Issue with Loader 3 Before Page Load | Relume Community

Fixing Flashing Issue with Loader 3 Before Page Load

With Loader 3 I am having a problem with it flashing the page before the loader shows, I do have .preloader { display: flex !important; } applied but problem persists

13 comments

Matt J.
·
Max W. would you mind sharing a read-only link?
Max W.
·
Thanks Matt J. here https://preview.webflow.com/preview/anchoa-2023?utm_medium=preview_link&utm_source=des[…]3&preview=318a968660df71b3422ac24c5cad4534&workflow=preview – and actually this is the project you helped me with a week or two ago [understanding a move to Relume components and CF2.1 without starting a new project]
🙌1
Matt J.
·
hmm guess I might need the published URL as well because I'm not seeing the flicker in the webflow designer preview.
❤️1
Max W.
·
sorry Matt J.! https://www.anchoamagazine.com/
Matt J.
·
really hard to troubleshoot since it barely happens but on the first load and only happens on the published site. I would try these things:
1.
Move the loader to the very top.
2.
Unlink it from the instance.
3.
Ensure that any images are eager load instead of lazy load within the loader.
4.
Make sure your custom CSS is within the custom code section <head> of the page.
The idea is to try to get the loader higher in the DOM so its the first thing loading before anything else. Especially the code that is supposed to show it before anything else.
Max W.
·
Thanks for looking at it Matt J. – I understand it’s hard to diagnose, thanks for explaining. It’s odd, I see it flash more regularly than only the first load. I’ll go through your step though – to check “.preloader { display: flex !important; } ” is the only custom CSS to go within the custom code section <head> of the page?
Matt J.
·
Oh also that class might not be right!
Matt J.
·
.loader3_component { display: flex !important; }
this is the custom code that should go in the head
Matt J.
·
pretty sure anyway - there's no preloader class in your project
Matt J.
·
nothing you did wrong here really its just the instructions were not made specifically for loader3
Matt J.
·
and we've had so many other issues with this loader that I neglected to check basics first
Max W.
·
D’ooooh! That’s on me really isn’t it, I didn’t understand the instruction was to change it to the class of the loader you’re using. They all work now, no flash! p.s. “!important!” I added that and it actually breaks the whole thing
Max W.
·
Thanks again Matt J.