Age Gate loading weird

Hi @swaps4 ,

It’s not loaded the CSS.

First check the option “Layout (Use plugin style on the front end)” is checked in the Age Gate -> Appearance settings.

If it is, clear any caches and if you have anything that concatenates your css/js files, purge that too.

Hope that works

Thanks
Phil

Hi @philsbury,

Thank you for the swift response.

I already have that option enabled.

Here’s a closer look at my settings.

For cache I use WP Rocket, Redis, and Cloudflare. I purged everything during testing and nothing solved the issues.

Thanks.

The settings all look good. Can you re-enable the plugin for a few minutes so I can have a look and see if I can work it out?

Thanks
Phil

Hi @philsbury,

I’ve re-enabled it.

Please give it a quick look as I don’t want to annoy my users too much.

Thanks!

Hi @swaps4 – seems to work for me on this url: https://www.kaguragames.com/patch/

Do you see the same, or have anywhere where’s it’s not displayed correctly?

I’ve had multiple people test and it appears to only happen on the home page.

Can you test there? I wasn’t getting it myself but then I tried different browsers and it happened (Edge / Opera GX) I normally use Chrome.

I do see it now on the home page. Definitely something in a cache somewhere:

https://www.kaguragames.com/ – displays wrong
https://www.kaguragames.com/?v=12345 – displays right (?v etc to do a cache bust)

viewing the source of the second one, I can see <link rel='stylesheet' id='age-gate-css' href='https://www.kaguragames.com/wp-content/plugins/age-gate/dist/main.css?ver=3.5.2' type='text/css' media='all' />

on the first all the css is missing

I’d try disabling WPRocket as a temporary thing to see if that fixes it not showing and if it does, we know that’s at least part of the issue

Thanks
Phil

Hi @philsbury,

Due to the sheer amount of traffic, I don’t want to risk disabling WPRocket as it’ll affect the website heavily.

WPRocket has an area for excluded JavaScript files and Excluded CSS Files. Is there anything I can add here related to Age Gate to see if it fixes it?

I think WP Rocket also has a “Remove unused css” feature, which may remove the age gate styles as it’s not on the page at server runtime, might also be worth looking at

Thanks
Phil

Hi @philsbury,

Yes, I do use Remove Unused CSS.

There is a CSS Safelist area – What should I add here?

Hi @philsbury,

In the safelist you’d want to add /wp-content/plugins/age-gate/dist/(.*).css

Hopefully that resolves it. You might need to get onto WP Rocket support if it doesn’t and get their input as its their feature (and I’m going to be offline for the evening soon!) but I’ll check back in to make sure it’s resolved

Thanks
Phil

Note: edited as I misread that you said there was a safelist!

• This reply was modified 4 weeks, 1 day ago by Phil.

Hi @philsbury,

I’ve added /wp-content/plugins/age-gate/dist/(.*).css to the safelist.

Just to verify, there’s no need to exclude cookies correct?

Thanks!

There shouldn’t be, that’s all handled in the javascript so is purely front end

Thanks
Phil

Hi @philsbury,

Thanks. Can you quickly check to see if you are getting the issue? All cache has been cleared.

Sorry for the bother.

Thanks!

Looking good for me on Chrome / Firefox / Safari / Edge / Brave!