Re: Move logo to left and add search bar in the middle

Move logo to left and add search bar in the middle

Charming_Beads
Excursionist
27 0 7

Hello.

 

My site that I am building has a magnifying glass on the left that I know my eldery customer base will miss.

 

I am looking to get rid of that, move my logo to the left, and then have a nice big search bar in the centre.

 

Could someone please help?

 

Many thanks,

Paul

Replies 15 (15)
Charming_Beads
Excursionist
27 0 7

That would be great if you can put them on here?  Many thanks

Sangeetanahar
Explorer
541 36 69

hello @Charming_Beads 

can you send me the Website URL

thanks

Was I helpful?

Buy me a coffee



Want to modify or custom changes or bug fix on store . Or Need help with your store? Or -Want Complete Storefront
Email me [email protected] - Skype: live:sangeetarahuldhiman -Whatsapp: +917009811712
Checkout Some Free Sections Here
Charming_Beads
Excursionist
27 0 7

Hello - posted on this thread thanks

Tech_Coding
Shopify Partner
301 76 67

Hello @Charming_Beads 

would you like to share your store URL and password if any please.
so i can check and provide you possible solution for your question.

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Shopify UI Developer
Your Coffee Tips adds a little sweetness to my day.
Charming_Beads
Excursionist
27 0 7

Thanks - both are on the thread now 🙂

Made4uo-Ribe
Shopify Partner
8205 1972 2410

Hi @Charming_Beads 

Would you mind sharing your store URL? Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.
Charming_Beads
Excursionist
27 0 7

Hello - I put these details on the thread now ... thanks

Charming_Beads
Excursionist
27 0 7

Thanks all - so many replies!

 

My store url is Charming Beads (a2fdaa-db.myshopify.com) whilst I am building the shop, and password is zico2000.

 

Any help with the code or css would be massively appreciated.  I'm a bit of a novice when it comes to the coding ...

Charming_Beads
Excursionist
27 0 7

Thank you but I don't wish to be handing out email or putting it publicly here, and there is no way for me to DM you.

Made4uo-Ribe
Shopify Partner
8205 1972 2410

Thanks for the info. Just to clarify, the search bar is not sticky in the header—it only appears when you click the search icon. To make it sticky or stay visible on the header, a developer would need to implement the design. But if you just like to move the search icon to right and logo to left. 

Check for this one. 

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

 

@media only screen and (min-width: 749px){
.header--top-center {
        grid-template-areas:
        "heading  left-icons icons"
        "navigation navigation navigation";
    }
.header {
        grid-template-columns: 1fr;
    }
.header--top-center .header__heading-link, .header--top-center .header__heading {
        justify-self: left;
        padding-left: 20px;
}
}

 

And Save.

Result

Made4uoRibe_1-1725554108863.png

 

 

 

 

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.
Charming_Beads
Excursionist
27 0 7

Okay well thanks for trying.  But I really need the big search box in the middle. Not sure what to do now.

Made4uo-Ribe
Shopify Partner
8205 1972 2410

When you click the search icon, that is the time the search bar come out. It needs to edits some code in the backend to make the bar visible and no need the icon. 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
Need THEME UPDATES but has custom codes? No worries, contact us for affordable price.
Charming_Beads
Excursionist
27 0 7

Sure thanks - I get that.  I just don;t know how to edit the code in the backend to make it part of the header.  I'll keep researching and see what I can come up with.  Thanks again for your help.

Charming_Beads
Excursionist
27 0 7

I do thank you for that though, and I have implemented it as a half way solution as it is still a lot better than before 🙂

EFOLI-Syn
Shopify Partner
84 1 0

Hello @Charming_Beads,

Please share your website's URL so that I can check 

Syn | eFoli
-Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Checkout our apps:Inkybay || MultiVariants