Venture Theme Search Bar

Solved
YW3
Tourist
5 0 2

Hello, 

I am currently using the Venture theme and would like the search bar to appear as it does on the website below. 

1. With a black outline 2."Search" text to appear in the box, and 3. the search bar to stay even when not clicked. 

https://www.bedbathandbeyond.ca/store

 

I am very inexperienced with CSS and have tried to adjust myself, to no avail. 

 

My site

PW: iareug

 

Thank you

 

KetanKumar
Shopify Partner
14170 1650 5092

Hello, @YW3 

Thanks for post

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste bellow code in the bottom of the file

.site-header__search-input {
border: 1px solid;
background: transparent;
width: 250px;
padding: 10px 35px 10px 10px;
}
.site-header__search-submit {
z-index: 1;
}

if you have change text in search bar please check this screen short.
Design Sky _ Edit _ Venture _ Shopify.pngSearch – York & Worth.png

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
YW3
Tourist
5 0 2

Hello, Ketan 

 

Thank you for your quick reply. I posted the code in the bottom of the theme.scss.liquid file but the search bar remains the same. 

 

See link in previous post.

 

Thanks again, 

KetanKumar
Shopify Partner
14170 1650 5092

This is an accepted solution.

can you please update this code

.site-header__search-input {
border: 1px solid;
background: transparent;
width: 250px;
padding: 10px 35px 10px 10px;
opacity: 1;
}
.site-header__search-submit {
z-index: 1;
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
YW3
Tourist
5 0 2

Works perfect! Thank you so much. 

 

All the best, 

 

 

0 Likes
santiagoaca
Tourist
3 0 1

Hi kumar,

I've been trying to insert a new search bar to my SUPPLY theme, right now I have the default search bar, But would like to add a customizable search bar something like amazon's search bar but using different colors www.amazon.com

Thanks

KetanKumar
Shopify Partner
14170 1650 5092

@santiagoaca 

Thanks for post.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
santiagoaca
Tourist
3 0 1
KetanKumar
Shopify Partner
14170 1650 5092

@santiagoaca 

Thanks for URL.

do you mean like this?

Wizard Merch.png

 

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
0 Likes
santiagoaca
Tourist
3 0 1
Yes just like that, but could I change the size? Making it longer, and how could I move the different language tab to re right side next to de "sing in," and account text
0 Likes