Product titles are displayed too large

[newsendy_alc]

I encountered a problem, that is, the title of the product page, too huge, affecting the page effect, there is no way to make the title font smaller, before trying to replace the title with text will affect the effect of H1.

[ZestardTech]

Hello There,

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

.product__title h1 {
font-size: 25px;
}

[dmwwebartisan]

@newsendy_alc

Please share your store url.

Do you want to make product title smaller?

Changing text of product title doesn’t effect on H1 tag.

[Made4uo-Ribe]

HI @newsendy_alc

Check this one.

From your Shopify admin dashboard, click on “Online Store” and then “Themes”.

Find the theme that you want to edit and click on “Actions” and then “Edit code”.

In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.product__title h1 {
    font-size: 30px;
}

And Save.

Result:

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

[Anshul_arora]

Hello @newsendy_alc ,

I understand you are looking to decrease the size of the Product Title

You can change the font size with the help of CSS Code.

Add the code at the bottom of the theme.liquid file before tag and save

[Please feel free to set the Font-size px as per your requirements]

Output will be like this -: https://prnt.sc/V3dpJXEJvp56

I hope the code helps you.

Please share if you have any queries.

Thank you.

[niraj_patel]

Hello @newsendy_alc

You can add code by following these steps

1. Go to Online Store → Theme → Edit code.

2. Open your theme.liquid file

3. Paste the below code before on theme.liquid

.product__title h1 { font-size: 20px !important; /*adjust according to you*/ }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[Vinsinfo]

@newsendy_alc Please follow below steps to decrease the font size of the product title. Let me know whether it is helpful for you.

1. From admin, go to “Online stores” → “Themes”.
2. Click action button from the current theme and select “Edit code”.
3. Go to “base.css” file and paste the below code at the bottom of the file and save changes.

Note: Update the font size as per your requirements.

.product .product__info-wrapper .product__title h1 {
  font-size: calc(var(--font-heading-scale) * 2.5rem);
}
@media only screen and (max-width: 750px) {
  .product .product__info-wrapper .product__title h1 {
    font-size: calc(var(--font-heading-scale) * 2rem);
  }
}

Result will be like,

Please provide your support by click “Like” and “Accepted” if our solution works for you. Thanks for your support.