Refresh Theme - I simply want to move the search bar to the center and the menu to the left

[stussieberg]

Hi! I'd like to know where and how to switch the positions of the menu (beneath the header logo on the center) with the search bar on the left. Thanks in advance! 

[Roy-ロイ]

Hi @stussieberg , 

To confirm, are you trying to accomplish this?

[stussieberg]

Yes exactly like that scheme! Thanks for the answer.

[Roy-ロイ · Accepted solution]

I'm happy to help you with that! You can easily achieve this by adding a simple CSS code to your theme.

To get started, follow these steps:

1. Log in to your Shopify Admin panel.
2. Go to Online Store > Themes > Customize.
3. In the Customizer, navigate to the header section and add the below code in the Custom CSS field. 

@media screen and (min-width: 990px) {
  .header--top-center {
    grid-template-areas:
      'navigation heading icons'
      'left-icons left-icons left-icons';
  }

.header > .header__search {
    justify-self: center;
 }
}​

It should look something like this: 

[stussieberg]

Yes, it worked! Why doesn't ChatGPT give answers like this? Thank you so much for your readyness. Cheers bro