How can I adjust font size and color in collection sections?

Store Design
, , , , , , , , , , , , , ,
1

Good morning,

I would like 2 things:

  1. that the prices for the “featured collection” and “collection” sections are displayed in gray (#F2F2F2)

  2. that for the “featured collection” and “collection” sections the product titles be 12px in size and the prices are 10px in size

website : jadis-shop.com

password : rj

Do you know how to do it ?

thank you very much in advance

2

Hi @JADIS ,
This is Theodore from PageFly - Shopify Page Builder App.
For solving the problem about the Change Size And Colors Of Font, let’s try this solution:

Online Store ->Theme ->Edit code->theme.liquid

I’ll be so happy if my suggestion can help to solve your problem. If you have any further questions, please feel free to tell me.
Best regards,
Theodore | PageFly

3

it doesnt work :disappointed_face:

4

i dont know about how to code … could you please share me complete code for my website please ?

5

Have you tried adding to theme.liquid. Can you show me please?

6

it work but its not what i want …

I want to have

  • the product title (only for featured collection and collections) in size 12px without change the colors

  • The product price (only for featured collection and collections) in size 10px and in #F2F2F2

please

7

Can you try this code?
8

with this code there is no change in comparaison with beginning :confused:

9

Can you add more code?

.price__sale{
	color: #F2F2F2 !important;

}
10

same… it’s doesnt change anything

11

Then I am added code. It show as below image

PageFlyTheodor_0-1699200022185.png
PageFlyTheodor_0-1699200022185.png1253×551 325 KB

12

could you tell me and send me total code please and where do i have to put it ?

13
14

ok it works thanks !!!

15

I’ll be so happy if my suggestion can help to solve your problem. If you have any further questions, please feel free to tell me.

16

ok bro just last question before doing that

why only on this one it doesnt work ?

sdsdq.PNG
sdsdq.PNG1055×682 378 KB

17

From looking at the code. That specific item looks to be a regularly priced item. It has it’s own font-size of 1.6rem.

And the other items are on sale with a font-size of 12px. Which you applied with the recent code change.

If you want to adjust the size for regular priced items as well. You can probably add with your current code:

.price {
  color: #F2F2F2 !important;
}

Also I’d like to add, adding !important and the placement of the current code can lead to later issues if you continue to customize. Just something to be aware of if you continue to add customizations. It will be harder to track down. This one off is fine though.

18

Try testing on an anonymous browser