How can I alter product price sizes on my homepage?

Store Design
1

Hello community, sorry again ask
I would like to change the prices of the products on the homepage, without changing the one on the product page.
For example at the top (news on sale) which has only 3 products per line, I would like to make it larger and at the bottom (all products) has 5 products per line, I would like to make it smaller, could you help me?
So I would like to leave each of the sections “all products” and “news on sale” on the home page with a different size in the prices and the price in red I wanted to make it a little smaller.
I tried to change it and it changes all or changes the value of the product page.
Thank you so much.

FindWorld_0-1623370759493.png
FindWorld_0-1623370759493.png1542×722 179 KB

My store: findworld.com.br

1 Like
2

@FindWorld

Please add the following code at the bottom of your assets/theme.css file.

#shopify-section-collection .product-card__title{
font-size: 20px !important;
}

#shopify-section-16215495893789c7e1 ..product-card__title{
font-size: 16px !important;
}
.price__compare .price-item{ font-size: 15px !important; }

Hope this works.

Thanks!

1 Like
3

Hi friend, thanks for the help.

I would like to change the prices that are in black, below and above, this code only changed the red and the name, right?

Could you give me a code to change the prices in black separately per session please?

1 Like
4

The black values ​​of the products above are in a good size, but the ones below are too big and I would like to leave normal equal to the red price.

Captura de tela 2021-06-10 233854.jpg
Captura de tela 2021-06-10 233854.jpg943×901 110 KB

5

@FindWorld

Please add the following code at the bottom of your assets/theme.css file.

.price-item, .price-item--regular {
    font-family: 'Poppins' !important;
    font-size: 16px !important;
    font-weight: normal !important;
}

Thanks!

1 Like
6

He changed, but this code is also changing the product page, I would like to change only the home page, is this possible?

FindWorld_0-1623379617424.png
FindWorld_0-1623379617424.png1382×811 154 KB

7

I made this small change and it worked, thank you very much.

#shopify-section-collection .price-item, .price-item–regular {
font-family: ‘Poppins’ !important;
font-size: 20px !important;
font-weight: normal !important;
}

1 Like
8

@FindWorld

Remove previous code and add this new code

.template-index .price-item, .template-index .price-item--regular {
    font-family: 'Poppins' !important;
    font-size: 16px !important;
    font-weight: normal !important;
}

Thanks!