How can I center my logo and navigation in the Brooklyn theme?

Store Design
1

Hi there,

I have spent a while looking through other answers and can’t seem to get anything to work. I am created a new site and I want my logo to be centered in the header with the menu centered below it in brooklyn theme. Can someone plz help!!

Greatly appreciated.

Here is my link

https://fikawear.myshopify.com/

1 Like
2

@fikawear

Thanks for post

, sorry but your store is password protect. can you please share us

3

Sorry. It should be visible now.

4

@fikawear

do you like this?

KetanKumar_0-1607723534187.png
KetanKumar_0-1607723534187.png1920×1080 200 KB

5

yes, that is how I would like it, except with less white space in the banner. Also, if possible Id like the cart and search button to stay on the right, but the menu where you have it. Can you tell me how to do this?

1 Like
6

@fikawear

It can be done by doing some code customization. please send me a personal message and we can discuss what you’d like

7

hello ketan, i’m looking to make the same modifications to my header and would love some help with it. i tried to message you, but it looks like i don’t have PM capabilities in shopify yet, having just signed up for the community. if you’re available, let me know! thanks so much.

1 Like
8

@ohlittlewren

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

9

great! thanks so much, my site is https://www.ohlittlewren.com/

i also seem to have PM capabilities now, so we can do that if it’s easier.

1 Like
10

@ohlittlewren

yes, please confirm this look proper

KetanKumar_0-1661004304916.png
KetanKumar_0-1661004304916.png1920×870 161 KB

1 Like
11

yes! also, would it be possible to put the account and cart icons to the far right of the logo and the search to the far left?

1 Like
12

@ohlittlewren

my screenshot is normal css change possible but your last requirement done by more customization css, html and liquid code change

1 Like
13

@KetanKumar thanks so much. so i should probably hire a developer for that second part. how to i at least make the first set of css changes?

1 Like
14

@ohlittlewren

yes, first fart done below code can you try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.site-header .grid--table {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
}

.site-header 
 .grid__item.large--one-third.medium-down--one-half {
    display: flex;
    text-align: center;
}

nav.grid__item.large--one-whole.large--text-right.medium-down--hide {
    display: flex;
    justify-content: center;
}
1 Like
15

perfect. thanks so much @KetanKumar

1 Like
16

@ohlittlewren

its my pleasure to help us

1 Like