how to make product price the same size as product title on product page

Store Design
, , ,
1

hey does anyone know how to make product price the same size as product title on product page, preferably a couple px smaller then what the title currently is. And I would like title and price to both be bold aswell please. Thanks guys, I will give likes and will mark solutions for anyone who can help! :slightly_smiling_face:

LINK: https://bestbongsandmore.com.au/products/juicy-jays-1-25-grape-flavour-rolling-papers

2

Hi @Taryckrich ,

Here are the steps you can follow:

1, Navigate to Online Store > Themes > Edit Code.

2, Locate and open the base.css (or theme.css, custom.css) file.

3, Paste the code snippet provided below at the bottom of the file, then save your changes.

.product .price__container .price-item {
    /* You can adjust this value according to your preference */
    font-size: 36px;
    font-weight: 600;
}

Here is the result

BSSTekLabs_0-1722169713721.png
BSSTekLabs_0-1722169713721.png2878×1564 360 KB

We hope this assists in resolving the issue.

If you find our solution helpful, kindly consider Liking and Marking it as Accepted. Thank you!

1 Like
3

Thank you heaps you are always first to help i appreciate you lots, i just tested and price is bit to large, can you do code for 34px for product title and 24px for product price please? Also is there any chance you can add code to make colour of price #008A00 . Thank you again!!

4

There you go, this is the code you need. If you need any further customization, feel free to let us know!

.product .product__title h1 {
    font-size: 34px;
    color: #008A00;
}

.product .price__container .price-item {
    /* You can adjust this value according to your preference */
    font-size: 24px;
    font-weight: 600;
    color: #008A00;
}

Here is the result

BSSTekLabs_0-1722170159688.png
BSSTekLabs_0-1722170159688.png2878×1606 379 KB

1 Like
5

Thank you so much that is perfect! Can you please check my recent question? Your code always work!

1 Like
6

You’re welcome! :blush:

Please check out my response to your latest post!

1 Like