Metafields

Metafields

Metafields

How to make metafields available on the wishlist page.
☝
Metafield limits Please note

Adding the metafield via Code Access

First the metafield needs to be made available in Code Access under “Custom Data”. Simply edit the placeholder code below add your metafield’s namespace as well as key.

export const productMetafields = [
  { namespace: "custom", key: "mykey" },
]

Display metafield on wishlist page

Custom Product Cards

${product.metafields.namespace.key}

// When metafields contain HTML
${this.unsafeHTML(product.metafields.custom?.unit_price_und_price_taxes_notice)}

Example

  renderProductTitle({ product, variant }) {
    if (!this.showProductTitle) {
      return;
    }
    return html`
      <div class="wk-product-title">
        <a class="wk-text-link" href=${this.getProductUrl(product, variant)}>
          ${product.title}
        </a>
        ${product.metafields.custom.unit_price_und_price_taxes_notice}
      </div>
    `;
  }