Change navigation dropdown font to lowercase on Pipeline theme

Store Design
1

Hi all -

I’m trying to change the dropdown menu navigation in Pipeline. The menu is extremely hard to read. I would like the subhead to be bold and the products names in title case (lowercase with the first letter of each word capitalized).

Does anyone know how to do this???

Website url: totaldry.com

Navigation.png
Navigation.png2714×1328 307 KB

Thanks in advance -

Ks22

1 Like
2

@ks22

yes, please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.css ->paste below code at the bottom of the file.
.menu__item.grandparent .navlink--child .navtext {
    font-weight: bold;
}
.menu__item.grandparent .navlink--grandchild span.navtext {
    text-transform: capitalize;
}
1 Like
3

Thank you so much for your quick response! Ok, I’m so new to coding… so I think I’m missing a very simple step…

Here is what the it looks like when I paste you code in the theme.css file… I know it should not be grayed out. What am I missing??? Thank you again for helping me - I truly appreciate it!

Ks22

Screen Shot 2022-01-09 at 1.46.31 PM.png
Screen Shot 2022-01-09 at 1.46.31 PM.png2522×1322 337 KB

4

Hello, thank you for this, it worked for me!

Is there a way to also make the main header menu text in lower case?

Is it all in upper case for now.

Many thanks,

Monika

1 Like
5

@MonikaBo

can you please share store url please

6

Hello!

its homeatfirstsight.co.uk

I am trying to make the header center above the menu as well but not sure if thats an option.

1 Like
7

@MonikaBo

try this code

span.navtext {
    text-transform: capitalize !important;
}
1 Like
8

Hi,

wow, that worked, thank you very much for your reply!

Monika

1 Like
9

@MonikaBo

its my pleasure to help us

1 Like
10

Thank you!

I am also trying to center my logo to be above the main menu - it is not a standard option for the Pipeline theme.

Do you know if that’s possible at all?

I attached a picture of what I mean.

Monika