Preloader opacity

Hi guys

I was wondering how to make preloader background semi transparent so when navigating from one page to another you still could see through. I hope you understand what I mean. For instance I am at the Home page and I click on About us. So what I wanna see while it’s loading is Home page with 50% transparent white overlay. Meanwhile the spinner itself should be at its full opacity

I’m not sure how exactly it’s done but I’ve seen on some websites and I really love it

Hello there,

To accomplish it, try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

.preloader {
  opacity: 0.3;
}

Regards,
Kharis

So simple. It seems to work but doesn’t really look as good as I expected.

Thanks!

Hello there,

Or try this code to only change the white background color opacity.

    .preloader {
      background-color: rgba(255, 255, 255, 0.2);
    }

Regards,
Kharis