Metafields Color Images Not Displaying – Variant Picker Block Limit Error

[B_NY1948]

Hi everyone,

I’m using metafields to display custom colors with both images and hex codes on my Shopify store. While the hex colors work perfectly, the images won’t display.

I’m getting this error:
"This section accepts a maximum of 1 variant picker block. To show more entries, remove other blocks or use a section that supports more blocks."

Has anyone encountered this issue before? Is there a workaround or a setting I need to adjust to allow the images to display correctly?
I'm using the nordic theme

Any help would be greatly appreciated! Thanks in advance.

[goldi07]

Hello @B_NY1948 

It looks like the issue might be related to how the Nordic theme handles variant picker blocks. Since the error mentions a limitation on the number of variant picker blocks, the theme may not support multiple variant display elements in the same section.

Possible Workarounds:
1 Check Theme Settings

. Go to Online Store > Themes > Customize and see if there's a way to adjust the section to allow multiple blocks.
2 Use a Different Section

. If the current section is limiting you, try adding a custom Liquid block in a section that supports more content.
3 Modify the Theme Code

If the theme restricts multiple variant picker blocks, you might need to modify main-product.liquid or product-form.liquid to manually include metafield images.
4 Alternative Approach

. Instead of using a variant picker, consider displaying color swatches via a custom Liquid block that fetches the metafield images.
If you can share how you've set up the metafields (type, key, and where you're inserting them), I can suggest a more specific fix!

Thank you 😊

[Small_Task_Help]

Hi,

Hope this will help

Add Metafields for Color Images
Upload Color Images for Variants
Display Metafield Images in Your Theme
custom code example

{% if product.selected_or_first_available_variant.metafields.custom.color_image %}
  <img src="{{ product.selected_or_first_available_variant.metafields.custom.color_image | file_url }}" alt="Color Preview">
{% endif %}