Shopify Turbo Theme Header Size For Mobile

Solved
Highlighted
Tourist
6 0 1

Hi, I am using  turbo theme for shopify and when I increase the size of my text in the header, it only increases on desktop view but not on mobile view. Can anyone assist me on this?

0 Likes
Highlighted

Hello,

Thank you for your question.

Please share your store URL, page URL and also password (if your store has one), I'll help you out to the best of my ability.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
Tourist
6 0 1

Hi, my landing page URL is https://towelholic.com/products/toweldress-1

Thanks for your assistance

0 Likes
Highlighted

By header you mean the text in the blue bar? If so, use this code:

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > styles.scss.liquid and paste this at the bottom of the file:

@media (max-width:767px){
    [id] .promo_banner * {
    font-size: 12px !important;
}
}


Let me know whether this is what you need.

 

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
Tourist
6 0 1

By Header I meant the following:

 

hustlemuscle_1-1597646729644.png

hustlemuscle_2-1597646751715.png

 

These wordings that I set as heading 2 which increases in size on desktop view but not mobile. Any way to increase the size for mobile too?

 

Sorry for the miscommunication earlier

 

 

0 Likes
Highlighted

This is an accepted solution.

Oh, gotcha. Yes, you can repeat the previous steps and use this code instead:

@media (max-width:460px){
    .description h2{
    font-size: 35px !important;
}
}


Feel free to change the "35px" to any value you wish. It will only affect mobile devices.

Let me know how this goes for you.

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
1 Like
Highlighted
Tourist
6 0 1

Thank! It worked superbly.

How about the title of my product? is there any way to enlarge the size on mobile too? 

hustlemuscle_0-1597647670071.png

 

0 Likes
Highlighted

You're welcome!

Yes, just use this one:

@media (max-width:767px){
.product .product_name{
font-size: 35px !important;
}
}



Please make sure to click on the button "accept as solution" and "Like" below my answer to help other people in the community.

 Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
1 Like