Archived topic

Mobile navigation uppercase?

7 replies · Started by Clinton on March 20, 2021

Viewing posts 1–8 of 8

March 20, 2021 at 8:10 am #1702994

Hi,

I am trying to make the word "MENU" uppercase on mobile primary navigation. I have changed the mobile settings in customise / typography / primary navigation to uppercase. It immediately changes both the menu and sub menu to uppercase. After I publish and check, only the sub menu remains as uppercase. It works fine on both desktop and tablet but not on mobile. Please help.

Many thanks

March 20, 2021 at 10:13 am #1703112

Hi Clinton,

Any chance you can link us to the site in question?

You can use the private information field.

Let me know :)

March 20, 2021 at 10:17 am #1703115

Hi Ying,

Thanks for the quick reply.

My site is:

https://scftraining.co.uk

March 20, 2021 at 11:00 am #1703158

Hi Clinton,

The desktop and mobile menu and submenu are all uppercased.

If you just want to change the mobile toggle label Menu, then go to Customizing > Layout > Primary Navigation, change the Mobile Menu Label to MENU :)

Let me know how it goes :)

March 20, 2021 at 11:31 am #1703180

Hi Ying,

Thanks for the reply. It seems if I enable "Menu Plus" and go to Customizing>Layout>Primary Navigation and rename the mobile menu label from Menu to MENU it does indeed change it to uppercase.

Is there another way to do this without enabling "Menu Plus" as I don't need anything else from this option? Maybe using CSS?

It's odd that when I alter mobile settings in Customizing>Typography>Primary Navigation to uppercase it shows "MENU" in live mode but once published it returns to "Menu".

March 20, 2021 at 11:41 am #1703190

Oh I see, yes, you can use CSS in this case:

.mobile-menu {
    text-transform: uppercase;
}

March 20, 2021 at 11:44 am #1703192

Amazing! Thank you very much.

March 20, 2021 at 11:45 am #1703194

You are welcome :)

This archived topic is closed to new replies.

Start building better websites today.