Advanced Product Customization on Shopify: Dynamic Model Attributes & Partner Management with MetaFields and MetaObjects

Introduction

In today’s competitive e-commerce landscape, providing clear, detailed product information can set your store apart. Whether you want to display dynamic model measurements and corresponding size charts or showcase your brand’s partners and influencers, Shopify’s MetaFields and MetaObjects offer powerful customization options—all without the need to handle complex JSON code.

In this comprehensive guide, we will cover:

1. Dynamic Model Attributes: How to create and display model measurements (height, bust, waist, hips, etc.) and the size they’re wearing on your product pages.
2. Partner & Influencer Management: How to set up and manage a dedicated section for partners, influencers, or contributors using MetaObjects.
3. Best Practices: Tips for keeping your data consistent, scalable, and easy to update through the Shopify Admin.

Let’s dive in!

‍

‍

Part 1: Displaying Dynamic Model Attributes on Product Pages

‍

1.1 What Are MetaFields and MetaObjects?

• MetaFields let you add extra custom information (like measurements) to your products.
• MetaObjects allow you to create structured, reusable data objects—ideal for handling complex information such as model profiles.

In this approach, instead of managing large JSON structures, you define individual fields through the Shopify Admin that are easy to update.

‍

1.2 Creating a Model MetaObject

‍

Step 1: Define the “Model” MetaObject

1. Access Shopify Admin: Navigate to Settings > Custom data> MetaObjects.
2. Create a New MetaObject: Name it “Model.”
3. Add Fields:
   • Name: Single line text (e.g., “Model A”)
   • Height: Single line text (e.g., “1.80 m”)
   • Wearing Size: Single line text (e.g., “L”)
   • Bust: Single line text (e.g., “90 cm”)
   • Waist: Single line text (e.g., “70 cm”)
   • Hips: Single line text (e.g., “95 cm”)

This structured form allows your team to enter data directly, ensuring consistency and ease of management.

‍

Step 2: Populate Model Data

For example, create an entry for “Model A” with the following details:

• Name: Model A
• Height: 1.80 m
• Wearing Size: L
• Bust: 90 cm
• Waist: 70 cm
• Hips: 95 cm

‍

1.3 Linking Models to Products

To display a model’s data on a product page, create a simple MetaField on your product to store a reference (such as a handle) for the model.

1. Create a MetaField for Products:
   • Namespace: custom
   • Key: model_handle
   • Type: Single line text
   • Description: “Enter the handle of the model (e.g., model-a)”

When editing a product, simply enter the appropriate model handle.

‍

1.4 Displaying Model Data on the Product Page

Update your product template (e.g., product.liquid) with the following Liquid code to retrieve and display the model’s details:

liquid:

{% comment %}
  Retrieve the model reference from the product's metafield.
  This assumes the metafield 'custom.model_handle' contains the model’s handle.
{% endcomment %}

{% assign model_handle = product.metafields.custom.model_handle %}
{% if model_handle %}
  {% assign model = shop.metaobjects.models[model_handle.value] %}
  {% if model %}
    <div class="model-attributes">
      <h3>Our Model: {{ model.fields.name.value }}</h3>
      <p>Height: {{ model.fields.height.value }}</p>
      <p>Wearing Size: {{ model.fields.wearing_size.value }}</p>
      <p>Bust: {{ model.fields.bust.value }}</p>
      <p>Waist: {{ model.fields.waist.value }}</p>
      <p>Hips: {{ model.fields.hips.value }}</p>
    </div>
  {% else %}
    <p>No model data available.</p>
  {% endif %}
{% else %}
  <p>Model information not set for this product.</p>
{% endif %}

Explanation:

• The code retrieves the model_handle MetaField from the product.
• It then accesses the corresponding model MetaObject from the collection.
• If the model exists, it displays the model’s name, height, wearing size, bust, waist, and hips.
• Fallback messages ensure a smooth user experience when data is missing.

‍

Part 2: Managing Partner & Influencer Profiles Using MetaObjects

Beyond product fit details, showcasing partner profiles—such as influencers, collaborators, or brands—can build credibility and drive engagement.

2.1 Creating a Partner MetaObject

Step 1: Define the “Partner” MetaObject

1. Access Shopify Admin: Go to Settings > MetaObjects.
2. Create a New MetaObject: Name it “Partner.”
3. Add Relevant Fields:
   • Name: Single line text
   • Bio: Multi-line text
   • Image URL: URL field (for profile images)
   • Instagram: URL field (or other social link)
   • Twitter: URL field
   • Category: Single line text or dropdown (e.g., Influencer, Brand, Collaborator)

This setup is designed for intuitive data entry by marketing teams without the need for code.

Step 2: Populate Partner Data

Add entries for each partner using the admin interface. For instance:

• Name: Jane Doe
• Bio: “Fashion influencer and stylist with over 100K followers.”
• Image URL: https://example.com/images/jane-doe.jpg
• Instagram: https://instagram.com/jane_doe
• Twitter: https://twitter.com/jane_doe
• Category: Influencer

2.2 Displaying Partner Profiles on a Dedicated Page

Create a new page template (for example, partners.liquid) to showcase partner profiles. Use the following Liquid code:

liquid:‍

<div class="partners">
  <h2>Our Partners & Influencers</h2>
  {% for partner in shop.metaobjects.partners %}
    <div class="partner-profile">
      {% if partner.fields.image_url.value %}
        <img src="{{ partner.fields.image_url.value }}" alt="{{ partner.fields.name.value }}">
      {% endif %}
      <h3>{{ partner.fields.name.value }}</h3>
      <p>{{ partner.fields.bio.value }}</p>
      <div class="social-links">
        {% if partner.fields.instagram.value %}
          <a href="{{ partner.fields.instagram.value }}" target="_blank">Instagram</a>
        {% endif %}
        {% if partner.fields.twitter.value %}
          <a href="{{ partner.fields.twitter.value }}" target="_blank">Twitter</a>
        {% endif %}
      </div>
    </div>
  {% endfor %}
</div>

Explanation:

• The code loops through all partner MetaObjects stored under the “partners” collection.
• It displays each partner’s image, name, bio, and social media links.
• This makes it easy for your team to update or add new profiles via the Shopify Admin.

‍

Best Practices and Final Considerations

3.1 Maintain Consistency and Simplicity

• Clear Field Labels: Use intuitive names and descriptions in the admin for each MetaField and MetaObject field.
• Consistent Formatting: Ensure that all measurements and data (e.g., units like “cm” or “m”) are entered in a consistent format.

‍

3.2 Scalability

• Modular Design: Both model and partner sections are built with scalability in mind. New fields can be added later with minimal changes to your templates.
• Reusability: The same MetaObjects can be linked to multiple products or pages. For example, updating a model’s profile will automatically reflect on all products that reference that model.

‍

3.3 Enhanced Customer Experience

• Transparent Fit Information: Displaying model measurements alongside the size they’re wearing helps customers make informed decisions.
• Engaging Partner Profiles: Showcasing influencers and partner brands builds credibility and deepens customer trust in your brand.

‍

Conclusion

By adopting a user-friendly approach with Shopify’s MetaFields and MetaObjects, you can dynamically display essential product details—such as model measurements and size charts—and manage partner profiles without dealing with raw JSON. This method empowers non-technical users to update information directly via the Shopify Admin, ensuring a consistent, scalable, and engaging storefront.

Whether you’re reducing returns by clarifying fit information or building brand credibility with influencer collaborations, these advanced customizations pave the way for a more dynamic, data-rich, and customer-centric online experience.

Happy customizing, and may your Shopify store continue to thrive both locally and globally!

‍

About UNHYDE®

UNHYDE is a Munich-based web development agency dedicated to pushing boundaries in web development, user experience, and digital marketing. Our mission is to create high-performing digital platforms that drive meaningful customer engagement and measurable business growth. We operate internationally and are a recognized Shopify Partner agency, having successfully launched countless websites and webstores worldwide.

‍

We're here to help !

For more insights or if you're ready to take your website to the next level, feel free to reach out to us at UNHYDE®, the web design agency. We’re always here to collaborate and craft tailored solutions that meet your unique needs.