Wordpress website on mobile : conflict between plugin and menu

Question

I have a problem with my Wordpress website : https://info.kiddizy.com/ when I use it with my mobile phone.

Two things you need to know first : 1) I installed a plugin to optimize the website (HTML Minifier) 2) I installed a plugin in order to have a searchbar (algolia search)

When HTML Minifier is activated, the menu doesn't work and when HTML Minifier is deactivated, it's the searchbar that doesn't work.

I think that there is a problem with js files. HTML Minifier may change the order of the execution and so it can be an explanation to the fact that in one case, the menu works and the other case, it's the search bar. But there is still the problem that the two things can't work together.

I found that we can fix a jquery conflict with the following code : $ = jQuery.noConflict();

I tried to add it but I think that I made a mistake because it doesn't work.

Could you help me please ?

Answer 1

I can see that there is a left: 200px css attribute that does not get updated when clicking on the menu.

It seems to me that these lines are added by you:

    div.nav-menu > ul {
      position:fixed;
      left:-200px; // this is responsble for hiding your menu
      top:60px;
      background-color:#ca385f;
      display: block;
      height:100%;
      margin-top:-3px;
      padding-left: 20px;
      width: 200px;
      z-index:999;
-webkit-animation-name: out; 
/* Chrome, Safari, Opera */-webkit-animation-duration: 0.5s; /* Chrome, Safari, Opera */animation-name: out;animation-duration: 0.5s;}

I would suggest first to reorder your menu list because even if I can reach the menu on the left side it's almost impossible for me to select the menu items I would like to visit.

Answer 2

In this case, I would recommend switching to the default search bar:

Admin page > Appearance > Search A search form for your site.

The one you used wasn't well optimized anyway: it was not responsive at all. You can still modify the style of this widget so it can look like the one you are using.

I'm not sure if the HTML minifier is wether on or off, but there is a lot of break line in the code base:

Probably in this case you won't need that plugin neather.

Answer 3

In fact, it was just a conflict with another plugin. I deleted all the files of this plugin and it worked well. Thank you for your help !