How to Change Your Header Menu Font Case in Shopify
Need to change your header menu? This Shopify tutorial will show you how to change your header menu font case to uppercase, lowercase, or even proper case – all with simple CSS code!
We'll walk you through step-by-step, including two ways to apply the code to your theme, and how to find the code for your specific theme. By the end of this video, you'll be able to give your store a more personal touch! Watch now!
Notes:
1) The options for the font case are uppercase, lowercase, and capitalize.
2) Depending on your theme .header__inline-menu could also be .header__menu-item or .sit-nav
CSS Codes:
/*desktop and mobile all nav uppercase*/
.header__inline-menu,
.list-menu {
text-transform: uppercase;
}
/*desktop only all nav uppercase*/
.header__inline-menu {
text-transform: uppercase;
}
/*top level nav uppercase*/
.header__inline-menu {
text-transform: uppercase;
}
.header__submenu {
text-transform: capitalize;
}
Timestamps ⌚️
00:00 How to change header menu font case for mobile and desktop
01:35 How to change header menu font case for desktop only
02:26 How to apply different font case to top & sub menu
03:10 How to find the code in any theme to customize font case
04:25 Where to add the CSS code
07:11 Bloopers
Tutorials you may want to watch:
📺How to Change the Image Banner Overlay Color in Shopify • How to Change the Image Banner Overlay Col...
📺Different Image for Desktop and Mobile • Hide Sections in Desktop and Mobile
📺2 Ways To Change The Default Font Sizes in Shopify • 2 Ways To Change The Default Font Sizes in...
📑 Get access to my Shopify Pre-Launch Checklist list at https://betsylugo.com/shopify-checklist/
🔔 Thanks for watching and be sure to subscribe for more awesomeness!
⚞⚞⚞⚞⚞☕️ ABOUT ☕️⚟⚟⚟⚟⚟
Learn how to design & customize your Shopify website. Subscribe to be notified when a new video is released. I pledge to keep the tutorials simple, short, and helpful!
I’m a self-taught web designer, super-nerd, and a Shopify partner. Owner of Betsy Lugo Creative ☕ I drink an insane amounts of coffee, so if you want to say thanks for a helpful video, buy a coffee! https://www.buymeacoffee.com/bl.creative 📺 I watch way to much Netflix ✈️ I love to travel.
👉🏽LET'S CONNECT
Say hi on Insta / betsy_oficial
Follow me on Pinterest / bl_creative
Work with me https://www.betsylugo.com
Join Commerce Connection - A monthly newsletter sharing Shopify news and updates, ecommerce trends, freebies and more! https://betsylugo.com/monthly-newslet...
👉🏽 TOOLS & SYSTEMS I LOVE
Several clients have requested that I posted my affiliate links so that they can register through them as a thank-you for my free tutorial content here on YouTube. Thank you so much for your support! If you would like to use my affiliate links, I would greatly appreciate 🙏🏾
My social media management system https://my.mtr.cool/QQKZQD
Protect your business https://bit.ly/BLC-Policies
Custom Shopify sections https://bit.ly/BLC-Sections
Product mockups https://bit.ly/BLC-Mockups
My favorite themes https://bit.ly/BLC-Themes
Want more? Check out my resources page https://betsylugo.com/resources/
The term "Shopify" is a trademark of Shopify Inc. and the term "Canva" is a trademark of Canva Inc. This video was not approved or endorsed by them. I just really love their platforms ♥
DISCLAIMER: Links included in this description might be affiliate links. If you purchase a product or service with the links that I provide I may receive a small commission. There is no additional charge to you! Thank you for supporting my channel so I can continue to provide you with free content each week!
#shopify #shopifytutorial #shopifycss