Solved

How can I reduce mobile product font size for better view?

LEEDIA
Excursionist
25 0 6

The font size is currently a little too big on the mobile view when viewing the product, so only one word fits per line. How could I make this smaller? 

 

I appreciate any help 🙂 

 

URL: 

mobile-product-view.jpg

Accepted Solution (1)

PageFly-Oliver
Astronaut
878 190 171

This is an accepted solution.

Hi @LEEDIA ,

 

You can try this code by following these steps: 

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

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file -> Save

<style>
@media(max-width:767px){
#MainContent .product__title h1{
font-size:20px
}
}
</style>



Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 5 (5)

suyash1
Shopify Partner
9215 1146 1493

@LEEDIA - can you please share the page link? it will need css

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI
LEEDIA
Excursionist
25 0 6

Oops, sorry about that.

URL: https://leediastore.com/

password: yaurow

suyash1
Shopify Partner
9215 1146 1493

@LEEDIA - please add this css to the very end of your base.css file and check, adjust number 14 as per the need

@media(max-width:767px){
.card__heading a{font-size:14px;}
}

 

suyash1_0-1696042868680.png

 

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI

PageFly-Oliver
Astronaut
878 190 171

This is an accepted solution.

Hi @LEEDIA ,

 

You can try this code by following these steps: 

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

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file -> Save

<style>
@media(max-width:767px){
#MainContent .product__title h1{
font-size:20px
}
}
</style>



Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

LEEDIA
Excursionist
25 0 6

This worked perfectly! Thank you so much