Skip to main content
added 138 characters in body
Source Link
Abhishek Tripathi
  • 2.9k
  • 2
  • 19
  • 37

Your search is working but not letting you click into it because one class is added into it that is ui-menu-item & that because it is been added into catalog.topnav block.So the jsjs (menu.js) of this adds ui-menu-item to it look the below code (You can check it by inspect element in your browser).

<div class="block block-search ui-menu-item" role="presentation">

When you remove class ui-menu-item from this dive it will work but it is not feasible there when you add this to the catalog.topnav so better would be add this code into your default.xml file

<move element="top.search" destination="store.menu" after="catalog.topnav"/>

Instead of the code you added to it & just target your <div class="block block-search"> there & add a css for it like this

.block.block-search {display: block;}

For better look & feel do adjust it with your own css.

Note: While you are doing this make sure your cache is disable or run the below command to see the output

Do this changes by creating your own theme instead of editing the core files it is not a best practice for magento development.

php bin/magento cache:flush

Your search is working but not letting you click into it because one class is added into it that is ui-menu-item & that because it is been added into catalog.topnav block.So the js of this adds ui-menu-item to it look the below code (You can check it by inspect element in your browser).

<div class="block block-search ui-menu-item" role="presentation">

When you remove class ui-menu-item from this dive it will work but it is not feasible there when you add this to the catalog.topnav so better would be add this code into your default.xml file

<move element="top.search" destination="store.menu" after="catalog.topnav"/>

Instead of the code you added to it & just target your <div class="block block-search"> there & add a css for it like this

.block.block-search {display: block;}

For better look & feel do adjust it with your own css.

Note: While you are doing this make sure your cache is disable or run the below command to see the output

php bin/magento cache:flush

Your search is working but not letting you click into it because one class is added into it that is ui-menu-item & that because it is been added into catalog.topnav block.So the js (menu.js) of this adds ui-menu-item to it look the below code (You can check it by inspect element in your browser).

<div class="block block-search ui-menu-item" role="presentation">

When you remove class ui-menu-item from this dive it will work but it is not feasible there when you add this to the catalog.topnav so better would be add this code into your default.xml file

<move element="top.search" destination="store.menu" after="catalog.topnav"/>

Instead of the code you added to it & just target your <div class="block block-search"> there & add a css for it like this

.block.block-search {display: block;}

For better look & feel do adjust it with your own css.

Note: While you are doing this make sure your cache is disable or run the below command to see the output

Do this changes by creating your own theme instead of editing the core files it is not a best practice for magento development.

php bin/magento cache:flush
Source Link
Abhishek Tripathi
  • 2.9k
  • 2
  • 19
  • 37

Your search is working but not letting you click into it because one class is added into it that is ui-menu-item & that because it is been added into catalog.topnav block.So the js of this adds ui-menu-item to it look the below code (You can check it by inspect element in your browser).

<div class="block block-search ui-menu-item" role="presentation">

When you remove class ui-menu-item from this dive it will work but it is not feasible there when you add this to the catalog.topnav so better would be add this code into your default.xml file

<move element="top.search" destination="store.menu" after="catalog.topnav"/>

Instead of the code you added to it & just target your <div class="block block-search"> there & add a css for it like this

.block.block-search {display: block;}

For better look & feel do adjust it with your own css.

Note: While you are doing this make sure your cache is disable or run the below command to see the output

php bin/magento cache:flush