Solved

Product Titel Size

domo2
Explorer
59 0 14

Hi, 

 

I want my product titel to be much smaller on the product page. 

 

https://nwjwlvi8nnufheq1-69711397132.shopifypreview.com

 

Thank you!

Accepted Solutions (5)

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Hi @domo2 

Im not sure how smaller you like but you can adjust the px size. 

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:

Made4uoRibe_0-1717602903396.png

 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.

View solution in original post

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Welcome. 

For the prices you need to go in the settings > Store details >  find the store currency

Made4uoRibe_0-1717765294562.png

Click change formatting. 

You can change {{amount_no_decimals}}

Made4uoRibe_1-1717765360137.png

And Save your changes. 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.

View solution in original post

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Ad this code to the base.css. Same instruction. 

.product__title h1 {
    font-weight: 900;
}

And save. 

If this one wont work please, would you midn to share your store URL preview. cause the one you shared already expired. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.

View solution in original post

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Yes, add this code again to the base.css. 

.collection .price {
    font-size: 1.3rem;
}

And Save. 

Result:

Made4uoRibe_0-1717773389329.png

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.

View solution in original post

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Thanks, add this on the base.css.

.card-information>*:not(.visually-hidden:first-child)+*:not(.rating):not(.card__information-volume-pricing-note) {
    margin-top: 0rem !important;
}

And save. 

Result:

Made4uoRibe_0-1718029984088.png

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.

View solution in original post

Replies 15 (15)

BSSCommerce-HDL
Shopify Expert
733 243 255

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

Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

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

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

Here is result: 

BSSCommerceHDL_0-1717601247087.png

Hope this can help you,

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

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


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Hi @domo2 

Im not sure how smaller you like but you can adjust the px size. 

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:

Made4uoRibe_0-1717602903396.png

 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
domo2
Explorer
59 0 14

Thank you very much! 

 

Do you know how I change my price from 79,00 to 79? On product page and collection page.

 

 

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Welcome. 

For the prices you need to go in the settings > Store details >  find the store currency

Made4uoRibe_0-1717765294562.png

Click change formatting. 

You can change {{amount_no_decimals}}

Made4uoRibe_1-1717765360137.png

And Save your changes. 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
domo2
Explorer
59 0 14

Can you show me how I make the titel bold, please?

Made4uo-Ribe
Shopify Partner
6451 1547 1918

Which titles are you referring too? Do you mean the product title? It is already bold with the size of 400. do you want to make it more bolder? 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
domo2
Explorer
59 0 14

Yes the Product titel more bold please

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Ad this code to the base.css. Same instruction. 

.product__title h1 {
    font-weight: 900;
}

And save. 

If this one wont work please, would you midn to share your store URL preview. cause the one you shared already expired. Thanks!

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
domo2
Explorer
59 0 14

It worked, thank you very much!

 

Last question. On the collection page the price is pretty huge. I want it to be similar to the size of the title. Could you help me with that, please?

 

https://f24z0sfx7v4km8ow-69711397132.shopifypreview.com

Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Yes, add this code again to the base.css. 

.collection .price {
    font-size: 1.3rem;
}

And Save. 

Result:

Made4uoRibe_0-1717773389329.png

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
domo2
Explorer
59 0 14

Thank you! I only need the gap between title and price to be a bit smaller, please. 

Made4uo-Ribe
Shopify Partner
6451 1547 1918

Oh, Sorry the preview expired again.I  didnt notice the notification. 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
domo2
Explorer
59 0 14
Made4uo-Ribe
Shopify Partner
6451 1547 1918

This is an accepted solution.

Thanks, add this on the base.css.

.card-information>*:not(.visually-hidden:first-child)+*:not(.rating):not(.card__information-volume-pricing-note) {
    margin-top: 0rem !important;
}

And save. 

Result:

Made4uoRibe_0-1718029984088.png

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free.
domo2
Explorer
59 0 14

Thank you!