Make Product Name Smaller on Product Page - Dawn Theme

babystore123
Excursionist
46 1 2

Hi! I'm looking to make the product name a little bit smaller on the product page on both mobile and desktop. Maybe 2-4 points smaller. Thank you!!! Below is a product link:

 

https://babybliss.co/products/baby-bowl-and-spoon-set

Replies 5 (5)

zaczee
Globetrotter
848 46 42

HI,

 

Add this CSS code
Online Store > Themes > Edit code > Assets > custom.css or theme.css

 

 

.product__title h1 { font-size: 24px !important;}

 

BSS-Commerce
Shopify Expert
3465 459 515

Hi @babystore123 ,

You can follow these steps:

Online Store > Themes > Edit code > Assets > insert code at the end of file  base.css

.product__info-wrapper .product__title h1 { 
font-size: 24px!important;
}

Hope it works @babystore123 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

babystore123
Excursionist
46 1 2

Hi thank you! This worked but only for desktop, not mobile

BSS-Commerce
Shopify Expert
3465 459 515

Add responsive for mobile screen:

@media only screen and (max-width: 800px) {
  .product__info-wrapper .product__title h1 { 
  font-size: 16px!important;
  }
}

Note: You can decrease/ increase the font size, whatever you want. 

view - 2024-02-20T105055.001.png

Hope it works @babystore123 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

babystore123
Excursionist
46 1 2

It looks good in your example! But on actual mobile device on website it doesn't change for some reason!