Jump to content

How to use/move quick search box module into top horizontal menu bar


Recommended Posts

I want to deactivate search in top horizontal module then use quick search box module instead.

In other words I want to replace search box in top horizontal module with quick search box module instead.

The reason I prefer quick search box over top horizontal menu's search box is that the quick search box has more advanced function like search suggestion.

 

So is there a way to integrate and position quick search box module into top horizontal menu bar?

Thank you in advance for your help.

  • Like 1
Link to comment
Share on other sites

You should do it by the way I told you on topic#2

 

Go on your back-office on TAB modules -> modules -> search for blocktopmenu -> edit -> Check the search box (s. screen) -> save .

 

post-741527-0-82821700-1433319189_thumb.jpg

 

Disable than after the "quicksearchblock" module to don't show it twice.

 

 

Clear than after cache of your browser and smarty cache (Tab "advanced parameters -> performance -> on top button "clear cache"). For to clear your borwser cache: Key F5 on your keyboard.

Edited by selectshop.at (see edit history)
Link to comment
Share on other sites

Thank you for your help.

But I did what topic 2 suggested and disabled quick search box so I only have one search box within top horizontal menu bar.

My site with only one search box in top horizontal menu bar. http://www.kocamoca.com/en/

 

Problem is the top horizontal menu search box does not have search suggestion/autocomplete function. How do you implement this function to top horizontal menu search box?

 

* FYI please refer to below explanation and this below function is what I need to have.

As you type in the search box, you can find information quickly by seeing search predictions that might have words to the search terms you're typing.

 

autocomplete.jpg

 

THank you.

Link to comment
Share on other sites

  • 2 weeks later...

Hi,

 

I also would like to do what cnpark70 is trying to accomplish.  Vekia you hit it on the head with your illustration.  I am trying to do exactly that.  I understand what selectshop.at is suggesting, but like cnpark70, that is not what I am trying to do.  I would like the exact look and functionality of the quicksearchblock but on the horizontal menu block.  Is there a way to do this?  I'm pretty sure it will be through code.

Link to comment
Share on other sites

This is right. Not possible in this case, because the search integrate on the bar is not dynamic. You can use only as it is. Or the module with dynamic search, or the non dynamic search integrated in the navigation. For to use the dynamic in the navigation bar the "top navigation menu" module should be adapted.

Edited by selectshop.at (see edit history)
Link to comment
Share on other sites

I am using ver 1.6.0.14 with default-bootstrap theme.

I like suggestion function of quick search box module but want to place it to the right next of top horizontal menu bar.

Can someone help me to hook the position of the quick search box into top horizontal menu?

http://www.kocamoca.com/en/

 

HI , I really liked the way you have adapted the deafult theme . i just wanted to ask how did you get the brands logos scrolling at the bottom?

Link to comment
Share on other sites

HI , I really liked the way you have adapted the deafult theme . i just wanted to ask how did you get the brands logos scrolling at the bottom?

There is a free manufacturers logo module on the forum free section:

 

https://www.prestashop.com/forums/topic/385105-manufacturers-slider-free-prestashop-module/

https://www.prestashop.com/forums/topic/203366-module-man-carousel-ps14-ps15-ps16-responsive/

 

and others....

I think the second link is in use on that page.

Edited by selectshop.at (see edit history)
Link to comment
Share on other sites

Thank you. David. I basically understand the idea and it should be the best way to have quick search block module integrated into blocktopmenu and replace the built in search.

Since I have no background in coding it will be difficult for me to apply your guide. I had no choice but had to go with the way of force positioning the quick search box. :(

Thanks anyways for your help.

Link to comment
Share on other sites

yeah i just made it for you.  Uninstall blocksearch and blocktopmenu.  

 

ftp into your server.  Go to modules section and rename folders blocktopmenu and blocksearch to blocktopmenuold and blocksearchold (this will effectively back them up/get them out of the way).

 

Load from your computer, my 2 modules attached to this message.

 

in /themes/default-bootstrap/modules/blocktopmenu rename the blocktopmenu.tpl to blocktopmenuold.tpl

unzip and put my blocktopmenu.tpl file there

 

go to 

/themes/default-bootstrap/css/modules/blocksearch/  and rename the blocksearch.css to blocksearch.css.old

put my attached blocksearch.css file there.

 

then go to the blocktopmenu module and turn on search if it is not on already.

 

Enjoy~!

 

 

 

 

This is for 1.6.0.14 versions tested with default-bootstrap, i did not test on 1.5 or with other themes.  The only thing you may have to do is alter the css file perhaps for other themes.

 

NOTE:  this is experimental and unfinished.  It is basically just instructional and should not be used in production unless you finish the code to work after 1 search on the page.  Initial search works, however subsequent search doesn't.  Probably a simple fix for it but i have not come up with it as I am too swamped with work.

 

NOTE2:  for those who have tried it, and got it working to find the search only works a couple times then stops with autosuggest, i noticed it seems to be tied to the site cache.  If i turn off cache and set force compile, it works flawlessly it appears.

blocksearch.zip

blocktopmenu.zip

blocktopmenu.tpl.zip

blocksearch.css

Edited by David Eschmeyer (see edit history)
  • Like 1
Link to comment
Share on other sites

David,

 

Thank you for your help.  I did everything you instructed above.  I also made sure blocktopmenu module was enabled.  You didn't mention if QuickSearch should be enabled or not.  But here are the results.

 

If QuickSearch is Disabled, I don't get any search option anywhere.

 

If QuickSearch is Enabled, I do get the search area but it isn't aligned with the horizontal navigation bar.  Here is a link for you to see:  http://23.235.212.207/

 

Do I need to clear any Cache or did I miss something?

 

Regards

Link to comment
Share on other sites

you had not installed the modules right, if you first uninstalled the old ones it should have unhooked the search box from that higher hook.  So once again, uninstall each module, log in with ftp and rename the folders.  

 

Go back to modules section of the store and "add a new module" with the plus button in the top right of the modules list page (do not simply click install button on the module in the list).  Then navigate to the ones you downloaded and select them, they will upload.  Once that is done then you can click the install button and it will install your new one.  Then do the other one the same.

  • Like 1
Link to comment
Share on other sites

David, I tried but I think I did incorrectly. quick search box was not showing up.

I am going to back up the site and retry.

This time I am going to hook the quick search box to displayTop and see if it shows up.

 

Really appreciate your help.

Link to comment
Share on other sites

  • 3 weeks later...

yeah i just made it for you.  Uninstall blocksearch and blocktopmenu.  

 

ftp into your server.  Go to modules section and rename folders blocktopmenu and blocksearch to blocktopmenuold and blocksearchold (this will effectively back them up/get them out of the way).

 

Load from your computer, my 2 modules attached to this message.

 

in /themes/default-bootstrap/modules/blocktopmenu rename the blocktopmenu.tpl to blocktopmenuold.tpl

unzip and put my blocktopmenu.tpl file there

 

go to 

/themes/default-bootstrap/css/modules/blocksearch/  and rename the blocksearch.css to blocksearch.css.old

put my attached blocksearch.css file there.

 

then go to the blocktopmenu module and turn on search if it is not on already.

 

Enjoy~!

Let me know if you have any difficulty.

Throw a like for me if this was helpful.

 

This is for 1.6 versions tested with default-bootstrap, i did not test on 1.5 or with other themes.  The only thing you may have to do is alter the css file perhaps for other themes.

Hello,

 

I also tryed this method and its was working very well in my last version of prestashop. Now i updated to 1.6.1.0 and it want work anymore. Unfotrunally i didnt made any backup of my web. http://www.gameshelf.eu/index.php? this is my web site. Maybe you can check it and help me. Thank you.

Link to comment
Share on other sites

Hello,

 

I also tryed this method and its was working very well in my last version of prestashop. Now i updated to 1.6.1.0 and it want work anymore. Unfotrunally i didnt made any backup of my web. http://www.gameshelf.eu/index.php? this is my web site. Maybe you can check it and help me. Thank you.

 

if you go to the modules and "delete" them then they will show up still and you can reinstall them by clicking install.  Since you deleted them the new install should be the fresh fetch from the web so you will be back to the original ones.  You may need to arrange position though.

 

also just so you know, all the modules can be gotten from github, or you can download a fresh copy of prestashop, unzip it and take the modules from the module folder, you just zip the folder... like "blocktopmenu" is the horizontal navbar menu, zip the folder and load it into your store.

Link to comment
Share on other sites

NOTE2:  for those who have tried it, and got it working to find the search only works a couple times then stops with autosuggest, i noticed it seems to be tied to the site cache.  If i clear and turn off cache and set force compile, it works flawlessly it appears.

 

I guess i have to look at caching in the 2 modules.

Edited by David Eschmeyer (see edit history)
Link to comment
Share on other sites

  • 8 months later...

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...