Visible search bar on mobile

Hi there,

I wanted to ask if there is/will be any functionality to have the search bar visible by default in the header on mobile…

See link example

Hello,

You can add the search form into the top bar. Please do the following if you want to have it on a few or all the pages:

1. Create a custom sidebar in the Dashboard > Sidebar

2. Create HTML block and add Mega Menu widget chose the category menu https://xtemos.com/docs/woodmart/html-blocks-2/

3. Navigate to Appearance > Widgets and find the custom sidebar you have created and add the Search widget.

4. Create HTML block, add the Widgetized sidebar, chose your custom sidebar from the drop-down list.

5. Navigate to the Theme Settings > Header > Tob bar > enable and add ID shortcode.

You can show a search icon that would call the mobile menu where a search form provided. This option is in the Theme Settings > Header > Other. This would not require so many steps.

Best Regards

Hey,

Thank you for the information. I followed the steps but it only produced the search bar on desktop.

I currently have the search bar on desktop but would like it visible on mobile – below or within the main menu.

How would I be able to do this?

Thanks

Hello,

Please provide the site admin access to the private area.

Best Regards

Hi there,

Sure please find attached

Hello,

You need to insert the HTML block ID [html_block id="4229"] in this field https://prnt.sc/th0jsg

If you want to have the text FREE SHIPPING WORLDWIDE in the top bar, add a text block with this text to your Search Search widget HTML block.

Best Regards

Hi there,

Thank you for the information.

I have completed these steps however the search bar styling doesn’t really work as you can see from the attached screenshot. Any suggestions?

Another question about search function – is there a setting to ensure product categories show up as well as specific products?

Thanks

Image as referenced above attached –

Attachments:

You must be logged in to view attached files.

Hello,

Make top bar height 58 px min.

Please add this code to the Theme Settings > Custom CSS > Global:

body .topbar-wrapp .widget-title{
display:none;
}
.search-extended {
margin-top:7px;
}

Make sure you have added this widget: https://prnt.sc/thtsby

I have checked at my side and it works properly https://gyazo.com/a256594c7e4261247f63d6cf16235bab

I am checking your site and Searchbar mobile and see Product category widget it is the wrong widget.

Best Regards

[Author]

Posts