A user successfully added a custom metafield and color to their product card but wants to adjust the font size and letter spacing to match their existing “captions” block styling (smaller font with more letter spacing).
Current styling goal:
Proposed solutions:
Two community members suggested similar approaches:
Screenshots were shared showing the current product card appearance and where to locate CSS customization options. The discussion remains open as the original poster hasn’t confirmed whether the suggested solutions worked.
Hi,
I’ve managed to get colour and a custom metafield appear in my product card, but i want the font size / spacing to be the same as my “captions” block - basically smaller and more letter spacing.
from what i can find this is the tweaks, but how can i apply it to this line?
.caption {
font-size: 1rem;
letter-spacing: 0.07rem;
line-height: calc(1 + 0.7 / var(–font-body-scale));
}
Hi @letsgetwasted ,
Could you try going to: Shopify > Themes > Customize. There select the “default product” template. Next, navigate to the text you would like to adjust and click on it. On the right corned of the page, there should be a “Custom CSS” section, where you should be able to add your custom CSS code.
To complete your requests, please follow these steps:
Best,
Daisy
