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
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]
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:
Move the loader to the very top.
Unlink it from the instance.
Ensure that any images are eager load instead of lazy load within the loader.
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.
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?
Oh also that class might not be right!
.loader3_component { display: flex !important; }
this is the custom code that should go in the head
pretty sure anyway - there's no preloader class in your project
nothing you did wrong here really its just the instructions were not made specifically for loader3
and we've had so many other issues with this loader that I neglected to check basics first
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