[Resolved] Hover menu toggle button on mobile view getting black color.

[Mark]

Ok, so currently I’m using WPRocket to speed up my website. When I turn on the option to combine my CSS files, my website speed increases a lot, the only problem is that my hover menu toggle button on mobile view is getting black.

Could someone help me with this problem?

It is possible to exclude some CSS Files for combining. But I’m not sure of the right CSS file.

Besides this error, what is your opinion and experience about using WPRocket to speed up WordPress?

Like to hear from you,

Mark

[Leo]

Hi there,

Can you disable the caching plugin(s) so I can see the source of the code?

I’m not sure why using the caching plugin would create this problem.

Here is our optimizing tips: https://generatepress.com/fastest-wordpress-theme/

You should be able to find similar CSS options in WP Rockets as well.

[Mark]

Hi Leo,

Thanks for your message.

Yes of course. I disabled the combining CSS option. Now the mobile toggle button is working fine, however, the speed is less

Like to hear from you,

Mark

[Leo]

Hmm unfortunately I don’t think there is a solution for that.

I can try to overwrite it with some CSS but I suspect activating that option created more than just that problem.

[Mark]

Hmm that’s unfortunate to hear. Speed is important, but functionality is more important. I don’t want to cause any problems on my site, haha

Is there a safe way to combine CSS files (Combine CSS merges all your files into 1, reducing HTTP requests)

We could not fix it with excluding certain CSS files?

Like to hear from you 🙂

Mark

[Leo]

Your site already loads really fast when I run it through GTMetrix.

I don’t believe WP Rockets has options to exclude certain CSS files but might be worth checking with their support 🙂

[Leo]

I can try to overwrite the black with some CSS if you’d like as well.

Maybe that’s the only problem?

Let me know 🙂

[Mark]

Leo,

Thanks again!

“I don’t believe WP Rockets has options to exclude certain CSS files but might be worth checking with their support” -> Yes, there is an option to exclude certain CSS files, but I have no clue which one we should exclude and if this will help.

Well on the surface it looks like that’s the only problem. I don’t know if there are problems on the backend of the website (I’m not a real specialist, haha) If it’s only this problem, I would really like to try it to override with a custom CSS 🙂

Mark

[Leo]

Hmm try excluding mobile.min from the theme and menu-logo.min and mobile-header.min (in the menu-plus folder).

I don’t think think this will work but worth a shot 🙂

[Mark]

Excluded the mobile.min and now its perfect!

Thanks Leo, you made my day!

Mark

[Mark]

One last thing, when I load my https://vanderwerffcontrolling.nl/blog/ page on mobile I see some padding on the left (open space) Do you know how I can solve this?

Mark

[Leo]

I believe that’s because of the caching plugin again.

Can you try disabling it and see if it’s indeed the issue?

Then we will find the next file to exclude.

Let me know 🙂

[Mark]

Yes, you are right it is ok when I turn off the CSS combining.

Like to hear from you the CSS 🙂

Mark

[Leo]

Try excluding this:
wp-content/plugins/gp-premium/blog/functions/css/style-min.css

[Mark]

Nope, didn’t work…

[Author]

Posts