Hustle Popup and Slide-in Not Working on Mobile

Hello there @jonirauks

I just tested that in my Android 9 device and latest Chrome was working well with these popup/slide-in.

I’ve also another colleague of mine and tested in an iPhoneX device and it was still working well in both Chrome and Safari.

Can you please clear browser caches in your mobile and check again?
https://clear-my-cache.com/

Thank you,
Dimitris

Hi Dimitris,
Thank you for your response on this issue!
I cleared the browser cache on my iPhone 7 Plus, and unfortunately I’m still seeing the issue. I’m also seeing the same issues when testing on an iPhone 7 and an iPhone 6. However, the popup and slide-in are working on my laptop and tablet.

Here are my test results on the iPhone 7 Plus in Safari and Chrome:

On frugalthumb.com, or frugalthumb.com/subscribe –> click Subscribe –> FAIL: links to frugalthumb.com/subscribe instead of showing popup
On frugalthumb.com, or frugalthumb.com/subscribe –> click New? Start Here –> SUCCESS: shows slide-in

On frugalthumb.com/blog, frugalthumb.com/about, or frugalthumb.com/calendar –> click Subscribe –> FAIL: links to frugalthumb.com/subscribe instead of showing popup
On frugalthumb.com/blog, frugalthumb.com/about, or frugalthumb.com/calendar –> click New? Start Here –> FAIL: links to frugalthumb.com/# instead of showing slide-in

(Edge on the iPhone 7 Plus had different results/success in a few more scenarios, but still not working everywhere it should.)
All three browsers are updated with the latest versions on the phone.

Do you have any more ideas of what else I could try to get these hustle popups and slide-ins working on older phone operation systems?

Also worth noting is that I have a second slide-in that is working everywhere and it’s on a time delay (rather than a link to click).

Hi @jonirauks,

I had a closer look at your site and notice that on smaller screens (under 910 pixels) there’s another search icon that shows up, and that icon actually has 100% width and because of that, it goes over the subscribe link, and all other links in the same row actually.

Could you try applying the below CSS code that will change the width of the element so it doesn’t go over the other links and see if it works after that:

@media screen and (max-width: 910px) {
	.astm-search-menu-wrapper {
		width: initial;
	}
}

WordPress offers Custom CSS field inside Appearance > Customizer but if your theme disables this and it doesn’t have its own CSS field you may wish to use a child theme or a plugin like this one for this additional CSS. That way you’re protected when you come to upgrade.

Cheers,
Predrag

Hi Predrag,
I added the custom CSS to the site. Please let me know if it fixed the search icon width on smaller screens. I couldn’t replicate that particular issue.

I cleared my cache again and I am still having the problem with the “Subscribe” popup and the “New? Start Here” slide-in not working on mobile.

Thanks,
Joni

Hi @jonirauks

I just visited the site using Chrome on desktop (both regular mode and responsive with iPhone screen size set) and then my Android smartphone (both default browser and Chrome).

It seems to be working fine – I could trigger and see the popup/slide-in, fitting well withing the screen and the search icon was visible and working (tapping on it opened a search field).

Unfortunately, I don’t have any real iPhone at hand to test with but on Android it seems to be working fine now, unless I missed some point.

Best regards,
Adam

Hello @jonirauks

I went ahead and checked the site from an iPhone with Safari.

I see the New? Start Here works like a charm on the safari browser but the Subsribe button would link to the subscribe page as it has an anchor hyperlink link in it. The popup would work if you replace the link with #. Please have a look at the screenshot where actually that need a change.

https://monosnap.com/file/diAih8t9KSiNBgXj5NzcXYZVupg4Dt

I hope this should resolve your issue. Please let me know if that works for you. I am looking forward to hearing from you.

Regards,
Prathamesh Palve