Change style of metafields on product page

Store Design
1

We are using the theme Craft and would like to change the appearance of the metafields on the product pages (change the text colour and/or bold it). Where can I find the code to do this?

2

The place to insert the code to change the appearance is your theme’s CSS file. Under Online Store, click the “…” next to Customize and then “edit code”, then the CSS file will likely be named base.css. You will want to edit that file. You can use the search in the top left of the code editor and type “.css” to narrow down the location.

3

Thanks for your response. I’ve found the base.css file, but I can’t find anything in it pertaining to metafields. What should I be looking for?

4

It depends on which css classes the theme (or any custom edits) applied to the html tags containing the metafields. If you would like to share your store URL I’m happy to take a look and let you know which CSS classes to style.

5

Thanks @wmmsc ! Our url is theengravers.ca

6

Paste this code in at the bottom of base.css

Note if you use metafields aside from multiline, they may have different CSS classes to target. Let me know and I can take a look.

.metafield-multi_line_text_field {
  color: #333;
  font-weight: bold;
}
7

Thank you! Your solution didn’t quite work, but it led me to the right place to tweak the code and I figured it out.

8

Since I helped you find the code to edit, would you mind marking my answer as a solution?

9

Can you help me too with what you did? Trying to edit an image in the metafield