All things Shopify and commerce
Hi, I'm currently using the prestige theme and want to change the main menu navigation headers (SHOP / OUR WORLD / INFO / SEARCH / CART) to my body font, rather than my heading font. Currently this section uses 'H6' and when I try to change this is also alters the mega menu dropdowns, which I don't want to change. Can anyone help with this please?
For reference I am using shopify's own fonts – 'ITC Caslon No 224' for headings and 'Avenir Next' for body.
Solved! Go to the solution
This is an accepted solution.
.header__primary-nav .header__menu-disclosure .h6, .header__primary-nav-item .h6, .header__secondary-nav .h6.link-faded {
font-family: var(--text-font-family) !important;
}
Can you replace to this code @emilyaugstudios
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
Hi @emilyaugstudios . If you want to change font-size only for this part. You need to add new class name in liquid template and then style in with css.
Hi @Ihor-Sh – I actually want to change the main header menu items from H6 font 'ITC Caslon No 224' to 'Avenir Next' which is my body font. Do you know the code for this?
Hello @emilyaugstudios .
Our team is ready to help you.
Please share your website address and access password (if necessary) so that we can check and assist you.
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
Hi @BSS-TekLabs – Thank you! The website address is https://927103-16.myshopify.com/ and I have removed the password for now.
- Here is the solution for you @emilyaugstudios
- Please follow these steps:
- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.
.h6 {
font-family: var(--text-font-family) !important;
}
- Here is the result you will achieve:
- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
Hi, that's great thank you. My only issue is that I don't want it to change all h6 headings to this style. I only want to target the main menu titles (SHOP / OUR WORLD / INFO / SEARCH / CART) - Is there anyway to only target these specific header menu areas?
This is an accepted solution.
.header__primary-nav .header__menu-disclosure .h6, .header__primary-nav-item .h6, .header__secondary-nav .h6.link-faded {
font-family: var(--text-font-family) !important;
}
Can you replace to this code @emilyaugstudios
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
I have updated the code. You can try them @emilyaugstudios .
- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.
If our suggestions are useful, please let us know by giving it a like or marking it as a solution.
Salepify: Efficiently increase sales conversion with sale-driven features like auto add to cart, free gifts (free plan available)
Salemate: Boost your AVO with 2-layer offer, countdown upsell in your post purchase page
The year-end shopping spree is around the corner! Is your online store ready for the ...
By JasonH Nov 10, 2024We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024