Shopify Metafields Not Appearing in Builder | Display Product Dimensions

Ever tried to display product dimensions or other unique product details using a specific 'dimension' metafield, only to find it playing hide-and-seek in your Shopify theme builder? You're definitely not alone! This is a common frustration, and it was recently highlighted in our community by GabrielNoba, who just wanted to show off product dimensions right under the main title, like a neat subtitle.

GabrielNoba had done everything right, or so it seemed: created a 'dimension' metafield, populated it with data on their product page, but then hit a wall when trying to connect it in the theme editor. Sound familiar? Let's dive into why this happens and, more importantly, how to fix it, drawing insights directly from the helpful folks in the Shopify community.

The Metafield Mystery: Why Isn't My 'Dimension' Showing Up?

GabrielNoba's goal was clear: add product dimensions as a subtitle. They logically thought, "Shopify has a 'dimension' metafield type, so I'll use that!" They created it, filled it in, but when they went to the theme builder to link it to a text block, the dimension metafield simply wasn't an option. It's a classic case of expectation vs. reality, and it can be a real head-scratcher.

The core of the problem lies in how different metafield types are designed to interact with various theme builder sections and blocks. While Shopify's metafields are incredibly powerful for storing structured data, their direct display compatibility in the theme editor isn't always as straightforward as we'd hope, especially with generic text blocks.

The Key Insight: Compatibility is King (and sometimes Tricky!)

This is where the community really shines. Another helpful member, Nathan from NKCreativeSoulutions, quickly jumped in with some practical advice. He pointed out that for a metafield to easily connect with a text setting in your theme editor, it often needs to be a text-like type itself. Think 'Single line text' or 'Multi-line text'.

Now, here's where it gets a little interesting. As tim_tairli (who initially provided some documentation) pointed out, Shopify's official developer docs do state that 'dimension' type metafields should be compatible with 'richtext' and 'text' type settings. So, why the discrepancy?

In practice, while the backend compatibility might exist, some themes or specific text blocks in the builder might be more restrictive in what they offer for dynamic sources. For simple, direct display of text-based information (like "10cm x 5cm x 2cm"), a 'Single line text' metafield often provides the most reliable and direct connection within the theme editor's dynamic source picker. It ensures your data is treated purely as a string of text, which is exactly what a text block expects.

Solution 1: The Builder-Friendly Metafield Approach

Based on Nathan's advice and community experience, the most straightforward way to get your dimensions (or any other text-based data) showing in the builder is to ensure your metafield is set up correctly as a text type.

Step-by-Step: Setting Up Your Product Dimensions for the Theme Editor

Create/Adjust Your Metafield:
Go to your Shopify Admin, navigate to Settings > Custom data > Products. If you already have a 'dimension' metafield, consider creating a new one specifically for display purposes if the existing one is of the 'dimension' type. Make sure it's a Product metafield (not variant, order, or shop) and set its type to Single line text. This is crucial for easy integration with generic text blocks in the theme editor.
Populate Your Product Data:
Head over to the product you want to edit. Scroll down to the 'Metafields' section and fill in your dimension data (e.g., "Dimensions: 10cm x 5cm x 2cm") into your newly created 'Single line text' metafield.
Head to the Theme Editor:
Go to Online Store > Themes > Customize. Navigate to your product template (usually by selecting 'Products' from the dropdown at the top, then 'Default product').
Add a Text Block:
In the sections sidebar, find where you want to add the dimensions (e.g., under the Product information section). Click 'Add block' and choose a text-based block like 'Text' or 'Custom Liquid'. GabrielNoba's screenshots show trying to connect to a 'Text' block, which is perfect for this method.
Connect the Dynamic Source:
Click on the newly added text block. In the settings panel on the right, you'll see the text field. Look for the 'Connect dynamic source' icon (it often looks like a small database symbol or two overlapping circles) next to the text input field. Click it.
Select Your Metafield:
If prompted, choose 'Product' as the resource context. In the list of available fields, you should now see your 'Single line text' dimension metafield (it will be listed under its namespace and key, e.g., product.metafields.custom.your_dimension_field). Select it.
Save and Publish:
Save your changes, and your product dimensions should now be proudly displayed on your product pages!

Solution 2: The Custom Liquid Code Alternative

When to Use Code and How

Sometimes, even with the right metafield type, you might want more precise control over styling, or perhaps the builder isn't cooperating as expected. This is where custom Liquid code comes in handy. Nathan also provided a great code snippet that you can use:

{% if product.metafields.app.dimension %}
  
    {{ product.metafields.app.dimension | metafield_text }}
  
{% endif %}

How to use this code:

In your theme editor, instead of a 'Text' block, add a 'Custom Liquid' block to your product template.
Paste the code above into the 'Custom Liquid' field. Make sure to adjust product.metafields.app.dimension to match the actual namespace and key of your dimension metafield (e.g., product.metafields.custom.your_dimension_field).
The
tag gives you a CSS class to target. You can then add custom CSS to your theme's stylesheet (usually theme.scss.liquid or base.css) to style this text exactly how you want it – font size, color, spacing, etc.

This method gives you total flexibility and is often the go-to for developers or store owners who want pixel-perfect control over their content. It's a bit more advanced but incredibly powerful.

So, whether you stick to the theme builder with a 'Single line text' metafield or dive into custom Liquid for ultimate control, displaying those crucial product dimensions doesn't have to be a mystery. The key takeaway from our community discussion is understanding the nuances of metafield types and how they interact with your theme's capabilities. Don't be afraid to experiment a little, and you'll have your product pages looking exactly how you envisioned!

Shopify Metafields Not Showing in Theme Builder? Here's the Fix!