"Search" display

[leinad06]

Hello,

I can’t set the Ajax Search Pro plugin to appear at the top of every page / product. Can you help me?

Thanks!
Regards,
Dan

[Ernest Marcinko]

Hi,

Do you want to palce it into the site header?

You can use the search shortcode in a menu item, as well as if your theme has a widgetized area you can place the search widget there too.

[leinad06]

Hi,

Thank you for your prompt answer.

Yes, I want to include it in the site header. I tried both variants (short code and widget) and it’s not what I want. I used the short code in the sidebar, it’s ok. But in the header I can’t configure it to look the way I want it to. I chose, at the moment, the option to use it with the default theme settings (AVADA). For example, see the link: https://leinadcompany.ro/industria-textila/
Is there another option?

Regards,
Dan

[Ernest Marcinko]

Hi Dan,

And what exactly was the problem when you placed it to the header? If it was a styling/floating issue, maybe then I can suggest specific custom CSS or something to resolve those.

[leinad06]

This is the problem when I put the short code in the header. It does not stay in line with the menu (see attachment)

[Ernest Marcinko]

That looks like a simple vertical alignment related issue only. Can you please send a link to a page where this is visible. Based on that I might be able to suggest a custom CSS.

[leinad06]

https://leinadcompany.ro/industria-textila/

[Ernest Marcinko]

Try this:

li#menu-item-23494>a {
    display: none;
}

li#menu-item-23494 {
    height: 121px;
    line-height: 121px;
}

li#menu-item-23494 .asp_w_container {
    display: inline-block;
    vertical-align: middle;
}

This resulted in: https://i.imgur.com/bqtYwWB.png

However this custom CSS will only work with that menu element ID, I could not find any more specific class name on them. So if the menu item changes, this may no longer works.

[leinad06]

True, this will only work if the ID name is not changed. The problem is that the search bar is too short and difficult with long-name products. I’d be happy to find a way for the search bar to be somewhere in the header, 100% of the width of the page

If you click on the search icon on the right side of the navigation menu you will notice about how long I would like the search bar to be.
I am attaching a printscreen for example

[Ernest Marcinko]

Well, you could try perhaps the compact box layout mode. Using something like this as the configuration: https://i.imgur.com/q1tQr45.png
It might need to be experimented with – especially the top/right values at the bottom to get it in the correct position.

[leinad06]

Hi,

I will try this option and come back. I find it an interesting approach!

Thanks

[leinad06]

I tested the proposed solution. It’s not ok because the setting also affects the search bar in the sidebar

[Ernest Marcinko]

Try creating a new search bar for the header then, it will not affect the other one.

[leinad06]

Ok!
Thanks

[leinad06]

Hi,

I set up a new header search bar, I chose compact box layout mode. We made some custom CSS settings and we have this result https://leinadcompany.ro/industria-textila/. The problem is that when the search bar expands, the menu in the header changes. Can you recommend some custom CSS settings?

Thanks

[Author]

Posts