Ajax search pro mobile issue

[jihdistillh3alth29Participant]

Hey team – I’m having trouble with the mobile display of my newly installed Ajax Pro plugin. It’s working great on DT. But when I open my site in mobile, the search magnifier appears in the hamburger menu — and when I tap the magnifier it just closes the hamburger menu, leaving me no opportunity to search.

Can you help me resolve this bug?

James

[jihdistillh3alth29Participant]

Forgot to mention: Using the Divi theme. Attached is a screen recording of the mobile behavior on Chrome with an iPhone X.

Attachments:

You must be logged in to view attached files.

[Ernest MarcinkoKeymaster]

Hi,

Thanks for the details. Well, this is not exactly a plugin related issue, but the menu is programmed to close, when any of the items are clicked in it. It might be possible to bypass that via a custom code.

Try adding this custom code to the functions.php in your theme/child theme directory. Before editing, please make sure to have a full site back-up just in case!

add_filter( 'wp_footer', 'asp_try_fixing_menu_close' );
function asp_try_fixing_menu_close() {
	?>
	<script>
	jQuery(function($){
		$('.menu-item a').on('touchstart', (function(e){
			if ( $(this).find('.promagnifier').length > 0 ) {
				$(this).off();
			}
		}));
	});
	</script>
	<?php
}

After that, reloading the page and clearing the cache should do the trick.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[jihdistillh3alth29Participant]

Hi Ernest – Thanks for getting back to me on this. That hiccup in the mobile menu makes perfect now.

I added that code to functions.php, cleared cache on Safari and Chrome mobile, and reloaded the site, but unfortunately I’m still running into the same issue. Is there a specific location in functions.php that that code should be added? Or since the issue is occurring in the mobile nav, does it need to be re-oriented to the header element instead of wp_footer?

Appreciate your help.
James

[Ernest MarcinkoKeymaster]

Hi,

I see the code on the site footer, you put it to the correct location – the end of the functions.php file is perfectly fine, although it does not matter.
Maybe the menu is initialized later, after this code is executed, so it has no effect. Can you try this variation, I added a delay to it:

add_action( 'wp_footer', 'asp_try_fixing_menu_close', 99999999 );
function asp_try_fixing_menu_close() {
	?>
	<script>
	jQuery(function($){
		setTimeout(function(){
			$('.menu-item a').on('touchstart', (function(e){
				if ( $(this).find('.promagnifier').length > 0 ) {
					$(this).off();
				}
			}));
		}, 1500);
	});
	</script>
	<?php
}

I’m almost certain, that this will do it.

Best,
Ernest Marcinko
If you like my products, don't forget to rate them on codecanyon :)

[Author]

Posts