Mobile menu not working on Hikashop category pages

  • Posts: 64
  • Thank you received: 7
  • Hikashop Business
2 years 5 months ago #337092

-- HikaShop version -- : 4.4.4
-- Joomla version -- : 3.10.3
-- PHP version -- : 7.4
-- Browser(s) name and version -- : safari and firefox and chrome
-- Error-message(debug-mod must be tuned on) -- : No error message visible

After updating to the latest Hikashop I noticed sales have gone down. After doing some research I found out that our mobile menu is not responding directly on the category pages, mainly after scrolling down on the page. When you stay at the beginning of the page it usually works with the first click but scrolling down it takes 3/4 clicks before the mobile menu works. Strangely enough it doesn't seem to be the case on the product pages only on the category pages. Can't figure it out and help will be very much appreciated.

Please Log in or Create an account to join the conversation.

  • Posts: 81481
  • Thank you received: 13062
  • MODERATOR
2 years 5 months ago #337098

Hi,

I don't see any problem with the menu on mobile. It appears directly when I touch it and then I can directly touch on a link in it.
Which part isn't working for you ? And do you confirm the issue with different browsers ?
Also, did you notice a drop on the users accessing the website (with google analytics or a similar tool) ? It could be related to SEO, and thus, people not finding your website rather than the shop itself not working.

Please Log in or Create an account to join the conversation.

  • Posts: 64
  • Thank you received: 7
  • Hikashop Business
2 years 5 months ago #337108

Thanks for the reply.
You have to scroll down the page first. When you stay on the top of the page, it works fine. I have tested this with different browsers. It's mainly chrome and safari (on mobile) that give the problem. Also tested it on different devices.

Visitors are the same so there is no problem there. I mainly noticed the high bounce rate on the Hikashop category pages, that's when I noticed the problem.

Please Log in or Create an account to join the conversation.

  • Posts: 81481
  • Thank you received: 13062
  • MODERATOR
2 years 5 months ago #337110

Hi,

I tried with Chrome on my Android phone and I don't see a difference with your menu, whether I scroll first or not. In both cases it works fine.
I don't have Safari so I can't check there.
Could you maybe record a video of the problem ?
Maybe I'm missing something.

Please Log in or Create an account to join the conversation.

  • Posts: 64
  • Thank you received: 7
  • Hikashop Business
2 years 5 months ago #337125

The problem is that the mobile menu doesn't work, so making a video doesn't show anything since nothing is happening. I have tested it on friends samsung and Huwei and indeed no problem on those devices. I have just asked 5 different friends with iPhones (8,10,11 and 12) and they all have the same problem in Safari and Chrome. When on the 4 Hikashop category pages on my website the mobile menu works after 3 to 4 clicks. I have just installed jquery easy profile and that does solve the problem with the mobile menu when I set it to jquery + mobile and choose include component Hikashop. The only problem is when I do that, the products don't load (url doesn't work) when you click on them. It just shows the loading gif without anything else happening. And when I do that no other button works anymore and I have to reload the page. When I exclude Hikashop component from jquery easy nothing changes. With any other component or template selected, nothing changes and the problem is still there. It only changes when I include Hikashop. So it is indeed a Hikashop issue. But how do I fix this, or use jquery easy and fix the linking to the products?

Please Log in or Create an account to join the conversation.

  • Posts: 64
  • Thank you received: 7
  • Hikashop Business
2 years 5 months ago #337126

I have just checked analytics and it does explain why the sales have gone down. 60% of my cutomers use an iphone.

Please Log in or Create an account to join the conversation.

  • Posts: 81481
  • Thank you received: 13062
  • MODERATOR
2 years 5 months ago #337127

Hi,

I did some tests on Safari with browserstack.com and I did see that sometimes, when I click on the menu icon to bring it out, it doesn't open and I have to click several times.
However, the browser's javascript console doesn't display any error when that happens.
I also can't check the javascript code on the page since you're using JCH Optimize and all the JS is compressed together, making it unreadable.
I can't say that it is or it is not a HikaShop issue at the time. However, seeing that the issue is in the menu system, it doesn't seem like it.
It's probably more of a javascript library conflict and using jquery easy is a good idea. But you need to make sure you deactivate JCH Optimize when you do your tests and configure jquery easy since otherwise, JCH Optimize will mess up the tests as long as its cache is not cleared each time, and even so, since it also concatenate jquery's code with the rest of the javascript, jquery easy might not be able to find jquery's code and properly handle it.
I would recommend to turn off JCH Optimize for now so that we can better understand the situation and that you can properly test jquery easy.

Please Log in or Create an account to join the conversation.

  • Posts: 64
  • Thank you received: 7
  • Hikashop Business
2 years 5 months ago #337131

I have indeed tried that, but I just don't see any javascript errors even without JCH on. I have turned it off for these pages, maybe you can see what is going on. Any idea as to what to do with jquery easy blocking the product urls when clicking on a product? I don't see any script loading when you click on a product (correct?) so I don't get the gif loading image and not going to the product page.

Please Log in or Create an account to join the conversation.

  • Posts: 81481
  • Thank you received: 13062
  • MODERATOR
2 years 5 months ago #337149

Hi,

What I can see is that you only have one jquery loaded in your page headers, joomla's.
So I don't see why using jquery easy would help nor change anything to the problem.
And as you say, I don't see any error in the console.
And yes, the links to the product details page are just normal HTML "a" tags (normal URLs), without any script on them, so I don't see why turning on or off jquery easy would change anything for them.
The only reasons I can see are:
- that some other transparent HTML element goes over the main area where the links are and thus, when you think you click on the links, you actually click on that transparent HTML element and not the URL, and that's why nothing happens. I might be able to look into it with browserstack.com but I need to be able to see the problem with jquery easy activated. Maybe you could provide a backend access so that I could activate it while doing my tests without breaking the product details page links for several hours?
- some javascript code catches the click and cancels it for some reason. In that case, it will be hard to debug as it could come from anything.
I would however recommend you report the issue with your template / menu provider as the code to change is probably in the javascript code there.

Please Log in or Create an account to join the conversation.

  • Posts: 64
  • Thank you received: 7
  • Hikashop Business
2 years 5 months ago #337155

Hi Nicolas,

Thanks for the trouble!
I also don't get why using jquery is working, but it does solve the menu issue.

This message contains confidential information


I have disabled the fixed header in the template for now because it's causing the visitors to leave. So if you want to test, you would need to turn that on in the template settings
This message contains confidential information

Please Log in or Create an account to join the conversation.

  • Posts: 81481
  • Thank you received: 13062
  • MODERATOR
2 years 5 months ago #337180

Hi,

So I've found what is the issue with the links when jquery mobile is activated.
It's because jquery mobile will catch all the clicks as it tries to preload the HTML of the links and then feed the browser the new content to make the pages load faster.
This doesn't work because there is a javascript error linked to a conflict between jquery mobile and the Advanced date picker system (which also relies on jquery), and thus when you click on a link you don't get anything beside the loading gif.
So using jquery mobile is not a solution.
Besides, the menu might work with it just because of the javascript error during the loading of the page which stops the rest of the javascript code after it from being run and so even if that conflict was removed, it might just lead to the menu issue even with jquery mobile activated (most likely result in my opinion).
The best would be to debug the javascript of the mobile menu mechanism to see what's going on when a link there is clicked.
However, even with JCH Optimize disabled, the javascript of the template is still compressed, making it unreadable.
The javascript of your template is also not my expertise.
The best would be for the template provider to look into it as I don't know what to do and I might just spend days on it without any result.

Please Log in or Create an account to join the conversation.

Time to create page: 0.074 seconds
Powered by Kunena Forum