My 'Add to Cart' button isn't working!

Solved
Tourist
7 0 0

Hello! I'm using the theme Brooklyn and my 'Add to Cart' button isn't working! It was working fine the other day but now it's not! Please help!

This is my site link; https://www.untitledco.com.au

0 Likes
Shopify Partner
434 83 93

Hello 

              <div class="product-single__add-to-cart{% if section.settings.add_to_cart_button_size == 'large' %} product-single__add-to-cart--full-width{% endif %}">
                <button type="submit" name="add" id="AddToCart--{{ section.id }}" class="btn btn--add-to-cart{% if section.settings.enable_payment_button %} btn--secondary-accent{% endif %}"{% unless current_variant.available %} disabled="disabled"{% endunless %}>
                  <span class="btn__text">
                    {% if current_variant.available %}
                      {{ 'products.product.add_to_cart' | t }}
                    {% else %}
                      {{ 'products.product.sold_out' | t }}
                    {% endif %}
                  </span>
                </button>
                {% if section.settings.enable_payment_button %}
                  {{ form | payment_button }}
                {% endif %}
              </div>

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
0 Likes

Hello 
Please share your code of this file here

Online Store-> Themes -> Edit code->Sections->product-template.liquid

 

or 

 

Mail me:

Email: pallavi@oscprofessionals.com

So that i can provide you solution here.

Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
0 Likes
Tourist
7 0 0

<!-- /templates/product.liquid -->
<div itemscope itemtype="http://schema.org/Product" id="ProductSection--{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="product-template" data-image-zoom-type="{{ section.settings.zoom_enable }}" data-enable-history-state="true" data-scroll-to-image="{% if section.settings.image_layout == "stacked" %}true{% else %}false{% endif %}">

<meta itemprop="url" content="{{ shop.url }}{{ product.url }}">
<meta itemprop="image" content="{{ product.featured_image.src | img_url: 'grande' }}">

{% assign current_variant = product.selected_or_first_available_variant %}
{% assign featured_image = current_variant.featured_image | default: product.featured_image %}

<div class="grid product-single">
<div class="grid__item large--seven-twelfths medium--seven-twelfths text-center">

{% if section.settings.image_layout == "stacked" %}
{% comment %}
Default or stacked layout
{% endcomment %}

{% comment %}
We need to figure out the max width we want the image to be on the page
based on the aspect ratio of the image and based on the size of the
image.
{% endcomment %}
<div class="product-single__photos">
{% capture img_id_class %}product-single__photo-{{ featured_image.id }}{% endcapture %}
{% capture wrapper_id %}ProductImageWrapper-{{ featured_image.id }}{% endcapture %}

{% comment %}
Display current variant image
{% endcomment %}
<div class="product-single__photo--flex-wrapper">
<div class="product-single__photo--flex">
{% include 'image-style' with image: featured_image, width: 575, height: 850, small_style: true, wrapper_id: wrapper_id, img_id_class: img_id_class %}
<div id="{{ wrapper_id }}" class="product-single__photo--container">
<div class="product-single__photo-wrapper" style="padding-top:{{ 1 | divided_by: featured_image.aspect_ratio | times: 100}}%;">
{% assign img_url = featured_image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
<img class="product-single__photo lazyload {{ img_id_class }}"
src="{{ featured_image | img_url: '300x300' }}"
data-src="{{ img_url }}"
data-widths="[180, 360, 590, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ featured_image.aspect_ratio }}"
data-sizes="auto"
{% if section.settings.zoom_enable %}data-mfp-src="{{ featured_image | img_url: '1024x1024' }}"{% endif %}
data-image-id="{{ featured_image.id }}"
alt="{{ featured_image.alt | escape }}">

<noscript>
<img class="product-single__photo"
src="{{ featured_image | img_url: 'master' }}"
{% if section.settings.zoom_enable %}data-mfp-src="{{ featured_image | img_url: '1024x1024' }}"{% endif %}
alt="{{ featured_image.alt | escape }}" data-image-id="{{ featured_image.id }}">
</noscript>
</div>
</div>
</div>
</div>

{% comment %}
Display rest of product images, not repeating the featured one
{% endcomment %}
{% for image in product.images %}
{% unless image contains featured_image %}

{% comment %}
We need to figure out the max width we want the image to be on the page
based on the aspect ratio of the image and based on the size of the
image.
{% endcomment %}
{% capture img_id_class %}product-single__photo-{{ image.id }}{% endcapture %}
{% capture wrapper_id %}ProductImageWrapper-{{ image.id }}{% endcapture %}

<div class="product-single__photo--flex-wrapper">
<div class="product-single__photo--flex">
{% include 'image-style' with image: image, width: 575, height: 850, small_style: true, wrapper_id: wrapper_id, img_id_class: img_id_class %}
<div id="{{ wrapper_id }}" class="product-single__photo--container">
<div class="product-single__photo-wrapper" style="padding-top:{{ 1 | divided_by: image.aspect_ratio | times: 100}}%;">
{% assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
<img class="product-single__photo lazyload {{ img_id_class }}"
src="{{ image | img_url: '300x' }}"
data-src="{{ img_url }}"
data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ image.aspect_ratio }}"
data-sizes="auto"
{% if section.settings.zoom_enable %}data-mfp-src="{{ image.src | img_url: '1024x1024' }}"{% endif %}
data-image-id="{{ image.id }}"
alt="{{ image.alt | escape }}">

<noscript>
<img class="product-single__photo" src="{{ image.src | img_url: 'master' }}"
{% if section.settings.zoom_enable %}data-mfp-src="{{ image.src | img_url: '1024x1024' }}"{% endif %}
alt="{{ image.alt | escape }}"
data-image-id="{{ image.id }}">
</noscript>
</div>
</div>
</div>
</div>
{% endunless %}
{% endfor %}

</div>

{% else %}
{% comment %}
Thumbnails layout
{% endcomment %}

<div class="product-thumbnail__photos product-single__photos">

{% comment %}
We need to figure out the max width we want the image to be on the page
based on the aspect ratio of the image and based on the size of the
image.
{% endcomment %}
{% capture img_id_class %}product-single__photo-{{ featured_image.id }}{% endcapture %}
{% capture wrapper_id %}ProductImageWrapper-{{ featured_image.id }}{% endcapture %}

{% comment %}
Display current variant image
{% endcomment %}
<div class="product-single__photo--flex-wrapper">
<div class="product-single__photo--flex">
{% include 'image-style' with image: featured_image, width: 575, height: 850, small_style: true, wrapper_id: wrapper_id, img_id_class: img_id_class %}
<div id="{{ wrapper_id }}" class="product-single__photo--container product-single__photo--container-thumb">
<div class="product-single__photo-wrapper" style="padding-top:{{ 1 | divided_by: featured_image.aspect_ratio | times: 100}}%;">
{% assign img_url = featured_image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
<img class="product-single__photo lazyload {{ img_id_class }}"
src="{{ featured_image | img_url: '300x300' }}"
data-src="{{ img_url }}"
data-widths="[180, 360, 590, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ featured_image.aspect_ratio }}"
data-sizes="auto"
{% if section.settings.zoom_enable %}data-mfp-src="{{ featured_image | img_url: '1024x1024' }}"{% endif %}
data-image-id="{{ featured_image.id }}"
alt="{{ featured_image.alt | escape }}">

<noscript>
<img class="product-single__photo"
src="{{ featured_image | img_url: 'master' }}"
{% if section.settings.zoom_enable %}data-mfp-src="{{ featured_image | img_url: '1024x1024' }}"{% endif %}
alt="{{ featured_image.alt | escape }}" data-image-id="{{ featured_image.id }}">
</noscript>
</div>
</div>
</div>
</div>

{% comment %}
Populate rest of product images with display = none, not repeating the featured one
{% endcomment %}
{% for image in product.images %}
{% unless image contains featured_image %}

{% comment %}
We need to figure out the max width we want the image to be on the page
based on the aspect ratio of the image and based on the size of the
image.
{% endcomment %}
{% capture img_id_class %}product-single__photo-{{ image.id }}{% endcapture %}
{% capture wrapper_id %}ProductImageWrapper-{{ image.id }}{% endcapture %}

<div class="product-single__photo--flex-wrapper">
<div class="product-single__photo--flex">
{% include 'image-style' with image: image, width: 575, height: 850, small_style: true, wrapper_id: wrapper_id, img_id_class: img_id_class %}
<div id="{{ wrapper_id }}" class="product-single__photo--container product-single__photo--container-thumb hide">
<div class="product-single__photo-wrapper" style="padding-top:{{ 1 | divided_by: image.aspect_ratio | times: 100}}%;">
{% assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
<img class="product-single__photo lazyload {{ img_id_class }}"
src="{{ image | img_url: '300x' }}"
data-src="{{ img_url }}"
data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
data-aspectratio="{{ image.aspect_ratio }}"
data-sizes="auto"
{% if section.settings.zoom_enable %}data-mfp-src="{{ image.src | img_url: '1024x1024' }}"{% endif %}
data-image-id="{{ image.id }}"
alt="{{ image.alt | escape }}">

<noscript>
<img class="product-single__photo" src="{{ image.src | img_url: 'master' }}"
{% if section.settings.zoom_enable %}data-mfp-src="{{ image.src | img_url: '1024x1024' }}"{% endif %}
alt="{{ image.alt | escape }}"
data-image-id="{{ image.id }}">
</noscript>
</div>
</div>
</div>
</div>
{% endunless %}
{% endfor %}

{% comment %}
Display thumbnails
{% endcomment %}
<ul class="product-single__thumbnails small--hide grid-uniform" id="ProductThumbs">
{% for image in product.images %}
{% if product.images.size > 1 %}
<li class="grid__item medium--one-third large--one-quarter product-single__photo-wrapper">
<a data-image-id="{{ image.id }}" href="{{ image.src | img_url: 'grande' }}" class="product-single__thumbnail {% if image contains featured_image %} active-thumb{% endif %}">
<img class="product-single__thumb" src="{{ image.src | img_url: '150x' }}" alt="{{ image.alt | escape }}">
</a>
</li>
{% endif %}
{% endfor %}
</ul>

</div>
{% endif %}
</div>

<div class="grid__item product-single__meta--wrapper medium--five-twelfths large--five-twelfths">
<div class="product-single__meta">
{% if section.settings.product_vendor_enable %}
<h2 class="product-single__vendor" itemprop="brand">{{ product.vendor }}</h2>
{% endif %}

<h1 class="product-single__title" itemprop="name">{{ product.title }}</h1>

<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
{% comment %}
Optionally show the 'compare at' or original price of the product.
{% endcomment %}
{% include 'product-price', variant: current_variant %}

{%- if shop.taxes_included or shop.shipping_policy.body != blank -%}
<div class="product-single__policies rte">
{%- if shop.taxes_included -%}
{{ 'products.general.include_taxes' | t }}
{%- endif -%}
{%- if shop.shipping_policy.body != blank -%}
{{ 'products.general.shipping_policy_html' | t: link: shop.shipping_policy.url }}
{%- endif -%}
</div>
{%- endif -%}

<hr class="hr--small">

<meta itemprop="priceCurrency" content="{{ cart.currency.iso_code }}">
<link itemprop="availability" href="http://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}">

{% capture "form_classes" %}
product-single__form{% if product.has_only_default_variant %} product-single__form--no-variants{% endif %}
{%- endcapture %}

{% capture "form_id" %}AddToCartForm--{{ section.id }}{%- endcapture %}

{% form 'product', product, class:form_classes, id:form_id, data-product-form: '' %}
{% unless product.has_only_default_variant %}
{% for option in product.options_with_values %}
<div class="radio-wrapper js product-form__item">
<label class="single-option-radio__label"
for="ProductSelect-option-{{ forloop.index0 }}">
{{ option.name | escape }}
</label>
{% if section.settings.product_selector == 'radio' %}
<fieldset class="single-option-radio"
id="ProductSelect-option-{{ forloop.index0 }}">
{% assign option_index = forloop.index %}
{% for value in option.values %}
{% assign variant_label_state = true %}
{% if product.options.size == 1 %}
{% unless product.variants[forloop.index0].available %}
{% assign variant_label_state = false %}
{% endunless %}
{% endif %}
<input type="radio"
{% if option.selected_value == value %} checked="checked"{% endif %}
{% unless variant_label_state %} disabled="disabled"{% endunless %}
value="{{ value | escape }}"
data-index="option{{ option_index }}"
name="option{{ option.position }}"
class="single-option-selector__radio{% unless variant_label_state %} disabled{% endunless %}"
id="ProductSelect-option-{{ option.name | handleize }}-{{ value | escape }}">
<label for="ProductSelect-option-{{ option.name | handleize }}-{{ value | escape }}"{% unless variant_label_state %} class="disabled"{% endunless %}>{{ value | escape }}</label>
{% endfor %}
</fieldset>
{% else %}
<select class="single-option-selector__radio single-option-selector-{{ section.id }} product-form__input" id="SingleOptionSelector-{{ forloop.index0 }}" data-index="option{{ forloop.index }}">
{% for value in option.values %}
<option value="{{ value | escape }}"{% if option.selected_value == value %} selected="selected"{% endif %}>{{ value | escape }}</option>
{% endfor %}
</select>
{% endif %}
</div>
{% endfor %}
{% endunless %}

<select name="id" id="ProductSelect" class="product-single__variants no-js">
{% for variant in product.variants %}
{% if variant.available %}
<option {% if variant == product.selected_or_first_available_variant %}
selected="selected" {% endif %}
data-sku="{{ variant.sku }}"
value="{{ variant.id }}">
{{ variant.title }} - {{ variant.price | money_with_currency }}
</option>
{% else %}
<option disabled="disabled">
{{ variant.title }} - {{ 'products.product.sold_out' | t }}
</option>
{% endif %}
{% endfor %}
</select>

{% if section.settings.quantity_enabled %}
<div class="product-single__quantity">
<label for="Quantity" class="product-single__quantity-label js-quantity-selector">{{ 'products.product.quantity' | t }}</label>
<input type="number" hidden="hidden" id="Quantity" name="quantity" value="1" min="1" class="js-quantity-selector">
</div>
{% endif %}
<div class="product-single__description rte" itemprop="description">
{{ product.description }}
</div>
<div class="product-single__add-to-cart{% if section.settings.add_to_cart_button_size == 'large' %} product-single__add-to-cart--full-width{% endif %}">
<button type="submit" name="add" id="AddToCart--{{ section.id }}" class="btn btn--add-to-cart{% if section.settings.enable_payment_button %} btn--secondary-accent{% endif %}"{% unless current_variant.available %} disabled="disabled"{% endunless %}>
<span class="btn__text">
{% if current_variant.available %}
{{ 'products.product.add_to_cart' | t }}
{% else %}
{{ 'products.product.sold_out' | t }}
{% endif %}
</span>
</button>
{% if section.settings.enable_payment_button %}
{{ form | payment_button }}
{% endif %}
{% endform %}
</div>


</div>
{% if section.settings.social_sharing_products %}
{% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
{% endif %}
</div>
</div>
</div>
</div>
{% unless product == empty %}
<script type="application/json" id="ProductJson-{{ section.id }}">
{{ product | json }}
</script>
{% endunless %}

 

{% schema %}
{
"name": {
"da": "Produktsider",
"de": "Produktseiten",
"en": "Product pages",
"es": "Páginas de productos",
"fi": "Tuotesivut",
"fr": "Pages de produits",
"hi": "उत्पाद पेज",
"it": "Pagine di prodotto",
"ja": "商品ページ",
"ko": "제품 페이지",
"ms": "Halaman produk",
"nb": "Produktsider",
"nl": "Productpagina's",
"pt-BR": "Páginas de produtos",
"pt-PT": "Páginas de produtos",
"sv": "Produktsidor",
"th": "หน้าสินค้า",
"zh-CN": "产品页面",
"zh-TW": "產品頁面"
},
"settings": [
{
"type": "checkbox",
"id": "zoom_enable",
"label": {
"da": "Aktivér billedzoom",
"de": "Aktivieren des Bildzooms",
"en": "Enable image zoom",
"es": "Habilitar zoom de imagen",
"fi": "Ota kuvan zoomaus käyttöön",
"fr": "Activer le zoom sur image",
"hi": "इमेज ज़ूम सक्षम करें",
"it": "Abilita lo zoom dell'immagine",
"ja": "画像ズームを有効にする",
"ko": "이미지 확대 사용",
"ms": "Dayakan zum imej",
"nb": "Aktiver bildezoom",
"nl": "Inzoomen op afbeelding inschakelen",
"pt-BR": "Habilite o zoom da imagem",
"pt-PT": "Ativar o zoom da imagem",
"sv": "Aktivera bildzoom",
"th": "เปิดใช้การซูมภาพ",
"zh-CN": "启用图片缩放",
"zh-TW": "啟用圖片縮放"
}
},
{
"type": "checkbox",
"id": "social_sharing_products",
"label": {
"da": "Aktivér produktdeling",
"de": "Teilen von Produkten aktivieren",
"en": "Enable product sharing",
"es": "Habilitar compartir productos",
"fi": "Ota tuotejako käyttöön",
"fr": "Activer le partage de produits",
"hi": "उत्पाद साझाकरण सक्षम करें",
"it": "Permetti condivisione del prodotto",
"ja": "商品の共有を有効にする",
"ko": "제품 공유 활성화",
"ms": "Dayakan perkongsian produk",
"nb": "Aktiver produktdeling",
"nl": "Schakel het delen van producten in",
"pt-BR": "Habilite o compartilhamento de produtos",
"pt-PT": "Ativar a partilha de produtos",
"sv": "Aktivera produktdelning",
"th": "เปิดใช้การแชร์สินค้า",
"zh-CN": "启用产品分享",
"zh-TW": "啟用產品分享"
},
"default": true
},
{
"type": "checkbox",
"id": "product_vendor_enable",
"label": {
"da": "Vis produktleverandør",
"de": "Produktverkäufer anzeigen",
"en": "Show product vendor",
"es": "Mostrar proveedor del producto",
"fi": "Näytä tuotteen myyjä",
"fr": "Afficher le distributeur du produit",
"hi": "उत्पाद विक्रेता दिखाएं",
"it": "Indica fornitore prodotto",
"ja": "商品の販売元を表示する",
"ko": "제품 공급 업체 표시",
"ms": "Tunjukkan vendor produk",
"nb": "Vis produktleverandør",
"nl": "Productleverancier weergeven",
"pt-BR": "Exiba o fornecedor do produto",
"pt-PT": "Mostrar o fornecedor do produto",
"sv": "Visa produktsäljare",
"th": "แสดงผู้ขายสินค้า",
"zh-CN": "显示产品厂商",
"zh-TW": "顯示產品廠商"
}
},
{
"type": "select",
"id": "image_layout",
"label": {
"da": "Billedvisning",
"de": "Bildanzeige",
"en": "Image display",
"es": "Visualización de imagen",
"fi": "Näytä kuva",
"fr": "Affichage de l'image",
"hi": "इमेज प्रदर्शन",
"it": "Visualizzazione immagine",
"ja": "画像表示",
"ko": "이미지 표시",
"ms": "Paparan imej",
"nb": "Bildevisning",
"nl": "Beeldweergave",
"pt-BR": "Exibição de imagem",
"pt-PT": "Apresentação de imagem",
"sv": "Bildskärm",
"th": "การแสดงรูปภาพ",
"zh-CN": "图片显示",
"zh-TW": "圖片顯示"
},
"default": "stacked",
"options": [
{
"value": "stacked",
"label": {
"da": "Stablet",
"de": "Gestapelt",
"en": "Stacked",
"es": "Stacked",
"fi": "Pinottu",
"fr": "Empiler",
"hi": "स्टैक्ड",
"it": "Elenco",
"ja": "スタックされました",
"ko": "누적",
"ms": "Ditindan",
"nb": "Stablet",
"nl": "Gestapeld",
"pt-BR": "Empilhado",
"pt-PT": "Empilhado",
"sv": "Staplade",
"th": "ซ้อน",
"zh-CN": "已堆叠",
"zh-TW": "已堆疊"
}
},
{
"value": "thumbnails",
"label": {
"da": "Miniaturer",
"de": "Vorschaubilder",
"en": "Thumbnails",
"es": "Miniaturas",
"fi": "Pikkukuvat",
"fr": "Vignettes",
"hi": "थंबनेल",
"it": "Miniature",
"ja": "サムネイル",
"ko": "썸네일",
"ms": "Imej kecil",
"nb": "Miniatyrbilder",
"nl": "Miniatuurafbeeldingen",
"pt-BR": "Miniaturas",
"pt-PT": "Miniaturas",
"sv": "Förhandsbilder",
"th": "ขนาดย่อ",
"zh-CN": "缩略图",
"zh-TW": "縮圖"
}
}
]
},
{
"type": "header",
"content": {
"da": "Formular for produktmuligheder",
"de": "Produktoptionsformular",
"en": "Product options form",
"es": "Formulario de opciones de producto",
"fi": "Tuotevaihtoehtolomake",
"fr": "Formulaire d'options de produit",
"hi": "उत्पाद के विकल्प फ़ॉर्म",
"it": "Modulo delle opzioni di prodotto",
"ja": "商品オプションのフォーム",
"ko": "제품 옵션 양식",
"ms": "Borang opsyen produk",
"nb": "Skjema for produktalternativer",
"nl": "Formulier productopties",
"pt-BR": "Formulário de opções de produtos",
"pt-PT": "Formulário de opções de produtos",
"sv": "Produktalternativsformulär",
"th": "แบบฟอร์มตัวเลือกสินค้า",
"zh-CN": "产品选项表单",
"zh-TW": "產品選項表單"
}
},
{
"type": "checkbox",
"id": "quantity_enabled",
"label": {
"da": "Vis antalsvælger",
"de": "Mengenauswahl anzeigen",
"en": "Show quantity picker",
"es": "Mostrar selector de cantidad",
"fi": "Näytä määrän valintatyökalu",
"fr": "Afficher le sélecteur de quantité",
"hi": "मात्रा पिकर दिखाएं",
"it": "Mostra selettore di quantità",
"ja": "数量ピッカーを表示する",
"ko": "수량 피커 표시",
"ms": "Tunjukkan pemetik kuantiti",
"nb": "Vis mengdevelger",
"nl": "Hoeveelheidskiezer weergeven",
"pt-BR": "Exibir seletor de quantidade",
"pt-PT": "Mostrar seletor de quantidade",
"sv": "Visa kvantitetsväljaren",
"th": "แสดงตัวเลือกจำนวน",
"zh-CN": "显示数量选择器",
"zh-TW": "顯示數量選擇器"
}
},
{
"type": "select",
"id": "product_selector",
"label": {
"da": "Vælgertype",
"de": "Auswahlart",
"en": "Picker type",
"es": "Tipo de selector",
"fi": "Määrän valintatyökalu",
"fr": "Type de sélecteur",
"hi": "पिकर के प्रकार",
"it": "Tipo di selettore",
"ja": "ピッカーの種類",
"ko": "피커 유형",
"ms": "Jenis pemetik",
"nb": "Velgertype",
"nl": "Soort kiezer",
"pt-BR": "Tipo de seletor",
"pt-PT": "Tipo de seletor",
"sv": "Väljartyp",
"th": "ประเภทของตัวเลือก",
"zh-CN": "选择器类型",
"zh-TW": "選擇器類型"
},
"options": [
{
"value": "radio",
"label": {
"da": "Knap",
"de": "Schaltfläche",
"en": "Button",
"es": "Botón",
"fi": "Painike",
"fr": "Bouton",
"hi": "बटन",
"it": "Pulsante",
"ja": "ボタン",
"ko": "버튼",
"ms": "Butang",
"nb": "Knapp",
"nl": "Knop",
"pt-BR": "Botão",
"pt-PT": "Botão",
"sv": "Knapp",
"th": "ปุ่ม",
"zh-CN": "按钮",
"zh-TW": "按鈕"
}
},
{
"value": "select",
"label": {
"da": "Rullemenu",
"de": "Dropdown",
"en": "Dropdown",
"es": "Desplegable",
"fi": "Alasvetovalikko",
"fr": "Menu déroulant",
"hi": "ड्रॉप डाउन",
"it": "Menu a tendina",
"ja": "ドロップダウン",
"ko": "드롭다운",
"ms": "Juntai bawah",
"nb": "Rullegardin",
"nl": "Vervolgkeuzemenu",
"pt-BR": "Menu suspenso",
"pt-PT": "Menu pendente",
"sv": "Rullgardinsmeny",
"th": "ดรอปดาวน์",
"zh-CN": "下拉菜单",
"zh-TW": "下拉式選單"
}
}
]
},
{
"type": "header",
"content": {
"da": "Knappen Læg i indkøbskurven",
"de": "Schaltfläche In den Warenkorb",
"en": "Add to cart button",
"es": "Añadir al carrito",
"fi": "Lisää ostoskoriin -painike",
"fr": "Bouton d'ajout au panier",
"hi": "कार्ट बटन में जोड़ें",
"it": "Pulsante \"Aggiungi al carrello\"",
"ja": "カートボタンに追加する",
"ko": "카트 버튼에 추가",
"ms": "Tambahkan ke butang troli",
"nb": "Legg i handlekurv-knapp",
"nl": "Knop aan winkelwagen toevoegen",
"pt-BR": "Botão Adicionar ao carrinho",
"pt-PT": "Botão Adicionar ao carrinho",
"sv": "Lägg i varukorgen-knappen",
"th": "ปุ่มเพิ่มลงในตะกร้าสินค้า",
"zh-CN": "“添加到购物车”按钮",
"zh-TW": "加入購物車按鈕"
}
},
{
"type": "checkbox",
"id": "enable_payment_button",
"label": {
"da": "Vis dynamisk betalingsknap",
"de": "Dynamischen Checkout-Button anzeigen",
"en": "Show dynamic checkout button",
"es": "Mostrar botón de pago dinámico",
"fi": "Näytä dynaaminen kassapainike",
"fr": "Afficher le bouton de passage à la caisse dynamique",
"hi": "डायनेमिक चेकआउट बटन दिखाएं",
"it": "Mostra pulsante di check-out dinamico",
"ja": "ダイナミックチェックアウトボタンを表示する",
"ko": "동적 결제 버튼 표시",
"ms": "Tunjukkan butang daftar keluar dinamik",
"nb": "Vis dynamisk knapp for å gå til kassen",
"nl": "Dynamische checkout knop weergeven",
"pt-BR": "Exibir botão dinâmico de finalização da compra",
"pt-PT": "Mostrar o botão dinâmico de finalização da compra",
"sv": "Visa dynamiska utcheckningsknappar",
"th": "แสดงปุ่มชำระเงินแบบไดนามิก",
"zh-CN": "显示动态结账按钮",
"zh-TW": "顯示動態結帳按鈕"
},
"info": {
"da": "Den enkelte kunde vil se sin foretrukne betalingsmetode blandt dem, der er tilgængelige i din butik, f.eks. PayPal eller Apple Pay. [Få mere at vide](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"de": "Jeder Kunde sieht seine bevorzugte Zahlungsmethode aus den in Ihrem Shop verfügbaren Zahlungsmethoden wie PayPal oder Apple Pay. [Mehr Informationen](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"en": "Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. [Learn more](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"es": "Cada cliente verá su forma de pago preferida entre las disponibles en tu tienda, como PayPal o Apple Pay. [Más información](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"fi": "Kukin asiakas näkee ensisijaisen valintansa kauppasi tarjoamista maksutavoista, esim. PayPal tai Apple Pay. [Lisätietoja](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"fr": "Chaque client verra son moyen de paiement préféré parmi ceux qui sont proposés sur votre boutique, tels que PayPal ou Apple Pay. [En savoir plus](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"hi": "प्रत्येक ग्राहक आपके स्टोर पर उपलब्ध अपनी पसंदीदा भुगतान की विधि देखेंगे जैसे PayPal या Apple Pay. [अधिक जानें](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"it": "Ogni cliente vedrà il suo metodo di pagamento preferito tra quelli disponibili nel tuo negozio, come PayPal o Apple Pay. [Maggiori informazioni](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"ja": "PayPalやApple Payなど、ストアで利用可能な希望の決済方法がお客様に表示されます。[詳細情報](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"ko": "각 고객은 PayPal 또는 Apple Pay와 같이 스토어에서 사용 가능한 지불 방법을 확인할 수 있습니다. [자세히 알아보기](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"ms": "Setiap pelanggan akan melihat kaedah pembayaran keutamaan mereka dari yang tersedia di kedai anda, seperti PayPal atau Apple Pay. [Ketahui lebih lanjut](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"nb": "Hver enkelt kunde vil se sin foretrukne betalingsmåte blant de som er tilgjengelig i butikken din, som PayPal eller Apple Pay. [Finn ut mer](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"nl": "Elke klant ziet zijn of haar beschikbare voorkeursmethode om af te rekenen, zoals PayPal of Apple Pay. [Meer informatie](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"pt-BR": "Cada cliente verá sua forma de pagamento preferida dentre as disponíveis na loja, como PayPal ou Apple Pay. [Saiba mais](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"pt-PT": "Cada cliente irá ver o seu método de pagamento preferido entre os disponíveis na loja, como o PayPal ou Apple Pay. [Saiba mais](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"sv": "Varje kund kommer att se den föredragna betalningsmetoden från de som finns tillgängliga i din butik, till exempel PayPal eller Apple Pay. [Läs mer](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"th": "ลูกค้าแต่ละรายจะเห็นวิธีการชำระเงินที่ต้องการจากวิธีที่ใช้ได้ในร้านค้าของคุณ เช่น PayPal หรือ Apple Pay [เรียนรู้เพิ่มเติม](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"zh-CN": "每位客户都可在您商店提供的付款方式中看到他们的首选付款方式,例如 PayPal 或 Apple Pay。[了解详情](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
"zh-TW": "每位顧客都可以在您商店內開放使用的付款方式中看見他們偏好使用的方式,如 PayPal、Apple Pay 等。[深入瞭解](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)"
},
"default": true
},
{
"type": "select",
"id": "add_to_cart_button_size",
"label": {
"da": "Knapstørrelse",
"de": "Schaltflächengröße",
"en": "Button size",
"es": "Tamaño del botón",
"fi": "Painikkeen koko",
"fr": "Taille du bouton",
"hi": "बटन का आकार",
"it": "Dimensione pulsante",
"ja": "ボタンのサイズ",
"ko": "버튼 사이즈",
"ms": "Saiz butang",
"nb": "Knappestørrelse",
"nl": "Afmeting knop",
"pt-BR": "Tamanho do botão",
"pt-PT": "Tamanho do botão",
"sv": "Knappstorlek",
"th": "ขนาดปุ่ม",
"zh-CN": "按钮大小",
"zh-TW": "按鈕尺寸"
},
"default": "small",
"options": [
{
"value": "small",
"label": {
"da": "Lille",
"de": "Klein",
"en": "Small",
"es": "Pequeña",
"fi": "Pieni",
"fr": "Petit",
"hi": "छोटा",
"it": "Piccolo",
"ja": "小",
"ko": "스몰",
"ms": "Kecil",
"nb": "Liten",
"nl": "Klein",
"pt-BR": "Pequeno",
"pt-PT": "Pequeno",
"sv": "Liten",
"th": "เล็ก",
"zh-CN": "小",
"zh-TW": "小型"
}
},
{
"value": "large",
"label": {
"da": "Stor",
"de": "Groß",
"en": "Large",
"es": "grande",
"fi": "Suuri",
"fr": "Grand",
"hi": "बड़ा",
"it": "Grande",
"ja": "大",
"ko": "라지",
"ms": "Besar",
"nb": "Stor",
"nl": "Groot",
"pt-BR": "Grande",
"pt-PT": "Grande",
"sv": "Stor",
"th": "ใหญ่",
"zh-CN": "大",
"zh-TW": "大型"
}
}
]
}
]
}
{% endschema %}

 

0 Likes

Success.

Shopify Partner
434 83 93

Try to replace it with this one

<!-- /templates/product.liquid -->
<div itemscope itemtype="http://schema.org/Product" id="ProductSection--{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="product-template" data-image-zoom-type="{{ section.settings.zoom_enable }}" data-enable-history-state="true" data-scroll-to-image="{% if section.settings.image_layout == "stacked" %}true{% else %}false{% endif %}">

    <meta itemprop="url" content="{{ shop.url }}{{ product.url }}">
    <meta itemprop="image" content="{{ product.featured_image.src | img_url: 'grande' }}">

    {% assign current_variant = product.selected_or_first_available_variant %}
    {% assign featured_image = current_variant.featured_image | default: product.featured_image %}

    <div class="grid product-single">
      <div class="grid__item large--seven-twelfths medium--seven-twelfths text-center">

        {% if section.settings.image_layout == "stacked" %}
          {% comment %}
            Default or stacked layout
          {% endcomment %}

          {% comment %}
            We need to figure out the max width we want the image to be on the page
            based on the aspect ratio of the image and based on the size of the
            image.
          {% endcomment %}
          <div class="product-single__photos">
            {% capture img_id_class %}product-single__photo-{{ featured_image.id }}{% endcapture %}
            {% capture wrapper_id %}ProductImageWrapper-{{ featured_image.id }}{% endcapture %}

            {% comment %}
              Display current variant image
            {% endcomment %}
            <div class="product-single__photo--flex-wrapper">
              <div class="product-single__photo--flex">
                {% include 'image-style' with image: featured_image, width: 575, height: 850, small_style: true, wrapper_id: wrapper_id, img_id_class: img_id_class %}
                <div id="{{ wrapper_id }}" class="product-single__photo--container">
                  <div class="product-single__photo-wrapper" style="padding-top:{{ 1 | divided_by: featured_image.aspect_ratio | times: 100}}%;">
                    {% assign img_url = featured_image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
                    <img class="product-single__photo lazyload {{ img_id_class }}"
                      src="{{ featured_image | img_url: '300x300' }}"
                      data-src="{{ img_url }}"
                      data-widths="[180, 360, 590, 720, 900, 1080, 1296, 1512, 1728, 2048]"
                      data-aspectratio="{{ featured_image.aspect_ratio }}"
                      data-sizes="auto"
                      {% if section.settings.zoom_enable %}data-mfp-src="{{ featured_image | img_url: '1024x1024' }}"{% endif %}
                      data-image-id="{{ featured_image.id }}"
                      alt="{{ featured_image.alt | escape }}">

                    <noscript>
                      <img class="product-single__photo"
                        src="{{ featured_image | img_url: 'master' }}"
                        {% if section.settings.zoom_enable %}data-mfp-src="{{ featured_image | img_url: '1024x1024' }}"{% endif %}
                        alt="{{ featured_image.alt | escape }}" data-image-id="{{ featured_image.id }}">
                    </noscript>
                  </div>
                </div>
              </div>
            </div>

            {% comment %}
              Display rest of product images, not repeating the featured one
            {% endcomment %}
            {% for image in product.images %}
              {% unless image contains featured_image %}

                {% comment %}
                  We need to figure out the max width we want the image to be on the page
                  based on the aspect ratio of the image and based on the size of the
                  image.
                {% endcomment %}
                {% capture img_id_class %}product-single__photo-{{ image.id }}{% endcapture %}
                {% capture wrapper_id %}ProductImageWrapper-{{ image.id }}{% endcapture %}

                <div class="product-single__photo--flex-wrapper">
                  <div class="product-single__photo--flex">
                    {% include 'image-style' with image: image, width: 575, height: 850, small_style: true, wrapper_id: wrapper_id, img_id_class: img_id_class %}
                    <div id="{{ wrapper_id }}" class="product-single__photo--container">
                      <div class="product-single__photo-wrapper" style="padding-top:{{ 1 | divided_by: image.aspect_ratio | times: 100}}%;">
                        {% assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
                        <img class="product-single__photo lazyload {{ img_id_class }}"
                          src="{{ image | img_url: '300x' }}"
                          data-src="{{ img_url }}"
                          data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
                          data-aspectratio="{{ image.aspect_ratio }}"
                          data-sizes="auto"
                          {% if section.settings.zoom_enable %}data-mfp-src="{{ image.src | img_url: '1024x1024' }}"{% endif %}
                          data-image-id="{{ image.id }}"
                          alt="{{ image.alt | escape }}">

                        <noscript>
                          <img class="product-single__photo" src="{{ image.src | img_url: 'master' }}"
                            {% if section.settings.zoom_enable %}data-mfp-src="{{ image.src | img_url: '1024x1024' }}"{% endif %}
                            alt="{{ image.alt | escape }}"
                            data-image-id="{{ image.id }}">
                        </noscript>
                      </div>
                    </div>
                  </div>
                </div>
              {% endunless %}
            {% endfor %}

          </div>

        {% else %}
          {% comment %}
            Thumbnails layout
          {% endcomment %}

          <div class="product-thumbnail__photos product-single__photos">

            {% comment %}
              We need to figure out the max width we want the image to be on the page
              based on the aspect ratio of the image and based on the size of the
              image.
            {% endcomment %}
            {% capture img_id_class %}product-single__photo-{{ featured_image.id }}{% endcapture %}
            {% capture wrapper_id %}ProductImageWrapper-{{ featured_image.id }}{% endcapture %}

            {% comment %}
              Display current variant image
            {% endcomment %}
            <div class="product-single__photo--flex-wrapper">
              <div class="product-single__photo--flex">
                {% include 'image-style' with image: featured_image, width: 575, height: 850, small_style: true, wrapper_id: wrapper_id, img_id_class: img_id_class %}
                <div id="{{ wrapper_id }}" class="product-single__photo--container product-single__photo--container-thumb">
                  <div class="product-single__photo-wrapper" style="padding-top:{{ 1 | divided_by: featured_image.aspect_ratio | times: 100}}%;">
                    {% assign img_url = featured_image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
                    <img class="product-single__photo lazyload {{ img_id_class }}"
                      src="{{ featured_image | img_url: '300x300' }}"
                      data-src="{{ img_url }}"
                      data-widths="[180, 360, 590, 720, 900, 1080, 1296, 1512, 1728, 2048]"
                      data-aspectratio="{{ featured_image.aspect_ratio }}"
                      data-sizes="auto"
                      {% if section.settings.zoom_enable %}data-mfp-src="{{ featured_image | img_url: '1024x1024' }}"{% endif %}
                      data-image-id="{{ featured_image.id }}"
                      alt="{{ featured_image.alt | escape }}">

                    <noscript>
                      <img class="product-single__photo"
                        src="{{ featured_image | img_url: 'master' }}"
                        {% if section.settings.zoom_enable %}data-mfp-src="{{ featured_image | img_url: '1024x1024' }}"{% endif %}
                        alt="{{ featured_image.alt | escape }}" data-image-id="{{ featured_image.id }}">
                    </noscript>
                  </div>
                </div>
              </div>
            </div>

            {% comment %}
              Populate rest of product images with display = none, not repeating the featured one
            {% endcomment %}
            {% for image in product.images %}
              {% unless image contains featured_image %}

                {% comment %}
                  We need to figure out the max width we want the image to be on the page
                  based on the aspect ratio of the image and based on the size of the
                  image.
                {% endcomment %}
                {% capture img_id_class %}product-single__photo-{{ image.id }}{% endcapture %}
                {% capture wrapper_id %}ProductImageWrapper-{{ image.id }}{% endcapture %}

                <div class="product-single__photo--flex-wrapper">
                  <div class="product-single__photo--flex">
                    {% include 'image-style' with image: image, width: 575, height: 850, small_style: true, wrapper_id: wrapper_id, img_id_class: img_id_class %}
                    <div id="{{ wrapper_id }}" class="product-single__photo--container product-single__photo--container-thumb hide">
                      <div class="product-single__photo-wrapper" style="padding-top:{{ 1 | divided_by: image.aspect_ratio | times: 100}}%;">
                        {% assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' %}
                        <img class="product-single__photo lazyload {{ img_id_class }}"
                          src="{{ image | img_url: '300x' }}"
                          data-src="{{ img_url }}"
                          data-widths="[180, 360, 540, 720, 900, 1080, 1296, 1512, 1728, 2048]"
                          data-aspectratio="{{ image.aspect_ratio }}"
                          data-sizes="auto"
                          {% if section.settings.zoom_enable %}data-mfp-src="{{ image.src | img_url: '1024x1024' }}"{% endif %}
                          data-image-id="{{ image.id }}"
                          alt="{{ image.alt | escape }}">

                        <noscript>
                          <img class="product-single__photo" src="{{ image.src | img_url: 'master' }}"
                            {% if section.settings.zoom_enable %}data-mfp-src="{{ image.src | img_url: '1024x1024' }}"{% endif %}
                            alt="{{ image.alt | escape }}"
                            data-image-id="{{ image.id }}">
                        </noscript>
                      </div>
                    </div>
                  </div>
                </div>
              {% endunless %}
            {% endfor %}

            {% comment %}
              Display thumbnails
            {% endcomment %}
            <ul class="product-single__thumbnails small--hide grid-uniform" id="ProductThumbs">
              {% for image in product.images %}
                {% if product.images.size > 1 %}
                  <li class="grid__item medium--one-third large--one-quarter product-single__photo-wrapper">
                    <a data-image-id="{{ image.id }}" href="{{ image.src | img_url: 'grande' }}" class="product-single__thumbnail {% if image contains featured_image %} active-thumb{% endif %}">
                      <img class="product-single__thumb" src="{{ image.src | img_url: '150x' }}" alt="{{ image.alt | escape }}">
                    </a>
                  </li>
                {% endif %}
              {% endfor %}
            </ul>

          </div>
        {% endif %}
      </div>

      <div class="grid__item product-single__meta--wrapper medium--five-twelfths large--five-twelfths">
        <div class="product-single__meta">
          {% if section.settings.product_vendor_enable %}
            <h2 class="product-single__vendor" itemprop="brand">{{ product.vendor }}</h2>
          {% endif %}

          <h1 class="product-single__title" itemprop="name">{{ product.title }}</h1>

          <div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
            {% comment %}
              Optionally show the 'compare at' or original price of the product.
            {% endcomment %}
            {% include 'product-price', variant: current_variant %}

            {%- if shop.taxes_included or shop.shipping_policy.body != blank -%}
              <div class="product-single__policies rte">
                {%- if shop.taxes_included -%}
                  {{ 'products.general.include_taxes' | t }}
                {%- endif -%}
                {%- if shop.shipping_policy.body != blank -%}
                  {{ 'products.general.shipping_policy_html' | t: link: shop.shipping_policy.url }}
                {%- endif -%}
              </div>
            {%- endif -%}

            <hr class="hr--small">

            <meta itemprop="priceCurrency" content="{{ cart.currency.iso_code }}">
            <link itemprop="availability" href="http://schema.org/{% if product.available %}InStock{% else %}OutOfStock{% endif %}">

            {% capture "form_classes" %}
              product-single__form{% if product.has_only_default_variant %} product-single__form--no-variants{% endif %}
            {%- endcapture %}

            {% capture "form_id" %}AddToCartForm--{{ section.id }}{%- endcapture %}

            {% form 'product', product, class:form_classes, id:form_id, data-product-form: '' %}
              {% unless product.has_only_default_variant %}
                {% for option in product.options_with_values %}
                  <div class="radio-wrapper js product-form__item">
                    <label class="single-option-radio__label"
                      for="ProductSelect-option-{{ forloop.index0 }}">
                      {{ option.name | escape }}
                    </label>
                    {% if section.settings.product_selector == 'radio' %}
                      <fieldset class="single-option-radio"
                        id="ProductSelect-option-{{ forloop.index0 }}">
                        {% assign option_index = forloop.index %}
                        {% for value in option.values %}
                          {% assign variant_label_state = true %}
                          {% if product.options.size == 1 %}
                            {% unless product.variants[forloop.index0].available  %}
                              {% assign variant_label_state = false %}
                            {% endunless %}
                          {% endif %}
                          <input type="radio"
                            {% if option.selected_value == value %} checked="checked"{% endif %}
                            {% unless variant_label_state %} disabled="disabled"{% endunless %}
                            value="{{ value | escape }}"
                            data-index="option{{ option_index }}"
                            name="option{{ option.position }}"
                            class="single-option-selector__radio{% unless variant_label_state %} disabled{% endunless %}"
                            id="ProductSelect-option-{{ option.name | handleize }}-{{ value | escape }}">
                          <label for="ProductSelect-option-{{ option.name | handleize }}-{{ value | escape }}"{% unless variant_label_state %} class="disabled"{% endunless %}>{{ value | escape }}</label>
                        {% endfor %}
                      </fieldset>
                    {% else %}
                      <select class="single-option-selector__radio single-option-selector-{{ section.id }} product-form__input" id="SingleOptionSelector-{{ forloop.index0 }}" data-index="option{{ forloop.index }}">
                        {% for value in option.values %}
                          <option value="{{ value | escape }}"{% if option.selected_value == value %} selected="selected"{% endif %}>{{ value | escape }}</option>
                        {% endfor %}
                      </select>
                    {% endif %}
                  </div>
                {% endfor %}
              {% endunless %}

              <select name="id" id="ProductSelect" class="product-single__variants no-js">
                {% for variant in product.variants %}
                  {% if variant.available %}
                    <option {% if variant == product.selected_or_first_available_variant %}
                      selected="selected" {% endif %}
                      data-sku="{{ variant.sku }}"
                      value="{{ variant.id }}">
                      {{ variant.title }} - {{ variant.price | money_with_currency }}
                    </option>
                  {% else %}
                    <option disabled="disabled">
                      {{ variant.title }} - {{ 'products.product.sold_out' | t }}
                    </option>
                  {% endif %}
                {% endfor %}
              </select>

              {% if section.settings.quantity_enabled %}
              <div class="product-single__quantity">
                <label for="Quantity" class="product-single__quantity-label js-quantity-selector">{{ 'products.product.quantity' | t }}</label>
                <input type="number" hidden="hidden" id="Quantity" name="quantity" value="1" min="1" class="js-quantity-selector">
              </div>
              {% endif %}

              <div class="product-single__add-to-cart{% if section.settings.add_to_cart_button_size == 'large' %} product-single__add-to-cart--full-width{% endif %}">
                <button type="submit" name="add" id="AddToCart--{{ section.id }}" class="btn btn--add-to-cart{% if section.settings.enable_payment_button %} btn--secondary-accent{% endif %}"{% unless current_variant.available %} disabled="disabled"{% endunless %}>
                  <span class="btn__text">
                    {% if current_variant.available %}
                      {{ 'products.product.add_to_cart' | t }}
                    {% else %}
                      {{ 'products.product.sold_out' | t }}
                    {% endif %}
                  </span>
                </button>
                {% if section.settings.enable_payment_button %}
                  {{ form | payment_button }}
                {% endif %}
              </div>
            {% endform %}

          </div>

          <div class="product-single__description rte" itemprop="description">
            {{ product.description }}
          </div>

          {% if section.settings.social_sharing_products %}
            {% include 'social-sharing', share_title: product.title, share_permalink: product.url, share_image: product %}
          {% endif %}
        </div>
      </div>
    </div>
</div>
{% unless product == empty %}
  <script type="application/json" id="ProductJson-{{ section.id }}">
    {{ product | json }}
  </script>
{% endunless %}



{% schema %}
{
  "name": {
    "da": "Produktsider",
    "de": "Produktseiten",
    "en": "Product pages",
    "es": "Páginas de productos",
    "fi": "Tuotesivut",
    "fr": "Pages de produits",
    "hi": "उत्पाद पेज",
    "it": "Pagine di prodotto",
    "ja": "商品ページ",
    "ko": "제품 페이지",
    "ms": "Halaman produk",
    "nb": "Produktsider",
    "nl": "Productpagina's",
    "pt-BR": "Páginas de produtos",
    "pt-PT": "Páginas de produtos",
    "sv": "Produktsidor",
    "th": "หน้าสินค้า",
    "zh-CN": "产品页面",
    "zh-TW": "產品頁面"
  },
  "settings": [
    {
      "type": "checkbox",
      "id": "zoom_enable",
      "label": {
        "da": "Aktivér billedzoom",
        "de": "Aktivieren des Bildzooms",
        "en": "Enable image zoom",
        "es": "Habilitar zoom de imagen",
        "fi": "Ota kuvan zoomaus käyttöön",
        "fr": "Activer le zoom sur image",
        "hi": "इमेज ज़ूम सक्षम करें",
        "it": "Abilita lo zoom dell'immagine",
        "ja": "画像ズームを有効にする",
        "ko": "이미지 확대 사용",
        "ms": "Dayakan zum imej",
        "nb": "Aktiver bildezoom",
        "nl": "Inzoomen op afbeelding inschakelen",
        "pt-BR": "Ative o zoom da imagem",
        "pt-PT": "Ativar o zoom da imagem",
        "sv": "Aktivera bildzoom",
        "th": "เปิดใช้การซูมภาพ",
        "zh-CN": "启用图片缩放",
        "zh-TW": "啟用圖片縮放"
      }
    },
    {
      "type": "checkbox",
      "id": "social_sharing_products",
      "label": {
        "da": "Aktivér produktdeling",
        "de": "Teilen von Produkten aktivieren",
        "en": "Enable product sharing",
        "es": "Habilitar compartir productos",
        "fi": "Ota tuotejako käyttöön",
        "fr": "Activer le partage de produits",
        "hi": "उत्पाद साझाकरण सक्षम करें",
        "it": "Permetti condivisione del prodotto",
        "ja": "商品の共有を有効にする",
        "ko": "제품 공유 활성화",
        "ms": "Dayakan perkongsian produk",
        "nb": "Aktiver produktdeling",
        "nl": "Schakel het delen van producten in",
        "pt-BR": "Habilite o compartilhamento de produtos",
        "pt-PT": "Ativar a partilha de produtos",
        "sv": "Aktivera produktdelning",
        "th": "เปิดใช้การแชร์สินค้า",
        "zh-CN": "启用产品分享",
        "zh-TW": "啟用產品分享"
      },
      "default": true
    },
    {
      "type": "checkbox",
      "id": "product_vendor_enable",
      "label": {
        "da": "Vis produktleverandør",
        "de": "Produktverkäufer anzeigen",
        "en": "Show product vendor",
        "es": "Mostrar proveedor del producto",
        "fi": "Näytä tuotteen myyjä",
        "fr": "Afficher le distributeur du produit",
        "hi": "उत्पाद विक्रेता दिखाएं",
        "it": "Indica fornitore prodotto",
        "ja": "商品の販売元を表示する",
        "ko": "제품 공급 업체 표시",
        "ms": "Tunjukkan vendor produk",
        "nb": "Vis produktleverandør",
        "nl": "Productleverancier weergeven",
        "pt-BR": "Exiba o fornecedor do produto",
        "pt-PT": "Mostrar o fornecedor do produto",
        "sv": "Visa produktsäljare",
        "th": "แสดงผู้ขายสินค้า",
        "zh-CN": "显示产品厂商",
        "zh-TW": "顯示產品廠商"
      }
    },
    {
      "type": "select",
      "id": "image_layout",
      "label": {
        "da": "Billedvisning",
        "de": "Bildanzeige",
        "en": "Image display",
        "es": "Visualización de imagen",
        "fi": "Näytä kuva",
        "fr": "Affichage de l'image",
        "hi": "इमेज प्रदर्शन",
        "it": "Visualizzazione immagine",
        "ja": "画像表示",
        "ko": "이미지 표시",
        "ms": "Paparan imej",
        "nb": "Bildevisning",
        "nl": "Beeldweergave",
        "pt-BR": "Exibição de imagem",
        "pt-PT": "Apresentação de imagem",
        "sv": "Bildskärm",
        "th": "การแสดงรูปภาพ",
        "zh-CN": "图片显示",
        "zh-TW": "圖片顯示"
      },
      "default": "stacked",
      "options": [
        {
          "value": "stacked",
          "label": {
            "da": "Stablet",
            "de": "Gestapelt",
            "en": "Stacked",
            "es": "Stacked",
            "fi": "Pinottu",
            "fr": "Empiler",
            "hi": "स्टैक्ड",
            "it": "Elenco",
            "ja": "スタックされました",
            "ko": "누적",
            "ms": "Ditindan",
            "nb": "Stablet",
            "nl": "Gestapeld",
            "pt-BR": "Empilhado",
            "pt-PT": "Empilhado",
            "sv": "Staplade",
            "th": "ซ้อน",
            "zh-CN": "已堆叠",
            "zh-TW": "已堆疊"
          }
        },
        {
          "value": "thumbnails",
          "label": {
            "da": "Miniaturer",
            "de": "Vorschaubilder",
            "en": "Thumbnails",
            "es": "Miniaturas",
            "fi": "Pikkukuvat",
            "fr": "Vignettes",
            "hi": "थंबनेल",
            "it": "Miniature",
            "ja": "サムネイル",
            "ko": "썸네일",
            "ms": "Imej kecil",
            "nb": "Miniatyrbilder",
            "nl": "Miniatuurafbeeldingen",
            "pt-BR": "Miniaturas",
            "pt-PT": "Miniaturas",
            "sv": "Förhandsbilder",
            "th": "ขนาดย่อ",
            "zh-CN": "缩略图",
            "zh-TW": "縮圖"
          }
        }
      ]
    },
    {
      "type": "header",
      "content": {
        "da": "Formular for produktmuligheder",
        "de": "Produktoptionsformular",
        "en": "Product options form",
        "es": "Formulario de opciones de producto",
        "fi": "Tuotevaihtoehtolomake",
        "fr": "Formulaire d'options de produit",
        "hi": "उत्पाद के विकल्प फ़ॉर्म",
        "it": "Modulo delle opzioni di prodotto",
        "ja": "商品オプションのフォーム",
        "ko": "제품 옵션 양식",
        "ms": "Borang opsyen produk",
        "nb": "Skjema for produktalternativer",
        "nl": "Formulier productopties",
        "pt-BR": "Formulário de opções de produtos",
        "pt-PT": "Formulário de opções de produtos",
        "sv": "Produktalternativsformulär",
        "th": "แบบฟอร์มตัวเลือกสินค้า",
        "zh-CN": "产品选项表单",
        "zh-TW": "產品選項表單"
      }
    },
    {
      "type": "checkbox",
      "id": "quantity_enabled",
      "label": {
        "da": "Vis antalsvælger",
        "de": "Mengenauswahl anzeigen",
        "en": "Show quantity picker",
        "es": "Mostrar selector de cantidad",
        "fi": "Näytä määrän valintatyökalu",
        "fr": "Afficher le sélecteur de quantité",
        "hi": "मात्रा पिकर दिखाएं",
        "it": "Mostra selettore di quantità",
        "ja": "数量ピッカーを表示する",
        "ko": "수량 피커 표시",
        "ms": "Tunjukkan pemetik kuantiti",
        "nb": "Vis mengdevelger",
        "nl": "Hoeveelheidskiezer weergeven",
        "pt-BR": "Exibir seletor de quantidade",
        "pt-PT": "Mostrar seletor de quantidade",
        "sv": "Visa kvantitetsväljaren",
        "th": "แสดงตัวเลือกจำนวน",
        "zh-CN": "显示数量选择器",
        "zh-TW": "顯示數量選擇器"
      }
    },
    {
      "type": "select",
      "id": "product_selector",
      "label": {
        "da": "Vælgertype",
        "de": "Auswahlart",
        "en": "Picker type",
        "es": "Tipo de selector",
        "fi": "Määrän valintatyökalu",
        "fr": "Type de sélecteur",
        "hi": "पिकर के प्रकार",
        "it": "Tipo di selettore",
        "ja": "ピッカーの種類",
        "ko": "피커 유형",
        "ms": "Jenis pemetik",
        "nb": "Velgertype",
        "nl": "Soort kiezer",
        "pt-BR": "Tipo de seletor",
        "pt-PT": "Tipo de seletor",
        "sv": "Väljartyp",
        "th": "ประเภทของตัวเลือก",
        "zh-CN": "选择器类型",
        "zh-TW": "選擇器類型"
      },
      "options": [
        {
          "value": "radio",
          "label": {
            "da": "Knap",
            "de": "Schaltfläche",
            "en": "Button",
            "es": "Botón",
            "fi": "Painike",
            "fr": "Bouton",
            "hi": "बटन",
            "it": "Pulsante",
            "ja": "ボタン",
            "ko": "버튼",
            "ms": "Butang",
            "nb": "Knapp",
            "nl": "Knop",
            "pt-BR": "Botão",
            "pt-PT": "Botão",
            "sv": "Knapp",
            "th": "ปุ่ม",
            "zh-CN": "按钮",
            "zh-TW": "按鈕"
          }
        },
        {
          "value": "select",
          "label": {
            "da": "Rullemenu",
            "de": "Dropdown",
            "en": "Dropdown",
            "es": "Desplegable",
            "fi": "Alasvetovalikko",
            "fr": "Menu déroulant",
            "hi": "ड्रॉप डाउन",
            "it": "Menu a tendina",
            "ja": "ドロップダウン",
            "ko": "드롭다운",
            "ms": "Juntai bawah",
            "nb": "Rullegardin",
            "nl": "Vervolgkeuzemenu",
            "pt-BR": "Menu suspenso",
            "pt-PT": "Menu pendente",
            "sv": "Rullgardinsmeny",
            "th": "ดรอปดาวน์",
            "zh-CN": "下拉菜单",
            "zh-TW": "下拉式選單"
          }
        }
      ]
    },
    {
      "type": "header",
      "content": {
        "da": "Knappen Læg i indkøbskurven",
        "de": "Schaltfläche In den Warenkorb",
        "en": "Add to cart button",
        "es": "Añadir al carrito",
        "fi": "Lisää ostoskoriin -painike",
        "fr": "Bouton d'ajout au panier",
        "hi": "कार्ट बटन में जोड़ें",
        "it": "Pulsante \"Aggiungi al carrello\"",
        "ja": "カートボタンに追加する",
        "ko": "카트 버튼에 추가",
        "ms": "Tambahkan ke butang troli",
        "nb": "Legg i handlekurv-knapp",
        "nl": "Knop aan winkelwagen toevoegen",
        "pt-BR": "Botão Adicionar ao carrinho",
        "pt-PT": "Botão Adicionar ao carrinho",
        "sv": "Lägg i varukorgen-knappen",
        "th": "ปุ่มเพิ่มลงในตะกร้าสินค้า",
        "zh-CN": "“添加到购物车”按钮",
        "zh-TW": "加入購物車按鈕"
      }
    },
    {
      "type": "checkbox",
      "id": "enable_payment_button",
      "label": {
        "da": "Vis dynamisk betalingsknap",
        "de": "Dynamischen Checkout-Button anzeigen",
        "en": "Show dynamic checkout button",
        "es": "Mostrar botón de pago dinámico",
        "fi": "Näytä dynaaminen kassapainike",
        "fr": "Afficher le bouton de passage à la caisse dynamique",
        "hi": "डायनेमिक चेकआउट बटन दिखाएं",
        "it": "Mostra pulsante di check-out dinamico",
        "ja": "ダイナミックチェックアウトボタンを表示する",
        "ko": "동적 결제 버튼 표시",
        "ms": "Tunjukkan butang daftar keluar dinamik",
        "nb": "Vis dynamisk knapp for å gå til kassen",
        "nl": "Dynamische checkout knop weergeven",
        "pt-BR": "Exibir botão dinâmico de finalização da compra",
        "pt-PT": "Mostrar o botão dinâmico de finalização da compra",
        "sv": "Visa dynamiska utcheckningsknappar",
        "th": "แสดงปุ่มชำระเงินแบบไดนามิก",
        "zh-CN": "显示动态结账按钮",
        "zh-TW": "顯示動態結帳按鈕"
      },
      "info": {
        "da": "Den enkelte kunde vil se sin foretrukne betalingsmetode blandt dem, der er tilgængelige i din butik, f.eks. PayPal eller Apple Pay. [Få mere at vide](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "de": "Jeder Kunde sieht seine bevorzugte Zahlungsmethode aus den in Ihrem Shop verfügbaren Zahlungsmethoden wie PayPal oder Apple Pay. [Mehr Informationen](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "en": "Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. [Learn more](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "es": "Cada cliente verá su forma de pago preferida entre las disponibles en tu tienda, como PayPal o Apple Pay. [Más información](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "fi": "Kukin asiakas näkee ensisijaisen valintansa kauppasi tarjoamista maksutavoista, esim. PayPal tai Apple Pay. [Lisätietoja](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "fr": "Chaque client verra son moyen de paiement préféré parmi ceux qui sont proposés sur votre boutique, tels que PayPal ou Apple Pay. [En savoir plus](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "hi": "प्रत्येक ग्राहक आपके स्टोर पर उपलब्ध अपनी पसंदीदा भुगतान की विधि देखेंगे जैसे PayPal या Apple Pay. [अधिक जानें](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "it": "Ogni cliente vedrà il suo metodo di pagamento preferito tra quelli disponibili nel tuo negozio, come PayPal o Apple Pay. [Maggiori informazioni](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "ja": "PayPalやApple Payなど、ストアで利用可能な希望の決済方法がお客様に表示されます。[詳細情報](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "ko": "각 고객은 PayPal 또는 Apple Pay와 같이 스토어에서 사용 가능한 지불 방법을 확인할 수 있습니다. [자세히 알아보기](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "ms": "Setiap pelanggan akan melihat kaedah pembayaran keutamaan mereka dari yang tersedia di kedai anda, seperti PayPal atau Apple Pay. [Ketahui lebih lanjut](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "nb": "Hver enkelt kunde vil se sin foretrukne betalingsmåte blant de som er tilgjengelig i butikken din, som PayPal eller Apple Pay. [Finn ut mer](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "nl": "Elke klant ziet zijn of haar beschikbare voorkeursmethode om af te rekenen, zoals PayPal of Apple Pay. [Meer informatie](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "pt-BR": "Cada cliente verá seu método de pagamento preferido dentre os disponíveis na loja, como PayPal ou Apple Pay. [Saiba mais](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "pt-PT": "Cada cliente irá ver o seu método de pagamento preferido entre os disponíveis na loja, como o PayPal ou Apple Pay. [Saiba mais](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "sv": "Varje kund kommer att se den föredragna betalningsmetoden från de som finns tillgängliga i din butik, till exempel PayPal eller Apple Pay. [Läs mer](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "th": "ลูกค้าแต่ละรายจะเห็นวิธีการชำระเงินที่ต้องการจากวิธีที่ใช้ได้ในร้านค้าของคุณ เช่น PayPal หรือ Apple Pay [เรียนรู้เพิ่มเติม](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "zh-CN": "每位客户都可在您商店提供的付款方式中看到他们的首选付款方式,例如 PayPal 或 Apple Pay。[了解详情](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
        "zh-TW": "每位客戶都可以在您商店內開放使用的付款方式中看見他們偏好使用的方式,如 PayPal、Apple Pay 等。[深入瞭解](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)"
      },
      "default": true
    },
    {
      "type": "select",
      "id": "add_to_cart_button_size",
      "label": {
        "da": "Knapstørrelse",
        "de": "Schaltflächengröße",
        "en": "Button size",
        "es": "Tamaño del botón",
        "fi": "Painikkeen koko",
        "fr": "Taille du bouton",
        "hi": "बटन का आकार",
        "it": "Dimensione pulsante",
        "ja": "ボタンのサイズ",
        "ko": "버튼 사이즈",
        "ms": "Saiz butang",
        "nb": "Knappestørrelse",
        "nl": "Afmeting knop",
        "pt-BR": "Tamanho do botão",
        "pt-PT": "Tamanho do botão",
        "sv": "Knappstorlek",
        "th": "ขนาดปุ่ม",
        "zh-CN": "按钮大小",
        "zh-TW": "按鈕尺寸"
      },
      "default": "small",
      "options": [
        {
          "value": "small",
          "label": {
            "da": "Lille",
            "de": "Klein",
            "en": "Small",
            "es": "Pequeña",
            "fi": "Pieni",
            "fr": "Petit",
            "hi": "छोटा",
            "it": "Piccolo",
            "ja": "小",
            "ko": "스몰",
            "ms": "Kecil",
            "nb": "Liten",
            "nl": "Klein",
            "pt-BR": "Pequeno",
            "pt-PT": "Pequeno",
            "sv": "Liten",
            "th": "เล็ก",
            "zh-CN": "小",
            "zh-TW": "小型"
          }
        },
        {
          "value": "large",
          "label": {
            "da": "Stor",
            "de": "Groß",
            "en": "Large",
            "es": "grande",
            "fi": "Suuri",
            "fr": "Grand",
            "hi": "बड़ा",
            "it": "Grande",
            "ja": "大",
            "ko": "라지",
            "ms": "Besar",
            "nb": "Stor",
            "nl": "Groot",
            "pt-BR": "Grande",
            "pt-PT": "Grande",
            "sv": "Stor",
            "th": "ใหญ่",
            "zh-CN": "大",
            "zh-TW": "大型"
          }
        }
      ]
    }
  ]
}
{% endschema %}
Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
1 Like
New Member
1 0 0

I am having the same issue, clients cant not add the product to the cart or even they can't go to the checkout page,

help please, here its the link. https://dualbandchinstrap.com/products/sleep-apnea-chin-strap

0 Likes
New Member
2 0 0

Hi Guleria - I am also using the brooklyn theme and the add to cart button is not working for me.

www.heritagehill.co -- any thoughts?

 

thank you much for your time and attention.

0 Likes
Shopify Partner
434 83 93

Hello 

As i check 'Add to cart' is working fine in your store.

Thanks

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
0 Likes
New Member
3 0 0

Hi @Guleria ,

 

I'm having the same issue - add to cart button has disappeared on the following 4 pages which all use the same template:

 
 

Any ideas? Code is here:

 

<!-- /sections/product-template.liquid -->
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.css"/>
 
<link href="//cdn.rawgit.com/noelboss/featherlight/1.7.13/release/featherlight.min.css" type="text/css" rel="stylesheet" />
 
<script src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js" integrity="sha384-YGnnOBKslPJVs35GG0TtAZ4uO7BHpHlqJhs0XK3k6cuVb6EBtl+8xcvIIOKV5wB+" crossorigin="anonymous"></script>
 
<script src="https://cdn.rawgit.com/noelboss/featherlight/1.7.13/release/featherlight.min.js" integrity="sha384-axi5ffQG1HW3hkExwml/y1xQHdTCM5KumQS+E7XSolfUkIPC7Ev/l3UCd71SU+3L" crossorigin="anonymous"></script>
 
{{ 'product.css' | asset_url | stylesheet_tag }}
 
{% comment %}
Rich snippets
{% endcomment %}
<div>
<meta  content="{{ product.title }}">
<meta  content="{{ shop.url }}{{ product.url }}">
<meta itemprop="itemReviewed" itemtype="http://schema.org/Product"/>   
<meta   itemprop="ulr" content="{{ product.featured_image.src | img_url: '800x' }}">
<!-- insert here global identifier (e.g. isbn, mpn or gtin8) -->
<meta   itemprop="sku" content="{{ product.variants.first.sku }}">
<!-- insert here global identifier (e.g. isbn, mpn or gtin8) -->
<meta  itemprop="gtin8"  content="{{ product.variants.first.barcode }}">
 
{% comment %}
Establish thumbnail grid
{% endcomment %}
{% assign thumbnailLength = product.images | size %}
 
{% comment %}
Hide if there are no variant images
{% endcomment %}
{% assign thumbnailColumns = 'grid__item large--hide medium-down--hide' %}
{% if thumbnailLength == 1 %}
  {% assign thumbnailColumns = 'grid__item large--hide medium-down--hide' %}
{% elsif thumbnailLength == 2 %}
  {% assign thumbnailColumns = 'grid__item push--large--one-quarter large--one-quarter medium-down--one-half' %}
{% elsif thumbnailLength == 3 %}
  {% assign thumbnailColumns = 'grid__item one-third' %}
{% elsif thumbnailLength > 3 %}
  {% assign thumbnailColumns = 'grid__item one-quarter' %}
{% endif %}
 
{% comment %}
Get first variant, or deep linked one
{% endcomment %}
{% assign current_variant = product.selected_or_first_available_variant %}
<div class="grid--full product-single wrapper product--{{section.id}}" data-section-type="product-template" data-section-id="{{section.id}}">
<div class = "grid__item">
 
<!-- Product Photos -->
<div class = "grid">
<div class="grid__item product-images large--{{ section.settings.product_image_width }} text-center">
  <div class="product-single__photos" id="ProductPhoto">
   <div class="desktop-only">{% include 'breadcrumbs' %}</div>
    <div class ="product-page-table">
         <div class="product-gallery">
          {% assign featured_image = current_variant.featured_image | default: product.featured_image %}
          {% for image in product.images %}
 
                {% if image.alt contains "cdn.shopify.com" %}
                  <div class="videoWrapNew">
                    <video id="productVideo" height="100%" controls>
                      <source src="{{image.alt}}" />
                    </video>
                  </div>
                {% else %}
                  <div class="image-zoom" style="position:relative !important;">
                    <img data-zoom="{{ image | img_url: 'master'}}" src="{{image | img_url: 'master'}}" />
                  </div>
                 {% endif %}
 
          {%endfor%}
 
        </div>
        <div class="product-gallery-nav desktop-only">
            {% for image in product.images %}
              <div>
              <img src="{{image | img_url: 'master'}}">
 
                {% if image.alt contains "cdn.shopify.com" %}
                <div class="play-icon">
                  <img src="{{'play-icon.png' | asset_url }}" width="32" style="margin-right:10px">
                  <h5>WATCH THE VIDEO</h5>
                </div>
 
                {% endif %}
              </div>
 
 
            {%endfor%}
          </div>
    </div>
  </div>
 
 <!-- Related Products-->
  <div class="desktop-only">{% include 'related-products' %}</div>
</div>
<!-- Product Description -->
<div class="grid__item large--{{ section.settings.product_image_width }} product-description-wrapper {% if section.settings.text_alignment == 'text-center' %}text-center{% else %}text-left{% endif %}">
  <h1 id="{{product.id}}" class="product-title text-center" itemprop="name" >{{ product.title | remove:'|'}}</h1>
  <h2 id="ProductPrice" class="text-center">
        {% if current_variant.compare_at_price %}
            <s class="reduced-price"  itemprop="price" >{{ current_variant.compare_at_price | money }}</s>
        {% endif %}
          <span itemprop="price"  >{{ current_variant.price | money }}</span>
    </h2>
  <div>
    <meta content="{{ shop.currency }}">
 
 
    <meta itemprop="priceValidUntil"  datetime="{{ "now" | date: "%Y-%m-%d"  }}">
    <meta content="{{ product.url }}">
    <meta content="https://sainthemp.com{{ product.url }}">
    <!-- Product Form Snippet -->
    {% include 'product-form' %}
    <div class="mobile-only">{% include 'related-products' %}</div>
 
  </div>
</div>
</div>
</div>
</div>
 
 
</div>
<style>
 
</style>
<script>
$(document).ready(function(){
         $('.product-gallery').slick({
            dots: true,
            autoplay: false,
            slidesToShow: 1,
            infinite: false,
            draggable: false,
             asNavFor: '.product-gallery-nav',
            nextArrow: '<button class=next-arrow><img src={{'arrow-right.svg' | asset_url }}"></button>"',
            prevArrow: '<button class=prev-arrow><img src={{'arrow-left.svg' | asset_url }}></button>'
        })
        $('.product-gallery-nav').slick({
          slidesToShow: 3,
          asNavFor: '.product-gallery',
          dots: false,
          arrows: false,
          infinite: true,
          focusOnSelect: true
        });
 
 
        $('.product-gallery').on('afterChange', function(event, slick, currentSlide) {
          if (currentSlide == 2) {
            $('.product-gallery').slick('slickPause');
            productVideo.play();
          }else{
 
            productVideo.pause();
          }
        });
        if($(window).width() > 1024){
        $('.image-zoom').zoom({
        url: $(this).find('img').attr('data-zoom')
        })
        }
 
  })
</script>
<script type="application/json" id="ProductJson-{{ section.id }}">
  {{ product | json }}
</script>
 
<script>
window.product = {{ product | json }};
window.product.money_format = "{{ shop.money_format }}";
window.product.add_label = {% if product.options.size == 1 %}true{% else %}false{% endif %};
window.product.label = "{{ product.options.first | escape }}";
window.selectCallback = PaloAlto.onVariantSelected;
</script>
 
{% schema %}
{
  "name": "Product pages",
  "settings": [
    {
      "type":"header",
      "content":"Layout"
    },
    {
      "type": "select",
      "label": "Product image width",
      "id": "product_image_width",
      "options": [
        {
          "value": "one-half",
          "label": "50%"
        },
        {
          "value": "one",
          "label": "100%"
        }
      ]
    },
    {
      "type": "select",
      "label": "Text alignment",
      "id": "text_alignment",
      "options": [
        {
          "value": "text-left",
          "label": "Left"
        },
        {
          "value": "text-center",
          "label": "Center"
        }
      ]
    },
    {
      "type": "checkbox",
      "id": "enable_social_sharing_products",
      "label": "Show social sharing buttons",
      "default": true
    },
    {
      "type": "header",
      "content":"Related Products"
    },
    {
      "type": "checkbox",
      "id": "show_related_products",
      "label": "Show related products",
      "default": true
    },
    {
      "type":"text",
      "id":"related_products_section_title",
      "label":"Title",
      "default":"You Might Also Like"
    },
    {
      "type": "header",
      "content": "Additional content"
    },
    {
      "type": "page",
      "label": "Additional content 1",
      "id": "product_tab_page_one"
    },
    {
      "type": "page",
      "label": "Additional content 2",
      "id": "product_tab_page_two"
    },
    {
      "type": "page",
      "label": "Additional content 3",
      "id": "product_tab_page_three"
    },
    {
      "type":"header",
      "content":"Dynamic checkout button"
    },
    {
      "type": "checkbox",
      "id": "enable_payment_button",
      "label": "Show dynamic checkout button",
      "info": "Lets customers check out directly using a familiar payment method. [Learn more](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)",
      "default": false
    }
  ]
}
{% endschema %}
 
<!-- <meta itemprop="itemReviewed" itemscope itemtype="http://schema.org/Product"/> -->
 
{% if product.metafields.loox.num_reviews %}
<script id="looxSchemaJson" type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Product",
"@id": {{ canonical_url | json }},
    "brand": "{{ shop.name | escape }}",
    "name": "{{ product.title | remove:'|'}}",
    "description": "{{ product.description | escape | strip_html }}",
    "image": "{{ product.featured_image.src }}",
    "sku": "{{ product.variants.first.sku }}",
    "gtin8":"{{ product.variants.first.barcode }}",
    "review":"http://schema.org/Review",
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "{{ product.metafields.loox.avg_rating }}",
"reviewCount": "{{ product.metafields.loox.num_reviews }}"
      
},
    "offers": {
        "@type": "Offer",
        "priceCurrency": "AUD",
        "price": "{{ current_variant.price}}",
        "availability": "http://schema.org/InStock",
        "priceValidUntil":"{{ "now" | date: "%Y-%m-%d"  }}",
        "url":"https://sainthemp.com{{ product.url }}"
    }
 
}
</script>
<meta itemprop="name" content="{{ shop.name | escape }}"/>
{% endif %}
 
 
<div id="looxReviews" data-product-id="{{product.id}}" class="loox-reviews-default">{{ product.metafields.loox.reviews }}</div>
0 Likes
Shopify Partner
434 83 93

Hello David,

Add this at the bottom of theme.scss.liquid

form[action^="/cart/add"] [type=submit] {
    visibility: visible !important;
}


Thanks

Want to modify or custom changes on store hire me.
My Email: guleriathakur43@gmail.com
Skype: navrocks1
If helpful then please Like and Accept Solution.
If you are happy and want to donate small Click here (Its my paypal)
0 Likes