How can I transform text to uppercase in Studio Theme?

Hi all!

How can I edit menu navigation, headers, footers, etc to be uppercase and keep the website body (like product descriptions) in normal text? I’m using the studio theme and would like to keep it as clean and simple as possible.

website: shopkapsul.com

I don’t see a way to change this without editing code.

Thank you in advance for your help!

Hi @skyehagz

I’m Richard Nguyen - CRO Expert at PageFly, I’d like to suggest this idea:

Step 1.

Add this css at the bottom

Online Store ->Theme ->Edit code

Assets → section-footer.css

.footer:not(.color-background-1) {

text-transform: uppercase !important;

}

Step 2.

Add this css at the bottom

Online Store ->Theme ->Edit code

Assets → base.css

.header__inline-menu {

text-transform: uppercase !important;

}

Hope you find my answer helpful!

Regards,

Richard-pagefly

Hi @skyehagz ,

Go to Assets > base.css and paste this at the bottom of the file:

.list-menu__item {
    text-transform: uppercase !important;
}

Hope it helps!

thank you for your help! this helped to resolve both questions in my original post. Cheers!