[Resolved] Mobile Menu and Desktop Image issues

[Hollee]

So I just switched to GP last night and I am absolutely loving it! It has totally sped up my site and I love the customization. I just have a couple of quick questions…

First, on mobile, when I click the menu, it slightly breaks until you scroll again. I think it has to do with a setting in WP-Rocket. Is there any way to fix it?

The bigger issue is that on desktop, my articles seem to be displaying very large full-size versions of the images, even though I set them to smaller versions in the post. Is this an issue with the theme? Or something else? I didn’t have this problem before.

Any help would be greatly appreciated! Thanks so much!!

[David]

Hi there,

i see the Mobile Nav is turning white as, yes the WP-Rocket is going overboard on combining CSS. You can try this CSS to fix that:

button.menu-toggle:hover {
    background-color: #000;
}

Your articles look like this to me:

https://www.useloom.com/share/2bd5757785eb43188f385094f593b3ec

[Hollee]

Thank you so much! The menu fix worked beautifully!

As far as the images, I noticed that it’s only on my newest post which leads me to believe that it isn’t a theme issue. Hmmmm….

Thanks again 🙂

[Hollee]

I figured out a work-around to the image thing 🙂

Thanks again!

[David]

Glad to be of help 🙂

[Kevin]

Hi David-

I just installed Wp-Rocket and I am having a similar issue as Hollee; on moible and tablet devices my three bar menu icon does not work (desktop it works fine) in any scenario:

https://www.koloans.com

I read your fix for her issue and wanted to confirm it might work for me (even though the menu doesn’t work at all on mobile/tablets) and the steps I should take to fix it (I have next to zero technical ability when it comes to websites):

Install – https://wordpress.org/plugins/simple-css/

After activation jut put the following code in and that’s it? Any chance I can break something?

button.menu-toggle:hover {
background-color: #000;
}

[Tom]

Hey Kevin,

You actually have a javascript error on your page causing the issue: https://www.screencast.com/t/picbRpwJN

Does the issue go away when WP Rocket is disabled? If so, it’s likely one of your plugins not playing well with the caching. You can deactivate them one by one to find the culprit.

[Kevin]

Thanks for the follow up Tom; much appreciated. So it appears the combining of JavaScript files is the issued within the WP Rocket plugin (sticky header and menu now work when that’s off).

The WP Rocket plugin has this as an option:

“Excluded Inline JavaScript
Specify patterns of inline JavaScript to be excluded from concatenation (one per line).

Any chance you know what I should put into the box so that the menu and sticky header gets” excluded?

Kevin

[David]

Hi there,

try excluding:

sticky.min.js

[Kevin]

That didn’t work however I tried un-installing the plugins again and found the one causing the issue (the mortgage calculator I use). I appreciate the help; been a real positive experience since purchasing the GP theme.

Thanks!
Kevin

[David]

Awesome – glad you to hear that.

[Author]

Posts