Brooklyn Theme - How to Change the Menu Dropdown Font

New Member
6 0 0

I'm using the Brooklyn theme, but the menu font and the dropdown menu (from the menu) has a different font. How do I change it to the same?

 

Pasting the following to theme.scss.liquid did not work:

 

.site-nav__dropdown {
font-family: 'Montserrat';
}

.site-nav__link--button {
font-family: 'Montserrat';
text-transform: uppercase;
letter-spacing: 3px;
font-size: 12px;
}

 

It changed the font alright, but not to the same one as the menu font.

0 Likes
Shopify Expert
2474 415 522

Hi @kooritsuki 

you have to add css to like this:

.site-nav__dropdown li a{font-family: 'Montserrat';}
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
New Member
6 0 0

Nope, that doesn't work either. :(

ShopifyDropdown.jpg

0 Likes
Shopify Expert
2474 415 522

Send me your store url 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
New Member
6 0 0

Hi there, here's the preview link.

 

https://q9ryycgqrdpsjdno-24699273306.shopifypreview.com

0 Likes
Shopify Expert
2474 415 522

You have not imported font that's why not applying.

Add this in Asset->theme.scss

@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');

Then add this font:

font-family: 'Montserrat', sans-serif;
Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
New Member
6 0 0

It finally showed another font, but it's not exactly the same font I think. It looks similar, but not the same.

 

ShopifyDropdown.jpg

 

Here's the code I have per your instructions:

 

@import url('https://fonts.googleapis.com/css?family=Montserrat&display=swap');

 

.site-nav__dropdown {
font-family: 'Montserrat', sans-serif;;
text-transform: uppercase;
letter-spacing: 3px;
font-size: 13px;
font-weight: bold;
}

.site-nav__link--button {
font-family: 'Montserrat', sans-serif;;
text-transform: uppercase;
letter-spacing: 3px;
font-size: 12px;
font-weight: bold;
}

0 Likes