Hi,
I want my product titel to be much smaller on the product page.
https://nwjwlvi8nnufheq1-69711397132.shopifypreview.com
Thank you!
Topic summary
Main focus: reducing and styling the product title and price display on a Shopify store via theme CSS and currency formatting.
Key changes implemented:
- Product title size reduced by adding custom CSS in theme’s base.css (product title h1 font-size) and later made bolder (font-weight 900). OP confirmed it worked.
- Prices changed to show no decimals (e.g., 79 instead of 79,00) by going to Settings > Store details > Store currency > Change formatting and using {{amount_no_decimals}}.
- Collection page price size decreased with CSS (price font-size adjustment).
- Gap between product title and price on collection cards reduced by targeting .card-information children and setting margin-top to 0. Screenshots were shared to show results, but are illustrative only.
Recent update/status:
- OP now requests help customizing the Thank You (order status) page to add a single image next to the order number.
- No solution provided yet for the Thank You page request; discussion remains open on this point.
1 Like
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:
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 
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:
1 Like
Thank you very much!
Do you know how I change my price from 79,00 to 79? On product page and collection page.
Can you show me how I make the titel bold, please?
Welcome.
For the prices you need to go in the settings > Store details > find the store currency
Click change formatting.
You can change {{amount_no_decimals}}
And Save your changes.
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?
1 Like
Yes the Product titel more bold please
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!
1 Like
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?
Yes, add this code again to the base.css.
.collection .price {
font-size: 1.3rem;
}
And Save.
Result:
1 Like
Thank you! I only need the gap between title and price to be a bit smaller, please.
Oh, Sorry the preview expired again.I didnt notice the notification.
1 Like
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:
1 Like
Thank you!
Can you help me with customizing my Thank You Page after the purchase please? I just want 1 picture to be added to the page next to the order number.
Thank you!