CODEWITHSUNDEEP
shopifyliquidshopify-template
Graeme Bryson
Graeme Bryson

Reputation: 193

Custom, reusable product templates with 2.0 blocks

I'm attempting to a create a custom product template, but the current instance is not reusable across multiple products (although I need it to be) — any changes made to one product using the template is also made to all others using it, which is not the desired behavior.

I've included a sample template and section (simplified) here for context on the current approach:

Template

{% layout "theme" %}

<div class="content--product">

    <!-- Product Title -->
    <div class="product__title">
        <h1>{{ product.title }}</h1>
    </div>

    <!-- Features (Custom Block) -->
    {% section 'product-extended-features' %}   

</div>

Section

{% comment %} Product Features (Custom Block) {% endcomment %}

{% schema %}
{
  "name": "Features",
  "blocks": [
    {
      "type": "Feature",
      "name": "Item",
      "settings": [
        {
          "type": "text",
          "id": "heading",
          "label": "Content"
        }
      ]
    }
  ]
}
{% endschema %}

{% comment %} Output component {% endcomment %}
{% if section.blocks.size > 0 %}
  <div class="feed--features">
    {% for block in section.blocks %}
      <div class="item">
        <img class="item__image" src="{{ 'icon__check.svg' | asset_url }}" loading="eager">
        <p class="item__content">{{ block.settings.heading | escape }}</p>
      </div>
    {% endfor %}
  </div>
{% endif %}

As I understand it, the problem occurs because the custom product data is being stored to the section — I've read that passing product data in a var to a snippet using the {% render %} tag allows you to target the current product only, but I can't place the schema required for the custom block(s) in a snippet.

I've scoured the forums and third-party resources for information on using custom blocks with product-specific content within one template for all products — can anyone offer some clarification, or at least point me in the direction of some information specific to reusable product templates using custom 2.0 blocks?

Edit [Metafields]: Adding some additional context as to why metafields are not viable; many of the blocks require 'repeater' (loop) functionality, so when extrapolated out over multiple blocks throughout the template, I expect we could end up requiring hundreds of unique metafields.

Upvotes: 0

Views: 257

Answers (1)

Shania
Shania

Reputation: 317

If you need the "settings" to be tied to a specific product, it's better to use product metafields instead of the theme customizer settings.

To create a metafield, go to shopify admin > settings > custom data > products, then create a definition for your product metafield.

After setting up the product metafield definition, go to a product in shopify admin and you can see at the very bottom a section where you can add values to the metafield.

You can output these metafields to your theme. These values are tied to a each product which means you can use different values.

Reference: https://www.shopify.com/partners/blog/metafields

Upvotes: 0

Related Questions