How can I decrease the mobile font size, while retaining the font size of desktop view?

[baynojayson]

Hi Shopify Community!

I just wondering if you could help me decrease the mobile font size, while retaining the font size of desktop view? Here is my shop link : https://ingcostores.com/ .

I really do appreciate your help!!!

Sincerely,

Jayson

[theycallmemakka · Accepted solution]

Hi @baynojayson ,

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

<style>
@media (max-width: 768.98px) {
    body {
        font-size: 14px!important;
    }
}
</style>

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

[namphan · Accepted solution]

Hi @baynojayson,

Please go to Actions > Edit code > Assets > main.css file and paste this at the bottom of the file:

@media (max-width: 768.98px) {
:root {
    --body-font-size: 14;
}
}

[theycallmemakka · Accepted solution]

Hi @baynojayson ,

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

<style>
@media (max-width: 768.98px) {
    body {
        font-size: 14px!important;
    }
}
</style>

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

[baynojayson]

Wow!! Really thanks for your help my friend!! I do really appreciate your kind assistance 

[baynojayson]

Hi Makka. 

I am just wondering if this is possible for shopify, wherein in one store it could feature other website. https://www.abenson.com/

[namphan · Accepted solution]

Hi @baynojayson,

Please go to Actions > Edit code > Assets > main.css file and paste this at the bottom of the file:

@media (max-width: 768.98px) {
:root {
    --body-font-size: 14;
}
}

[namphan]

Hi @baynojayson,

This is possible, would you like to add it here?

[baynojayson]

Yes correct 🙂 May I know if you could offer your service ? 🙂 

Thank you Namphan 

[BSSCommerce-B2B · Accepted solution]

Hi @baynojayson, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head>

<style>
@media only screen and (max-width: 768px) {
  body {
    font-size: 1.4rem!important
  }
}
</style>

If it helps you, please like and mark it as the solution.

Best Regards 😊