Narrative theme

  1. In your Shopify Admin click Online Store.
  2. Click to Current Theme's Actions > Edit code.
  3. Open the product-form.liquid file under the Snippets area of your Theme Editor.
  4. Copy the code below.
    {% unless product.metafields.coattend.enabled %}
    <button class="btn btn--to-secondary btn--full product__add-to-cart-button{% if section.settings.enable_payment_button and current_variant.available %} shopify-payment-btn btn--secondary{% endif %}"
     data-cart-submit
     type="submit" name="add"
     {% unless current_variant.available %} disabled="true"{% endunless %}
     aria-label="{{ button_text }}"
    >
     <span class="primary-text" aria-hidden="false" data-cart-primary-submit-text>
       {{ button_text }}
     </span>
     <span class="secondary-text" aria-hidden=true data-cart-secondary-submit-text>{{ 'products.product.view_cart' | t }}</span>
    </button>
    <p class="product__notification text-small text-center" data-cart-notification></p>
    {% if section.settings.enable_payment_button and current_variant.available %}
     {{ form | payment_button }}
    {% endif %}
    {% else %}
     <div class="coattend-button btn btn--to-secondary btn--full product__add-to-cart-button{% if section.settings.enable_payment_button and current_variant.available %} shopify-payment-btn btn--secondary{% endif %}" {% unless current_variant.available %} disabled="true"{% endunless %}
             aria-label="{{ button_text }}" 
             data-coattend-product-id="{{product.id}}" 
             data-coattend-variant-id="{{product.selected_variant.id}}">
     <span class="primary-text" aria-hidden="false" data-cart-primary-submit-text>
       {{ button_text }}
     </span>
     <span class="secondary-text" aria-hidden=true data-cart-secondary-submit-text>{{ 'products.product.view_cart' | t }}</span>
    </div>
    {% endunless %}
  5. Replace code from line 50 to 64. You can see what needs to be replaced on the below image. Narrative theme code that needs to be replaced Narrative theme code that needs to be replaced.
  6. Click Save

Congratulations! Continue and display your event.