How to make top horizontal menu search function like quick search block (suggestion dropdown) ?

[cnpark70]

I am using ver. 1.0.6.14 default-bootstrap theme.

I enabled search bar in top horizontal menu module and remove the quick search block module.

Here is the issue, search bar in top horizontal module does not function like quick search block module with suggestion dropdown.

Is there a way to give search bar in top horizontal module suggestion function and submit search button?

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

 

Or If i can move quick search block to the right of Top Horizontal Menu on the same line, that would work too.

 

thank you

Edited June 1, 2015 by cnpark70 (see edit history)

[NemoPS]

Here
http://nemops.com/ajax-instant-search-prestashop-top-menu/#.VWwaX8_zrmg

[cnpark70]

Hi thanks for your help.

I checked the link but it is for version 1.5. I am now using version 1.6

Is there a way to move quick search box module into top horizontal menu bar?

This way I think is simpler.

Edited June 1, 2015 by cnpark70 (see edit history)

[vekia]

you're looking for something like i show below?

[cnpark70]

Yes that is exactly what I want.

[NemoPS]

Actually it works for 1.6 as well. Anyway, you can simply move it with some css, using position:absolute and manually adjusting it for each screen size

[cnpark70]

Hi nemo thank you again, It is just too much for me to handle. I watched and listened to your instruction but I am quite a newbie with very little understanding of coding.

I just copy and pasted thats about it.

So for me moving and positioning the quick search box is maybe easier for me which I don't have a clue either.

[cnpark70]

Nemo, Can you help me with positioning the quick search block. I have no idea where to start.

[NemoPS]

I would personally use Chrome's debug console.
open it up, right click on the search and inspect the element. Make sure it's the very outer wrapper of the box. Now add this style

 

position:absolute
right: 0;

top:0;

You'll see it moving. Adjust right and top till you're satisfied, then, without refreshing the page, copy those styles and paste them into the real blocksearch.css, or global.css, applying the rule to 
#search_block_top

 

[cnpark70]

Hi Nemo Thanks for your your help.

I added the code and the quick search box moved to right.

Now I just had to lower the position so it can align with top menu category.

So I put a number in top as below

 

#search_block_top {

  padding-top: 1px;
  position:absolute ;
  right: 0;
  top: 1; }

 

But the quick search box move right below the top horizontal menu's bottom line.

www.kocamoca.com

Even if I put small number like 1, quick search does not move down incrementally. It rather drops right below top horizontal.

Again I have no idea why its dropping so much low even if I give small number.

 

Any idea why it's doing it or help?

 

Thanks Nemo

Edited June 5, 2015 by cnpark70 (see edit history)

[NemoPS]

You need to use px as units when you set the position

[cnpark70]

Thank you nemo. Really saved my day. I have other minor adjustment to fix and have only 1 month before site launching.

Wish I had learned the coding.

Thank you so much again.

[cnpark70]

Hi nemo, I posted a topic and no one seems to know the solution for my problem with pop cart position.

I was wondering if you can help me again.

 

If you can, can you please refer to below topic I posted.

 

I am using version 1.0.6.14 default-bootstrap theme.

When you add to cart a pop up box saying Product successfully added to your shopping cart show up.

Here is the problem, the pop up box shows up too far low so the most of the box is cut off from the bottom.

It becomes worse when you scroll down to add product in 2nd row and below. The pop up box positioned so low that it is completely out of screen.

 

How can I move up the order congratulation box?

My site is http://www.kocamoca.com/en/

 

Thank you in advance for help

[NemoPS]

Hm, it's set with javascript

top: 625px;
 

So it might be a bit more complex to fix it. Ajax-cart.js (theme folder /js/blockcart)
 

var n = parseInt($(window).scrollTop()) + 'px';

 

$('.layer_cart_overlay').css('width','100%');

$('.layer_cart_overlay').css('height','100%');

$('.layer_cart_overlay').show();

$('#layer_cart').css({'top': n}).fadeIn('fast');

crossselling_serialScroll();

You might want to change "n" to a fixed value in px

[cnpark70]

Super super.Thank you it pops up right below top horizontal menu bar perfectly.

 

Thank you nemo

[cnpark70]

Hi nemo. Can I ask you for more help?

 

I posted a new topic asking for some help regarding how to set maximum number of products to show and also to set the height for cart block drop down list ( and add view all link at the bottom of the list) or add vertical scroll bar to appear when there are too many products. However, I am not getting any guide or help yet from anybody.

 

The reason for this request is that if there are too many products in the cart, the drop down cart list runs off the bottom of the screen and there is no way to see the rest of the products below the bottom of the screen. This started happening when I change the position from relative to fixed for header section (I need to keep this)

 

Thank you in advance again.

[NemoPS]

Hey, can you point me to your thread?

[cnpark70]

I am still having trouble displaying price and Add to wishilist button in viewed products block (left column and right column) and Add to wishlist button in new products block (left column and right column) and facially for product tabs ( new arrivals, popular, best seller) index page.

I posted this topic here for help.

https://www.prestashop.com/forums/topic/446574-how-to-display-price-and-add-to-wishlist-button-in-viewed-product-block-and-new-products-block/

 

My site is http://www.kocamoca.com/en/

Thanks again nemo for your help.

Edited June 11, 2015 by cnpark70 (see edit history)