Remove Search Bar from header on Warehouse theme

Solved
KanikaJhala
Tourist
5 0 0

Hi,

I need help in removing the search bar from the header on the warehouse theme. Please tell me what part of the code needs to be changed for this. 

 

Accepted Solution (1)

Accepted Solutions
oscprofessional
Shopify Partner
9182 1561 1926

This is an accepted solution.

.search-bar__top-wrapper {
    display: none;
}


Hello
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87

View solution in original post

Replies 6 (6)
oscprofessional
Shopify Partner
9182 1561 1926

Hello,
Please share your site url.
So that i can check and let you know the exact solution here.

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
oscprofessional
Shopify Partner
9182 1561 1926

This is an accepted solution.

.search-bar__top-wrapper {
    display: none;
}


Hello
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87

View solution in original post

KanikaJhala
Tourist
5 0 0

Thanks so much works perfectly! Can you please also tell me how I can reduce the size of the search bar if I want to keep it visible?

The input field on the search bar is too wide, how can I reduce the width of that?

Thanks so much for your help!

oscprofessional
Shopify Partner
9182 1561 1926

okay,
You just have to paste the below code in Online store -> Theme ->Edit code ->Asset ->theme.scss.css

.header__search-bar-wrapper {
    flex: 0 0 auto;
    width: 34%; /*set width as you want*/
    margin: 0 auto;
}
If helpful then please Like and Accept Solution. Free Website Review and advice for sale from Hire us
Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO | Digital Marketing | Site Speed Optimization | Performance Site Audit
For Quick Chat Whats app | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
CamiC
Excursionist
32 0 13

Hi, this code also erase my search on the mobile, the icon is there but if I click I don't have the space to search. Is there any chance I can erase the search bar from the desktop but not on the mobile?