Product Titel Size

[domo2]

Hi, 

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

https://nwjwlvi8nnufheq1-69711397132.shopifypreview.com

Thank you!

[Made4uo-Ribe · 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:

[Made4uo-Ribe · Accepted solution]

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. 

[Made4uo-Ribe · 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!

[Made4uo-Ribe · Accepted solution]

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

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

And Save. 

Result:

[BSSCommerce-HDL]

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 😍

[Made4uo-Ribe · 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:

[domo2]

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 · Accepted solution]

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. 

[domo2]

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

[Made4uo-Ribe]

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? 

[domo2]

Yes the Product titel more bold please

[Made4uo-Ribe · 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!

[domo2]

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 · Accepted solution]

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

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

And Save. 

Result:

[domo2]

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

[Made4uo-Ribe]

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

[domo2]

No problem 🙂 

https://o89lknoynbz1yqle-69711397132.shopifypreview.com

[Made4uo-Ribe · 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:

[domo2]

Thank you!

[domo2]

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!