Add-to-cart Dataylayer hinzufügen

[Den288]

Hallo zusammen, 

ich würde gerne meinen Add-to-Cart Datalayer hinzufügen, finde jedoch weder das Produkttemplate in den Abschnitten, noch finde ich den Add-to-Cart-Button in einem anderen Abschnitt wo ich das Snippet inkludieren kann. Das Snippet dazu habe ich bereits erstellt. Hoffe die Frage ist nicht komplett dumm, aber ich bin relativ neu in dem Gebiet und bisschen verloren.. 

Vielen Dank vorab für jegliche Hilfe! 

[Gabe]

Hey @Den288 

Keine Frage ist dumm, und ich helfe dir gerne weiter! 😉

Shopify verwendet eine eigene Template-Sprache namens "Liquid". Wenn du es selber programmieren möchtest dann bitte immer in einer Themekopie/Testumgebung zuerst testen und zusammen mit einem Experten/Programmierer. Du kannst ein Backup deines Themes erstellen, bevor man den Code bearbeitet, oder den Code wiederherstellen, falls dies nötig sein sollte. Du könntest auch einen unserer Experten engagieren indem du denen eine E-Mail rüberschießt. Unsere Experten antworten meist sehr schnell.

Änderungen zu deinem Theme Code können auch 1) die Page Loading Speeds negativ beeinflussen und 2) dein Theme aus den Theme Updates ausschließen. Das folgende ist Theme-abhängig, ohne Gewähr und dient lediglich dazu dich in die richtige Richtung zu weisen!

Um den Add-to-Cart Datalayer hinzuzufügen, musst du den entsprechenden Liquid-Code finden und bearbeiten. Melde dich in deinem Shopify-Adminbereich an und gehe zu "Online-Shop" > "Themes". Klicke dort bei deinem aktuellen Theme auf "Aktionen" und dann auf "Code bearbeiten". Im Code-Editor solltest du auf der linken Seite eine Liste von Dateien und Ordnern sehen. Das "product.liquid" Template ist oft in einem Ordner namens "Templates" zu finden. Wenn du dieses Template nicht findest, kann es sein, dass dein Theme ein anderes benanntes Template für Produkte verwendet oder dass die Produktinformationen in einem Abschnitt (Section) gespeichert sind. Wenn du das "product.liquid" nicht findest, sieh in den "Sections" nach. Hier könnten Dateien wie "product-template.liquid" oder ähnliche sein.

In der Datei, in der du die Produktinformationen siehst, suche nach dem Add-to-Cart-Button. Dieser kann z.B. so aussehen: <input type="submit" name="add" value="In den Warenkorb" /> oder vielleicht als Button-Element mit einer entsprechenden Beschriftung. Direkt vor oder nach diesem Button kannst du nun deinen Datalayer-Snippet einfügen.

Ein Datalayer ist oft eine Struktur, die dazu dient, bestimmte Daten an eine Tag-Management-Lösung, wie z.B. Google Tag Manager (GTM), zu übergeben. Ein typisches Szenario wäre die Übertragung von E-Commerce-Daten an GTM, wenn ein Nutzer ein Produkt zum Warenkorb hinzufügt.

Ein einfacher Datalayer-Snippet für den Add-to-Cart-Vorgang in einem Online-Shop könnte so aussehen:

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  'event': 'addToCart',
  'ecommerce': {
    'currencyCode': 'EUR',
    'add': {
      'products': [{
        'id': '{{ product.id }}',
        'name': '{{ product.title }}',
        'price': '{{ product.price | divided_by: 100.0 }}',
        'brand': 'BeispielMarke',
        'category': 'BeispielKategorie',
        'quantity': 1
      }]
    }
  }
});

Die obenstehenden Liquid-Platzhalter ({{ product.id }}, {{ product.title }} usw.) ziehen spezifische Produktinformationen aus Shopify und setzen diese in den Datalayer-Snippet ein. Du müsstest die Platzhalter entsprechend deinen spezifischen Anforderungen und deinem Theme anpassen.

Hier sind einige Punkte zu beachten:

1. Event Name: Das 'event': 'addToCart' signalisiert dem Tag Manager, dass ein Produkt zum Warenkorb hinzugefügt wurde.

2. E-Commerce-Daten: Die Struktur innerhalb von 'ecommerce' folgt einem spezifischen Format, das oft von Analysetools wie Google Analytics verwendet wird.

3. Liquid-Platzhalter: Die Liquid-Platzhalter ({{ }}) sind spezifisch für Shopify und holen Daten direkt aus deinem Shop. Je nachdem wie dein Shopify-Theme aufgebaut ist, können diese Platzhalter variieren.

4. Währung und Preis: Im obigen Beispiel wird der Preis durch 100 geteilt, weil Shopify Preise oft in Cent und nicht in Euro speichert. Das kann je nach Einstellung variieren.

5. Brand und Kategorie: Diese Werte sind nur beispielhaft. Du solltest sie durch die tatsächlichen Werte aus deinem Shop ersetzen oder entsprechende Liquid-Codes verwenden, um die Daten dynamisch zu holen.

Stelle sicher, dass du bereits den Basis-Code für den Google Tag Manager (oder das entsprechende Tag-Management-Tool, das du verwendest) auf deiner Seite installiert hast, damit der Datalayer-Snippet korrekt funktioniert. Wenn du Fragen oder Bedenken hast, empfehle ich dir, die Hilfe eines Experten in Anspruch zu nehmen, um Fehler zu vermeiden.

[moritz01]

Hi @Gabe,

vielen Dank dir für deine ausführliche Dokumentation. Ich versuche gerade das selbe im meinen Theme Vision, den Add-to-cart Datalayer in meinem Code einzufügen.  

Ich bin ein meinem Theme unter main-product-liquid unterwegs und habe leider wenig Knowledge über CSS und Java Skript.

Weiß du, wo ich den Code einfügen muss, in meiner CSS Datei?

Suche ich überhaupt im richtigen Abschnitt ? 😁

Spoiler

{{- 'product.css' | asset_url | stylesheet_tag -}}

{%- liquid

assign first_3d_model = product.media | where: "media_type", "model" | first

assign thumbnail_position = section.settings.thumbnail_position

assign media_aspect_ratio = section.settings.media_aspect_ratio

assign image_index = -1

assign display_captions = section.settings.display_captions

assign hide_variants = section.settings.hide_variants

assign featured_media = product.selected_or_first_available_variant.featured_media

assign first_image = nil

assign variant_images = product.images | where: 'attached_to_variant?', true | map: 'src'

assign sizes = '345x345,610x610,1220x1220'

if media_aspect_ratio == 'adapt'

assign sizes = '345x0,610x0,1220x0'

elsif media_aspect_ratio == 'portrait'

assign sizes = '345x430,610x760,1220x1525'

elsif media_aspect_ratio == 'landscape'

assign sizes = '345x255,610x450,1220x900'

endif

-%}

{%- if first_3d_model -%}

  <link id="ModelViewerStyle" rel="stylesheet" href="https://cdn.shopify.com/shopifycloud/model-viewer-ui/assets/v1.0/model-viewer-ui.css" media="print" onload="this.media='all'">

  <link id="ModelViewerOverride" rel="stylesheet" href="{{ 'product-model-viewer-ui.css' | asset_url }}" media="print" onload="this.media='all'">

{%- endif -%}

<div class="thb-product-detail product">

  <div class="row">

<div class="small-12 columns">

<div class="product-grid-container">

<div class="product-gallery-sticky">

   <div class="product-gallery-container thumbnails-{{ thumbnail_position }}" id="MediaGallery-{{ section.id }}">

<div class="product-image-container">

       <product-slider id="Product-Slider" class="product-images static-dots" data-captions="{{ display_captions }}" data-hide-variants="{{ hide_variants }}">

{%- if featured_media != null -%}

             {%- liquid

assign image_index = image_index | plus: 1

assign first_image = featured_media.preview_image

-%}

             {%- render 'product-media', product: product, section: section, forloop: false, media: featured_media, sizes: sizes, variant_images: variant_images, media_aspect_ratio: media_aspect_ratio, hide_variants: hide_variants, priority: 'high' -%}

           {%- endif -%}

         {%- for media in product.media -%}

{%- unless media.id == featured_media.id -%}

{%- liquid

if media.media_type == 'image'

assign image_index = image_index | default: 0 | plus: 1

endif

                      assign priority = false

if image_index == 0

assign first_image = media.preview_image

                        assign priority = 'high'

endif

-%}

                    {%- render 'product-media', product: product, section: section, forloop: forloop, media: media, sizes: sizes, variant_images: variant_images, media_aspect_ratio: media_aspect_ratio, hide_variants: hide_variants, priority: priority -%}

{%- endunless -%}

         {%- endfor -%}

{%- if product.media.size > 1 -%}

<div class="flickity-nav flickity-prev" tabindex="0">{%- render 'svg-icons' with 'carousel-prev' -%}</div>

<div class="flickity-nav flickity-next" tabindex="0">{%- render 'svg-icons' with 'carousel-next' -%}</div>

{%- endif -%}

       </product-slider>

<scroll-shadow>

<div id="Product-Thumbnails" class="product-thumbnail-container" data-hide-variants="{{ hide_variants }}">

{%- if featured_media != null -%}

{%- render 'product-thumbnail', product: product, media: featured_media, forloop: false, variant_images: variant_images, media_aspect_ratio: media_aspect_ratio, hide_variants: hide_variants -%}

{%- endif -%}

{%- for media in product.media -%}

{%- unless media.id == featured_media.id -%}

                    {%- render 'product-thumbnail', product: product, media: media, forloop: forloop, variant_images: variant_images, media_aspect_ratio: media_aspect_ratio, hide_variants: hide_variants -%}

{%- endunless -%}

{%- endfor -%}

</div>

</scroll-shadow>

</div>

   </div>

{%- assign info_boxes = section.blocks | where: "type", "info_box" -%}

{%- if info_boxes.size > 0 -%}

{{- 'info-box.css' | asset_url | stylesheet_tag -}}

<div class="product--infobox-container">

{%- for info_box in info_boxes %}

<div class="product--infobox" style="--info-box-bg: {{ info_box.settings.info_box_bg }};--info-box-color: {{ info_box.settings.info_box_color }};">

{% if info_box.settings.image %}

<span class="product--infobox-image">

{%- render 'responsive-image', image: info_box.settings.image, sizes: '24x24,48x48' -%}

</span>

{%- else -%}

<span class="product--infobox-image">

{% render 'svg-icons-inline', icon: info_box.settings.icon %}

</span>

{%- endif -%}

<span>{{ info_box.settings.text }}</span>

{% if info_box.settings.link %}

<a href="{{ info_box.settings.link }}" class="product--infobox-link"></a>

{%- endif -%}

</div>

{%- endfor -%}

</div>

{%- endif -%}

</div>

   <div class="product-information">

<div id="ProductInfo-{{ section.id }}" class="product-information--inner">

{%- render 'product-information', product: product, section: section, update_url: true, pickup: true, first_image: first_image, hide_variants: hide_variants -%}

</div>

   </div>

</div>

</div>

  </div>

</div>

<div class="side-panel side-availability" id="Pickup-Availability"></div>

{%- assign side_panels = section.blocks | where: "type", "side_panel" -%}

{%- if side_panels.size > 0 -%}

<div class="side-panel product-information-drawer" id="Product-Information-Drawer" tabindex="-1">

<div class="side-panel-inner">

<div class="side-panel-header">

<div>

<span class="h6">{{ 'products.product.product_information' | t }}</span>

<side-panel-close class="side-panel-close">{%- render 'svg-icons' with 'close' -%}</side-panel-close>

</div>

</div>

<div class="side-panel-content side-panel-content--has-tabs">

{%- assign block = side_panels[0] -%}

<side-panel-content-tabs class="side-panel-content--tabs">

{%- if block.settings.side_panel_1_label != '' -%}

<button class="tab-active">{{ block.settings.side_panel_1_label }}</button>

{%- endif -%}

{%- if block.settings.side_panel_2_label != '' -%}

<button>{{ block.settings.side_panel_2_label }}</button>

{%- endif -%}

{%- if block.settings.side_panel_3_label != '' -%}

<button>{{ block.settings.side_panel_3_label }}</button>

{%- endif -%}

</side-panel-content-tabs>

<div class="side-panel-content--inner">

{%- if block.settings.side_panel_1_label != '' -%}

<div class="side-panel-content--tab-panel rte tab-active">

 {{ block.settings.side_panel_1_page.content }}

</div>

{%- endif -%}

{%- if block.settings.side_panel_2_label != '' -%}

<div class="side-panel-content--tab-panel rte">

 {{ block.settings.side_panel_2_page.content }}

</div>

{%- endif -%}

{%- if block.settings.side_panel_3_label != '' -%}

<div class="side-panel-content--tab-panel rte">

 {{ block.settings.side_panel_3_page.content }}

</div>

{%- endif -%}

</div>

</div>

</div>

</div>

{%- endif -%}

{%- if section.settings.lightbox != blank -%}

{% render 'photoswipe' %}

<link rel="stylesheet" href="{{ 'photoswipe.css' | asset_url }}" media="print" onload="this.media='all'">

{%- endif -%}

<script src="{{ 'product.js' | asset_url }}" defer="defer"></script>

{%- if first_3d_model -%}

  <script type="application/json" id="ProductJSON-{{ product.id }}">

    {{ product.media | where: 'media_type', 'model' | json }}

  </script>

  <script src="{{ 'product-model.js' | asset_url }}" defer></script>

{%- endif -%}

{%- liquid

  if product.selected_or_first_available_variant.featured_media

    assign seo_media = product.selected_or_first_available_variant.featured_media

  else

    assign seo_media = product.featured_media

  endif

-%}

<script type="application/ld+json">

  {

    "@context": "http://schema.org/",

    "@type": "Product",

    "name": {{ product.title | json }},

    "url": {{ request.origin | append: product.url | json }},

    {% if seo_media -%}

      "image": [

        {{ seo_media | image_url: width: seo_media.preview_image.width | prepend: "https:" | json }}

      ],

    {%- endif %}

    "description": {{ product.description | strip_html | json }},

    {% if product.selected_or_first_available_variant.sku != blank -%}

      "sku": {{ product.selected_or_first_available_variant.sku | json }},

    {%- endif %}

    "brand": {

      "@type": "Brand",

      "name": {{ product.vendor | json }}

    },

    "offers": [

      {%- for variant in product.variants -%}

        {

          "@type" : "Offer",

          {%- if variant.sku != blank -%}

            "sku": {{ variant.sku | json }},

          {%- endif -%}

          {%- if variant.barcode.size == 12 -%}

            "gtin12": {{ variant.barcode }},

          {%- endif -%}

          {%- if variant.barcode.size == 13 -%}

            "gtin13": {{ variant.barcode }},

          {%- endif -%}

          {%- if variant.barcode.size == 14 -%}

            "gtin14": {{ variant.barcode }},

          {%- endif -%}

          "availability" : "http://schema.org/{% if variant.available %}InStock{% else %}OutOfStock{% endif %}",

          "price" : {{ variant.price | divided_by: 100.00 | json }},

          "priceCurrency" : {{ cart.currency.iso_code | json }},

          "url" : {{ request.origin | append: variant.url | json }}

        }{% unless forloop.last %},{% endunless %}

      {%- endfor -%}

    ]

  }

</script>

{% schema %}

{

  "name": "Product information",

  "tag": "section",

  "class": "product-section",

"settings": [

{

"type": "checkbox",

"id": "enable_sticky_add_to_cart",

"default": true,

"label": "Show sticky add to cart"

},

{

"type": "checkbox",

"id": "show_taxes_included",

"default": true,

"label": "Show tax and shipping information",

"info": "Tax and shipping information will be displayed if [taxes are included in the price](https://help.shopify.com/en/manual/taxes/location#include-taxes-in-product-prices) or [shipping policy](https://help.shopify.com/en/manual/checkout-settings/refund-privacy-tos#add-or-generate-store-polici...) is added"

},

{

"type": "header",

"content": "Media"

},

{

"type": "paragraph",

"content": "Learn more about [media types](https://help.shopify.com/en/manual/products/product-media)"

},

{

"type": "select",

"id": "thumbnail_position",

"options": [

{

"value": "left",

"label": "Left"

},

{

"value": "bottom",

"label": "Bottom"

}

],

"default": "left",

"label": "Thumbnail position"

},

{

"type": "select",

"id": "media_aspect_ratio",

"options": [

{

"value": "adapt",

"label": "Adapt to image"

},

{

"value": "square",

"label": "Square"

},

{

"value": "portrait",

"label": "Portrait"

},

{

"value": "landscape",

"label": "Landscape"

}

],

"default": "adapt",

"label": "Image ratio"

},

{

      "type": "checkbox",

      "id": "display_captions",

      "default": true,

      "label": "Display captions"

    },

{

      "type": "checkbox",

      "id": "hide_variants",

      "default": false,

      "label": "Hide unselected variants’ media",

"info": "Media for the unselected variants will be hidden."

    },

{

"type": "checkbox",

"id": "lightbox",

"default": true,

"label": "Enable image zoom"

},

{

      "type": "checkbox",

      "id": "enable_video_looping",

      "default": false,

      "label": "Enable video looping"

    }

  ],

  "blocks": [

{

"type": "@app"

},

{

      "type": "label",

      "name": "Card labels",

      "settings": [

{

"type": "paragraph",

"content": "Use a dynamic source to highlight a unique attribute by creating product label. [Learn more about product labels.](https://documentation.fuelthemes.net/kb/how-to-add-product-labels-in-vision-theme/)"

}

      ]

    },

{

      "type": "separator",

      "name": "Separator"

    },

{

      "type": "text",

      "name": "Text",

      "settings": [

        {

          "type": "text",

          "id": "text",

          "default": "Text block",

          "label": "Text"

        },

        {

          "type": "select",

          "id": "text_style",

          "options": [

            {

              "value": "style_body",

              "label": "Body"

            },

            {

              "value": "subheading",

              "label": "Subheading"

            },

            {

              "value": "style_vendor",

              "label": "Vendor"

            }

          ],

          "default": "style_vendor",

          "label": "Text Style"

        }

      ]

    },

    {

      "type": "title",

      "name": "Title",

      "limit": 1,

"settings": [

{

"type": "checkbox",

"id": "show_products_rating",

"default": true,

"label": "Show product rating",

"info": "To display a rating, add a product rating app. [Learn more](https://help.shopify.com/manual/online-store/themes/os20/themes-by-shopify/dawn/sections#featured-co...)"

}

]

    },

{

      "type": "inventory_level",

      "name": "Inventory level",

      "limit": 1,

      "settings": [

{

"type": "select",

"id": "show_inventory_notice",

"options": [

{

"value": "always",

"label": "Always"

},

{

"value": "low",

"label": "Only when inventory low"

}

],

"default": "always",

"label": "Show inventory notice"

},

        {

          "type": "select",

          "id": "show_inventory_count",

          "options": [

{

"value": "never",

"label": "Never"

},

            {

              "value": "always",

              "label": "Always"

            },

            {

              "value": "low",

              "label": "Only when inventory low"

            }

          ],

          "default": "always",

          "label": "Show count in inventory notice"

        },

{

"type": "checkbox",

"id": "inventory_notice_pulse",

"default": true,

"label": "Show pulse"

},

{

"type": "checkbox",

"id": "inventory_notice_bar",

"default": true,

"label": "Show progress bar"

},

{

 "type": "number",

 "id": "inventory_notice_threshold",

 "label": "Low inventory threshold",

 "default": 10,

"info": "Set the product inventory quantity to alert customers when limited quantities are available. Insert a dynamic source to set different thresholds for multiple products."

},

{

 "type": "number",

 "id": "inventory_notice_base",

 "label": "Inventory base quantity",

 "default": 20,

"info": "Enter the initial quantity of your product inventory for progress bar. Insert a dynamic source to set different base quantities for multiple products"

}

      ]

    },

{

      "type": "variant_picker",

      "name": "Variant picker",

      "limit": 1,

      "settings": [

        {

          "type": "select",

          "id": "picker_type",

          "options": [

            {

              "value": "dropdown",

              "label": "Dropdown"

            },

            {

              "value": "button",

              "label": "Block"

            }

          ],

          "default": "button",

          "label": "Type"

        },

{

"type": "checkbox",

"id": "color_picker",

"default": true,

"label": "Enable color swatches",

"info": "[Learn more about color swatches.](https://documentation.fuelthemes.net/kb/how-do-i-set-up-product-variant-swatches-2/)"

},

{

"type": "checkbox",

"id": "variant_is_disabled",

"default": true,

"label": "Show availability in selectors",

"info": "When an option is selected, unavailable variants will be crossed-out."

},

{

"type": "header",

"content": "Sizing guide"

},

{

          "type": "text",

          "id": "sizing_guide_variant",

          "default": "Size",

          "label": "Sizing guide variant name",

"info": "Name of the variant to show the sizing guide link. [Learn more about sizing guide](https://documentation.fuelthemes.net/kb/how-do-i-add-a-size-chart-to-my-products-vision/)"

        },

{

          "type": "text",

          "id": "sizing_guide_text",

          "default": "Sizing guide",

          "label": "Sizing guide label",

"info": "Leave empty to remove the sizing guide link."

        },

        {

          "type": "select",

          "id": "sizing_guide_icon",

          "options": [

            {

              "value": "none",

              "label": "None"

            },

            {

              "value": "apple",

              "label": "Apple"

            },

            {

              "value": "banana",

              "label": "Banana"

            },

            {

              "value": "bottle",

              "label": "Bottle"

            },

            {

              "value": "box",

              "label": "Box"

            },

            {

              "value": "carrot",

              "label": "Carrot"

            },

            {

              "value": "chat_bubble",

              "label": "Chat bubble"

            },

            {

              "value": "check_mark",

              "label": "Check mark"

            },

            {

              "value": "clipboard",

              "label": "Clipboard"

            },

            {

              "value": "dairy",

              "label": "Dairy"

            },

            {

              "value": "dairy_free",

              "label": "Dairy free"

            },

            {

              "value": "dryer",

              "label": "Dryer"

            },

            {

              "value": "eye",

              "label": "Eye"

            },

            {

              "value": "fire",

              "label": "Fire"

            },

            {

              "value": "gluten_free",

              "label": "Gluten free"

            },

            {

              "value": "heart",

              "label": "Heart"

            },

            {

              "value": "iron",

              "label": "Iron"

            },

            {

              "value": "leaf",

              "label": "Leaf"

            },

            {

              "value": "leather",

              "label": "Leather"

            },

            {

              "value": "lightning_bolt",

              "label": "Lightning bolt"

            },

            {

              "value": "lipstick",

              "label": "Lipstick"

            },

            {

              "value": "lock",

              "label": "Lock"

            },

            {

              "value": "map_pin",

              "label": "Map pin"

            },

            {

              "value": "nut_free",

              "label": "Nut free"

            },

            {

              "value": "pants",

              "label": "Pants"

            },

            {

              "value": "paw_print",

              "label": "Paw print"

            },

            {

              "value": "pepper",

              "label": "Pepper"

            },

            {

              "value": "perfume",

              "label": "Perfume"

            },

            {

              "value": "plane",

              "label": "Plane"

            },

            {

              "value": "plant",

              "label": "Plant"

            },

            {

              "value": "price_tag",

              "label": "Price tag"

            },

            {

              "value": "question_mark",

              "label": "Question mark"

            },

            {

              "value": "recycle",

              "label": "Recycle"

            },

            {

              "value": "return",

              "label": "Return"

            },

            {

              "value": "ruler",

              "label": "Ruler"

            },

            {

              "value": "serving_dish",

              "label": "Serving dish"

            },

            {

              "value": "shirt",

              "label": "Shirt"

            },

            {

              "value": "shoe",

              "label": "Shoe"

            },

            {

              "value": "silhouette",

              "label": "Silhouette"

            },

            {

              "value": "snowflake",

              "label": "Snowflake"

            },

            {

              "value": "star",

              "label": "Star"

            },

            {

              "value": "stopwatch",

              "label": "Stopwatch"

            },

            {

              "value": "truck",

              "label": "Truck"

            },

            {

              "value": "washing",

              "label": "Washing"

            }

          ],

          "default": "ruler",

          "label": "Sizing guide icon"

        },

        {

          "type": "page",

       "id": "sizing_guide_page",

          "label": "Sizing guide page"

        }

      ]

    },

{

      "type": "quantity",

      "name": "Quantity selector",

      "limit": 1,

"settings": [

{

"type": "paragraph",

"content": "The selector is automatically hidden if all variants are sold out. When at least one variant is available, the selector is always visible to prevent the page from moving when switching variants."

}

      ]

    },

{

      "type": "buy_buttons",

      "name": "Product form",

      "limit": 1,

"settings": [

        {

          "type": "checkbox",

          "id": "show_dynamic_checkout",

          "default": true,

          "label": "Show dynamic checkout buttons",

          "info": "Using the payment methods available on your store, customers see their preferred option, like PayPal or Apple Pay. [Learn more](https://help.shopify.com/manual/using-themes/change-the-layout/dynamic-checkout)"

        },

        {

          "type": "checkbox",

          "id": "show_gift_card_recipient",

          "default": false,

          "label": "Show recipient form for gift card products",

          "info": "When enabled, gift card products can optionally be sent to a recipient with a personal message."

        }

      ]

    },

    {

      "type": "description",

      "name": "Description",

      "limit": 1

    },

{

      "type": "share",

      "name": "Share",

      "limit": 1,

"settings": [

{

"type": "paragraph",

"content": "If you include a link in social media posts, the page’s featured image will be shown as the preview image. [Learn more](https://help.shopify.com/en/manual/online-store/images/showing-social-media-thumbnail-images)."

},

{

"type": "paragraph",

"content": "A store title and description are included with the preview image. [Learn more](https://help.shopify.com/en/manual/promoting-marketing/seo/adding-keywords#set-a-title-and-descripti...)."

}

]

    },

{

      "type": "custom_liquid",

      "name": "Custom liquid",

      "settings": [

        {

          "type": "liquid",

          "id": "custom_liquid",

          "label": "Custom liquid",

          "info": "Add app snippets or other Liquid code to create advanced customizations."

        }

      ]

    },

{

      "type": "side_panel",

      "name": "Information side panel",

      "limit": 1,

      "settings": [

{

"type": "header",

"content": "Panel 1"

},

        {

          "type": "text",

          "id": "side_panel_1_label",

          "default": "Materials",

          "label": "Label"

        },

        {

          "type": "select",

          "id": "side_panel_1_icon",

          "options": [

            {

              "value": "none",

              "label": "None"

            },

            {

              "value": "apple",

              "label": "Apple"

            },

            {

              "value": "banana",

              "label": "Banana"

            },

            {

              "value": "bottle",

              "label": "Bottle"

            },

            {

              "value": "box",

              "label": "Box"

            },

            {

              "value": "carrot",

              "label": "Carrot"

            },

            {

              "value": "chat_bubble",

              "label": "Chat bubble"

            },

            {

              "value": "check_mark",

              "label": "Check mark"

            },

            {

              "value": "clipboard",

              "label": "Clipboard"

            },

            {

              "value": "dairy",

              "label": "Dairy"

            },

            {

              "value": "dairy_free",

              "label": "Dairy free"

            },

            {

              "value": "dryer",

              "label": "Dryer"

            },

            {

              "value": "eye",

              "label": "Eye"

            },

            {

              "value": "fire",

              "label": "Fire"

            },

            {

              "value": "gluten_free",

              "label": "Gluten free"

            },

            {

              "value": "heart",

              "label": "Heart"

            },

            {

              "value": "iron",

              "label": "Iron"

            },

            {

              "value": "leaf",

              "label": "Leaf"

            },

            {

              "value": "leather",

              "label": "Leather"

            },

            {

              "value": "lightning_bolt",

              "label": "Lightning bolt"

            },

            {

              "value": "lipstick",

              "label": "Lipstick"

            },

            {

              "value": "lock",

              "label": "Lock"

            },

            {

              "value": "map_pin",

              "label": "Map pin"

            },

            {

              "value": "nut_free",

              "label": "Nut free"

            },

            {

              "value": "pants",

              "label": "Pants"

            },

            {

              "value": "paw_print",

              "label": "Paw print"

            },

            {

              "value": "pepper",

              "label": "Pepper"

            },

            {

              "value": "perfume",

              "label": "Perfume"

            },

            {

              "value": "plane",

              "label": "Plane"

            },

            {

              "value": "plant",

              "label": "Plant"

            },

            {

              "value": "price_tag",

              "label": "Price tag"

            },

            {

              "value": "question_mark",

              "label": "Question mark"

            },

            {

              "value": "recycle",

              "label": "Recycle"

            },

            {

              "value": "return",

              "label": "Return"

            },

            {

              "value": "ruler",

              "label": "Ruler"

            },

            {

              "value": "serving_dish",

              "label": "Serving dish"

            },

            {

              "value": "shirt",

              "label": "Shirt"

            },

            {

              "value": "shoe",

              "label": "Shoe"

            },

            {

              "value": "silhouette",

              "label": "Silhouette"

            },

            {

              "value": "snowflake",

              "label": "Snowflake"

            },

            {

              "value": "star",

              "label": "Star"

            },

            {

              "value": "stopwatch",

              "label": "Stopwatch"

            },

            {

              "value": "truck",

              "label": "Truck"

            },

            {

              "value": "washing",

              "label": "Washing"

            }

          ],

          "default": "ruler",

          "label": "Icon"

        },

        {

          "type": "page",

       "id": "side_panel_1_page",

          "label": "Page"

        },

{

"type": "header",

"content": "Panel 2"

},

        {

          "type": "text",

          "id": "side_panel_2_label",

          "default": "Shipping &amp; Returns",

          "label": "Label"

        },

        {

          "type": "select",

          "id": "side_panel_2_icon",

          "options": [

            {

              "value": "none",

              "label": "None"

            },

            {

              "value": "apple",

              "label": "Apple"

            },

            {

              "value": "banana",

              "label": "Banana"

            },

            {

              "value": "bottle",

              "label": "Bottle"

            },

            {

              "value": "box",

              "label": "Box"

            },

            {

              "value": "carrot",

              "label": "Carrot"

            },

            {

              "value": "chat_bubble",

              "label": "Chat bubble"

            },

            {

              "value": "check_mark",

              "label": "Check mark"

            },

            {

              "value": "clipboard",

              "label": "Clipboard"

            },

            {

              "value": "dairy",

              "label": "Dairy"

            },

            {

              "value": "dairy_free",

              "label": "Dairy free"

            },

            {

              "value": "dryer",

              "label": "Dryer"

            },

            {

              "value": "eye",

              "label": "Eye"

            },

            {

              "value": "fire",

              "label": "Fire"

            },

            {

              "value": "gluten_free",

              "label": "Gluten free"

            },

            {

              "value": "heart",

              "label": "Heart"

            },

            {

              "value": "iron",

              "label": "Iron"

            },

            {

              "value": "leaf",

              "label": "Leaf"

            },

            {

              "value": "leather",

              "label": "Leather"

            },

            {

              "value": "lightning_bolt",

              "label": "Lightning bolt"

            },

            {

              "value": "lipstick",

              "label": "Lipstick"

            },

            {

              "value": "lock",

              "label": "Lock"

            },

            {

              "value": "map_pin",

              "label": "Map pin"

            },

            {

              "value": "nut_free",

              "label": "Nut free"

            },

            {

              "value": "pants",

              "label": "Pants"

            },

            {

              "value": "paw_print",

              "label": "Paw print"

            },

            {

              "value": "pepper",

              "label": "Pepper"

            },

            {

              "value": "perfume",

              "label": "Perfume"

            },

            {

              "value": "plane",

              "label": "Plane"

            },

            {

              "value": "plant",

              "label": "Plant"

            },

            {

              "value": "price_tag",

              "label": "Price tag"

            },

            {

              "value": "question_mark",

              "label": "Question mark"

            },

            {

              "value": "recycle",

              "label": "Recycle"

            },

            {

              "value": "return",

              "label": "Return"

            },

            {

              "value": "ruler",

              "label": "Ruler"

            },

            {

              "value": "serving_dish",

              "label": "Serving dish"

            },

            {

              "value": "shirt",

              "label": "Shirt"

            },

            {

              "value": "shoe",

              "label": "Shoe"

            },

            {

              "value": "silhouette",

              "label": "Silhouette"

            },

            {

              "value": "snowflake",

              "label": "Snowflake"

            },

            {

              "value": "star",

              "label": "Star"

            },

            {

              "value": "stopwatch",

              "label": "Stopwatch"

            },

            {

              "value": "truck",

              "label": "Truck"

            },

            {

              "value": "washing",

              "label": "Washing"

            }

          ],

          "default": "box",

          "label": "Icon"

        },

        {

          "type": "page",

       "id": "side_panel_2_page",

          "label": "Page"

        },

{

"type": "header",

"content": "Panel 3"

},

        {

          "type": "text",

          "id": "side_panel_3_label",

          "default": "Care Guide",

          "label": "Label"

        },

        {

          "type": "select",

          "id": "side_panel_3_icon",

          "options": [

            {

              "value": "none",

              "label": "None"

            },

            {

              "value": "apple",

              "label": "Apple"

            },

            {

              "value": "banana",

              "label": "Banana"

            },

            {

              "value": "bottle",

              "label": "Bottle"

            },

            {

              "value": "box",

              "label": "Box"

            },

            {

              "value": "carrot",

              "label": "Carrot"

            },

            {

              "value": "chat_bubble",

              "label": "Chat bubble"

            },

            {

              "value": "check_mark",

              "label": "Check mark"

            },

            {

              "value": "clipboard",

              "label": "Clipboard"

            },

            {

              "value": "dairy",

              "label": "Dairy"

            },

            {

              "value": "dairy_free",

              "label": "Dairy free"

            },

            {

              "value": "dryer",

              "label": "Dryer"

            },

            {

              "value": "eye",

              "label": "Eye"

            },

            {

              "value": "fire",

              "label": "Fire"

            },

            {

              "value": "gluten_free",

              "label": "Gluten free"

            },

            {

              "value": "heart",

              "label": "Heart"

            },

            {

              "value": "iron",

              "label": "Iron"

            },

            {

              "value": "leaf",

              "label": "Leaf"

            },

            {

              "value": "leather",

              "label": "Leather"

            },

            {

              "value": "lightning_bolt",

              "label": "Lightning bolt"

            },

            {

              "value": "lipstick",

              "label": "Lipstick"

            },

            {

              "value": "lock",

              "label": "Lock"

            },

            {

              "value": "map_pin",

              "label": "Map pin"

            },

            {

              "value": "nut_free",

              "label": "Nut free"

            },

            {

              "value": "pants",

              "label": "Pants"

            },

            {

              "value": "paw_print",

              "label": "Paw print"

            },

            {

              "value": "pepper",

              "label": "Pepper"

            },

            {

              "value": "perfume",

              "label": "Perfume"

            },

            {

              "value": "plane",

              "label": "Plane"

            },

            {

              "value": "plant",

              "label": "Plant"

            },

            {

              "value": "price_tag",

              "label": "Price tag"

            },

            {

              "value": "question_mark",

              "label": "Question mark"

            },

            {

              "value": "recycle",

              "label": "Recycle"

            },

            {

              "value": "return",

              "label": "Return"

            },

            {

              "value": "ruler",

              "label": "Ruler"

            },

            {

              "value": "serving_dish",

              "label": "Serving dish"

            },

            {

              "value": "shirt",

              "label": "Shirt"

            },

            {

              "value": "shoe",

              "label": "Shoe"

            },

            {

              "value": "silhouette",

              "label": "Silhouette"

            },

            {

              "value": "snowflake",

              "label": "Snowflake"

            },

            {

              "value": "star",

              "label": "Star"

            },

            {

              "value": "stopwatch",

              "label": "Stopwatch"

            },

            {

              "value": "truck",

              "label": "Truck"

            },

            {

              "value": "washing",

              "label": "Washing"

            }

          ],

          "default": "washing",

          "label": "Icon"

        },

        {

          "type": "page",

       "id": "side_panel_3_page",

          "label": "Page"

        }

      ]

    },

{

      "type": "collapsible_tab",

      "name": "Collapsible row",

      "settings": [

{

"type": "text",

"id": "heading",

"default": "Collapsible row",

"info": "Include a heading that explains the content.",

"label": "Heading"

},

{

"type": "checkbox",

"id": "open",

"default": false,

"label": "Open by default"

},

        {

          "type": "richtext",

          "id": "content",

          "label": "Row content"

        },

        {

          "type": "page",

          "id": "page",

          "label": "Row content from page"

        },

        {

          "type": "liquid",

          "id": "custom_liquid",

          "label": "Custom liquid",

          "info": "Add app snippets or other Liquid code to create advanced customizations. For product description, you can use {{ product.description }}"

        }

      ]

    },

{

      "type": "complementary",

      "name": "Complementary products",

      "limit": 1,

      "settings": [

        {

          "type": "paragraph",

          "content": "To select complementary products, add the Search & Discovery app. [Learn more](https://help.shopify.com/manual/online-store/search-and-discovery/product-recommendations)"

        },

        {

          "type": "text",

          "id": "block_heading",

          "default": "Pairs well with",

          "label": "Heading"

        },

        {

          "type": "range",

          "id": "product_list_limit",

          "min": 1,

          "max": 10,

          "step": 1,

          "default": 10,

          "label": "Maximum products to show"

        }

      ]

    },

{

      "type": "icon_list",

      "name": "Icon list",

      "limit": 1,

      "settings": [

{

"type": "header",

"content": "Icon 1"

},

        {

          "type": "select",

          "id": "icon_1_icon",

          "options": [

            {

              "value": "none",

              "label": "None"

            },

            {

              "value": "apple",

              "label": "Apple"

            },

            {

              "value": "banana",

              "label": "Banana"

            },

            {

              "value": "bottle",

              "label": "Bottle"

            },

            {

              "value": "box",

              "label": "Box"

            },

            {

              "value": "carrot",

              "label": "Carrot"

            },

            {

              "value": "chat_bubble",

              "label": "Chat bubble"

            },

            {

              "value": "check_mark",

              "label": "Check mark"

            },

            {

              "value": "clipboard",

              "label": "Clipboard"

            },

            {

              "value": "dairy",

              "label": "Dairy"

            },

            {

              "value": "dairy_free",

              "label": "Dairy free"

            },

            {

              "value": "dryer",

              "label": "Dryer"

            },

            {

              "value": "eye",

              "label": "Eye"

            },

            {

              "value": "fire",

              "label": "Fire"

            },

            {

              "value": "gluten_free",

              "label": "Gluten free"

            },

            {

              "value": "heart",

              "label": "Heart"

            },

            {

              "value": "iron",

              "label": "Iron"

            },

            {

              "value": "leaf",

              "label": "Leaf"

            },

            {

              "value": "leather",

              "label": "Leather"

            },

            {

              "value": "lightning_bolt",

              "label": "Lightning bolt"

            },

            {

              "value": "lipstick",

              "label": "Lipstick"

            },

            {

              "value": "lock",

              "label": "Lock"

            },

            {

              "value": "map_pin",

              "label": "Map pin"

            },

            {

              "value": "nut_free",

              "label": "Nut free"

            },

            {

              "value": "pants",

              "label": "Pants"

            },

            {

              "value": "paw_print",

              "label": "Paw print"

            },

            {

              "value": "pepper",

              "label": "Pepper"

            },

            {

              "value": "perfume",

              "label": "Perfume"

            },

            {

              "value": "plane",

              "label": "Plane"

            },

            {

              "value": "plant",

              "label": "Plant"

            },

            {

              "value": "price_tag",

              "label": "Price tag"

            },

            {

              "value": "question_mark",

              "label": "Question mark"

            },

            {

              "value": "recycle",

              "label": "Recycle"

            },

            {

              "value": "return",

              "label": "Return"

            },

            {

              "value": "ruler",

              "label": "Ruler"

            },

            {

              "value": "serving_dish",

              "label": "Serving dish"

            },

            {

              "value": "shirt",

              "label": "Shirt"

            },

            {

              "value": "shoe",

              "label": "Shoe"

            },

            {

              "value": "silhouette",

              "label": "Silhouette"

            },

            {

              "value": "snowflake",

              "label": "Snowflake"

            },

            {

              "value": "star",

              "label": "Star"

            },

            {

              "value": "stopwatch",

              "label": "Stopwatch"

            },

            {

              "value": "truck",

              "label": "Truck"

            },

            {

              "value": "washing",

              "label": "Washing"

            }

          ],

          "default": "ruler",

          "label": "Icon"

        },

{

"type": "image_picker",

"id": "icon_1_image",

"label": "Custom icon",

"info": "40 x 40 .png recommended."

},

{

          "type": "text",

          "id": "icon_1_text",

          "default": "Icon list label 1",

          "label": "Icon 1 label"

        },

{

"type": "header",

"content": "Icon 2"

},

        {

          "type": "select",

          "id": "icon_2_icon",

          "options": [

            {

              "value": "none",

              "label": "None"

            },

            {

              "value": "apple",

              "label": "Apple"

            },

            {

              "value": "banana",

              "label": "Banana"

            },

            {

              "value": "bottle",

              "label": "Bottle"

            },

            {

              "value": "box",

              "label": "Box"

            },

            {

              "value": "carrot",

              "label": "Carrot"

            },

            {

              "value": "chat_bubble",

              "label": "Chat bubble"

            },

            {

              "value": "check_mark",

              "label": "Check mark"

            },

            {

              "value": "clipboard",

              "label": "Clipboard"

            },

            {

              "value": "dairy",

              "label": "Dairy"

            },

            {

              "value": "dairy_free",

              "label": "Dairy free"

            },

            {

              "value": "dryer",

              "label": "Dryer"

            },

            {

              "value": "eye",

              "label": "Eye"

            },

            {

              "value": "fire",

              "label": "Fire"

            },

            {

              "value": "gluten_free",

              "label": "Gluten free"

            },

            {

              "value": "heart",

              "label": "Heart"

            },

            {

              "value": "iron",

              "label": "Iron"

            },

            {

              "value": "leaf",

              "label": "Leaf"

            },

            {

              "value": "leather",

              "label": "Leather"

            },

            {

              "value": "lightning_bolt",

              "label": "Lightning bolt"

            },

            {

              "value": "lipstick",

              "label": "Lipstick"

            },

            {

              "value": "lock",

              "label": "Lock"

            },

            {

              "value": "map_pin",

              "label": "Map pin"

            },

            {

              "value": "nut_free",

              "label": "Nut free"

            },

            {

              "value": "pants",

              "label": "Pants"

            },

            {

              "value": "paw_print",

              "label": "Paw print"

            },

            {

              "value": "pepper",

              "label": "Pepper"

            },

            {

              "value": "perfume",

              "label": "Perfume"

            },

            {

              "value": "plane",

              "label": "Plane"

            },

            {

              "value": "plant",

              "label": "Plant"

            },

            {

              "value": "price_tag",

              "label": "Price tag"

            },

            {

              "value": "question_mark",

              "label": "Question mark"

            },

            {

              "value": "recycle",

              "label": "Recycle"

            },

            {

              "value": "return",

              "label": "Return"

            },

            {

              "value": "ruler",

              "label": "Ruler"

            },

            {

              "value": "serving_dish",

              "label": "Serving dish"

            },

            {

              "value": "shirt",

              "label": "Shirt"

            },

            {

              "value": "shoe",

              "label": "Shoe"

            },

            {

              "value": "silhouette",

              "label": "Silhouette"

            },

            {

              "value": "snowflake",

              "label": "Snowflake"

            },

            {

              "value": "star",

              "label": "Star"

            },

            {

              "value": "stopwatch",

              "label": "Stopwatch"

            },

            {

              "value": "truck",

              "label": "Truck"

            },

            {

              "value": "washing",

              "label": "Washing"

            }

          ],

          "default": "box",

          "label": "Icon"

        },

{

"type": "image_picker",

"id": "icon_2_image",

"label": "Custom icon",

"info": "40 x 40 .png recommended."

},

{

          "type": "text",

          "id": "icon_2_text",

          "default": "Icon list label 2",

          "label": "Icon 2 label"

        },

{

"type": "header",

"content": "Icon 3"

},

        {

          "type": "select",

          "id": "icon_3_icon",

          "options": [

            {

              "value": "none",

              "label": "None"

            },

            {

              "value": "apple",

              "label": "Apple"

            },

            {

              "value": "banana",

              "label": "Banana"

            },

            {

              "value": "bottle",

              "label": "Bottle"

            },

            {

              "value": "box",

              "label": "Box"

            },

            {

              "value": "carrot",

              "label": "Carrot"

            },

            {

              "value": "chat_bubble",

              "label": "Chat bubble"

            },

            {

              "value": "check_mark",

              "label": "Check mark"

            },

            {

              "value": "clipboard",

              "label": "Clipboard"

            },

            {

              "value": "dairy",

              "label": "Dairy"

            },

            {

              "value": "dairy_free",

              "label": "Dairy free"

            },

            {

              "value": "dryer",

              "label": "Dryer"

            },

            {

              "value": "eye",

              "label": "Eye"

            },

            {

              "value": "fire",

              "label": "Fire"

            },

            {

              "value": "gluten_free",

              "label": "Gluten free"

            },

            {

              "value": "heart",

              "label": "Heart"

            },

            {

              "value": "iron",

              "label": "Iron"

            },

            {

              "value": "leaf",

              "label": "Leaf"

            },

            {

              "value": "leather",

              "label": "Leather"

            },

            {

              "value": "lightning_bolt",

              "label": "Lightning bolt"

            },

            {

              "value": "lipstick",

              "label": "Lipstick"

            },

            {

              "value": "lock",

              "label": "Lock"

            },

            {

              "value": "map_pin",

              "label": "Map pin"

            },

            {

              "value": "nut_free",

              "label": "Nut free"

            },

            {

              "value": "pants",

              "label": "Pants"

            },

            {

              "value": "paw_print",

              "label": "Paw print"

            },

            {

              "value": "pepper",

              "label": "Pepper"

            },

            {

              "value": "perfume",

              "label": "Perfume"

            },

            {

              "value": "plane",

              "label": "Plane"

            },

            {

              "value": "plant",

              "label": "Plant"

            },

            {

              "value": "price_tag",

              "label": "Price tag"

            },

            {

              "value": "question_mark",

              "label": "Question mark"

            },

            {

              "value": "recycle",

              "label": "Recycle"

            },

            {

              "value": "return",

              "label": "Return"

            },

            {

              "value": "ruler",

              "label": "Ruler"

            },

            {

              "value": "serving_dish",

              "label": "Serving dish"

            },

            {

              "value": "shirt",

              "label": "Shirt"

            },

            {

              "value": "shoe",

              "label": "Shoe"

            },

            {

              "value": "silhouette",

              "label": "Silhouette"

            },

            {

              "value": "snowflake",

              "label": "Snowflake"

            },

            {

              "value": "star",

              "label": "Star"

            },

            {

              "value": "stopwatch",

              "label": "Stopwatch"

            },

            {

              "value": "truck",

              "label": "Truck"

            },

            {

              "value": "washing",

              "label": "Washing"

            }

          ],

          "default": "star",

          "label": "Icon"

        },

{

"type": "image_picker",

"id": "icon_3_image",

"label": "Custom icon",

"info": "40 x 40 .png recommended."

},

{

          "type": "text",

          "id": "icon_3_text",

          "default": "Icon list label 3",

          "label": "Icon 3 label"

        },

{

"type": "header",

"content": "Icon 4"

},

        {

          "type": "select",

          "id": "icon_4_icon",

          "options": [

            {

              "value": "none",

              "label": "None"

            },

            {

              "value": "apple",

              "label": "Apple"

            },

            {

              "value": "banana",

              "label": "Banana"

            },

            {

              "value": "bottle",

              "label": "Bottle"

            },

            {

              "value": "box",

              "label": "Box"

            },

            {

              "value": "carrot",

              "label": "Carrot"

            },

            {

              "value": "chat_bubble",

              "label": "Chat bubble"

            },

            {

              "value": "check_mark",

              "label": "Check mark"

            },

            {

              "value": "clipboard",

              "label": "Clipboard"

            },

            {

              "value": "dairy",

              "label": "Dairy"

            },

            {

              "value": "dairy_free",

              "label": "Dairy free"

            },

            {

              "value": "dryer",

              "label": "Dryer"

            },

            {

              "value": "eye",

              "label": "Eye"

            },

            {

              "value": "fire",

              "label": "Fire"

            },

            {

              "value": "gluten_free",

              "label": "Gluten free"

            },

            {

              "value": "heart",

              "label": "Heart"

            },

            {

              "value": "iron",

              "label": "Iron"

            },

            {

              "value": "leaf",

              "label": "Leaf"

            },

            {

              "value": "leather",

              "label": "Leather"

            },

            {

              "value": "lightning_bolt",

              "label": "Lightning bolt"

            },

            {

              "value": "lipstick",

              "label": "Lipstick"

            },

            {

              "value": "lock",

              "label": "Lock"

            },

            {

              "value": "map_pin",

              "label": "Map pin"

            },

            {

              "value": "nut_free",

              "label": "Nut free"

            },

            {

              "value": "pants",

              "label": "Pants"

            },

            {

              "value": "paw_print",

              "label": "Paw print"

            },

            {

              "value": "pepper",

              "label": "Pepper"

            },

            {

              "value": "perfume",

              "label": "Perfume"

            },

            {

              "value": "plane",

              "label": "Plane"

            },

            {

              "value": "plant",

              "label": "Plant"

            },

            {

              "value": "price_tag",

              "label": "Price tag"

            },

            {

              "value": "question_mark",

              "label": "Question mark"

            },

            {

              "value": "recycle",

              "label": "Recycle"

            },

            {

              "value": "return",

              "label": "Return"

            },

            {

              "value": "ruler",

              "label": "Ruler"

            },

            {

              "value": "serving_dish",

              "label": "Serving dish"

            },

            {

              "value": "shirt",

              "label": "Shirt"

            },

            {

              "value": "shoe",

              "label": "Shoe"

            },

            {

              "value": "silhouette",

              "label": "Silhouette"

            },

            {

              "value": "snowflake",

              "label": "Snowflake"

            },

            {

              "value": "star",

              "label": "Star"

            },

            {

              "value": "stopwatch",

              "label": "Stopwatch"

            },

            {

              "value": "truck",

              "label": "Truck"

            },

            {

              "value": "washing",

              "label": "Washing"

            }

          ],

          "default": "washing",

          "label": "Icon"

        },

{

"type": "image_picker",

"id": "icon_4_image",

"label": "Custom icon",

"info": "40 x 40 .png recommended."

},

{

          "type": "text",

          "id": "icon_4_text",

          "default": "Icon list label 4",

          "label": "Icon 4 label"

        }

      ]

    },

{

"type": "image",

      "name": "Image",

"settings": [

{

"type": "image_picker",

"id": "image",

"label": "Image"

},

{

"type": "select",

"id": "position",

"label": "Position",

"options": [

{ "value": "text-center", "label": "Center" },

{ "value": "text-left", "label": "Left" },

{ "value": "text-right", "label": "Right" }

],

"default": "text-left"

}

]

},

{

      "type": "custom_option",

      "name": "Line item property",

      "settings": [

{

"type": "paragraph",

"content": "Line item properties are used to collect customization information for an item added to the cart."

},

{

          "type": "select",

          "id": "type",

          "label": "Type",

          "default": "text",

          "options": [

            {

              "label": "Text",

              "value": "text"

            },

            {

              "label": "Textarea",

              "value": "textarea"

            },

            {

              "label": "Checkbox",

              "value": "checkbox"

            },

            {

              "label": "Multiple options",

              "value": "multiple"

            }

          ]

        },

        {

          "type": "text",

          "id": "label",

          "label": "Label",

          "default": "Custom option"

        },

        {

          "type": "checkbox",

          "id": "text_required",

          "label": "Required",

          "info": "Only works with 'Add to cart' button",

          "default": false

        },

{

          "type": "header",

          "content": "Text",

"info": "Requires line item property type to be Text or Textarea."

        },

{

          "type": "text",

          "id": "text_placeholder",

          "label": "Placeholder",

          "default": "Enter your text here"

        },

        {

          "type": "header",

          "content": "Checkbox",

"info": "Requires line item property type to be Checkbox."

        },

        {

          "type": "text",

          "id": "checkbox_checked_value",

          "label": "Checked value",

          "default": "Yes"

        },

        {

          "type": "text",

          "id": "checkbox_unchecked_value",

          "label": "Unchecked value",

          "default": "No"

        },

        {

          "type": "header",

          "content": "Multiple options",

"info": "Requires line item property type to be Multiple options."

        },

        {

          "type": "select",

          "id": "multiple_style",

          "label": "Style",

          "default": "dropdown",

          "options": [

            {

              "label": "Dropdown",

              "value": "dropdown"

            },

            {

              "label": "Radio",

              "value": "radio"

            }

          ]

        },

        {

          "type": "textarea",

          "id": "multiple_options",

          "label": "Options",

          "default": "Option 1\nOption 2\nOption 3",

          "info": "One option on each line"

        }

      ]

    },

{

      "type": "sku",

      "name": "SKU",

      "settings": [

{

"type": "select",

"id": "sku_style",

"options": [

{

"value": "style_body",

"label": "Body"

},

{

"value": "subheading",

"label": "Subheading"

},

{

"value": "style_vendor",

"label": "Vendor"

}

],

"default": "style_vendor",

"label": "SKU style"

}

      ]

    },

{

      "type": "info_box",

      "name": "Info box",

      "settings": [

{

"type": "select",

"id": "icon",

"options": [

{

"value": "none",

"label": "None"

},

{

"value": "apple",

"label": "Apple"

},

{

"value": "banana",

"label": "Banana"

},

{

"value": "bottle",

"label": "Bottle"

},

{

"value": "box",

"label": "Box"

},

{

"value": "carrot",

"label": "Carrot"

},

{

"value": "chat_bubble",

"label": "Chat bubble"

},

{

"value": "check_mark",

"label": "Check mark"

},

{

"value": "clipboard",

"label": "Clipboard"

},

{

"value": "dairy",

"label": "Dairy"

},

{

"value": "dairy_free",

"label": "Dairy free"

},

{

"value": "dryer",

"label": "Dryer"

},

{

"value": "eye",

"label": "Eye"

},

{

"value": "fire",

"label": "Fire"

},

{

"value": "gluten_free",

"label": "Gluten free"

},

{

"value": "heart",

"label": "Heart"

},

{

"value": "iron",

"label": "Iron"

},

{

"value": "leaf",

"label": "Leaf"

},

{

"value": "leather",

"label": "Leather"

},

{

"value": "lightning_bolt",

"label": "Lightning bolt"

},

{

"value": "lipstick",

"label": "Lipstick"

},

{

"value": "lock",

"label": "Lock"

},

{

"value": "map_pin",

"label": "Map pin"

},

{

"value": "nut_free",

"label": "Nut free"

},

{

"value": "pants",

"label": "Pants"

},

{

"value": "paw_print",

"label": "Paw print"

},

{

"value": "pepper",

"label": "Pepper"

},

{

"value": "perfume",

"label": "Perfume"

},

{

"value": "plane",

"label": "Plane"

},

{

"value": "plant",

"label": "Plant"

},

{

"value": "price_tag",

"label": "Price tag"

},

{

"value": "question_mark",

"label": "Question mark"

},

{

"value": "recycle",

"label": "Recycle"

},

{

"value": "return",

"label": "Return"

},

{

"value": "ruler",

"label": "Ruler"

},

{

"value": "serving_dish",

"label": "Serving dish"

},

{

"value": "shirt",

"label": "Shirt"

},

{

"value": "shoe",

"label": "Shoe"

},

{

"value": "silhouette",

"label": "Silhouette"

},

{

"value": "snowflake",

"label": "Snowflake"

},

{

"value": "star",

"label": "Star"

},

{

"value": "stopwatch",

"label": "Stopwatch"

},

{

"value": "truck",

"label": "Truck"

},

{

"value": "washing",

"label": "Washing"

}

],

"default": "ruler",

"label": "Icon"

},

{

"type": "image_picker",

"id": "image",

"label": "Custom icon",

"info": "48 x 48 .png recommended."

},

{

          "type": "text",

          "id": "text",

          "default": "Info box text",

          "label": "Text"

        },

{

"type": "url",

"id": "link",

"label": "Link"

},

{

     "type": "header",

     "content": "Colors"

   },

{

       "type": "color",

       "id": "info_box_bg",

       "label": "Background",

       "default": "#E9E7ED"

     },

{

       "type": "color",

       "id": "info_box_color",

       "label": "Text",

       "default": "#2B1559"

     }

      ]

    },

    {

      "type": "siblings",

      "name": "Siblings",

      "limit": 1,

      "settings": [

        {

          "type": "paragraph",

          "content": "Siblings allow you to split colors into separate products. [Learn more](https://documentation.fuelthemes.net/kb/how-to-setup-product-siblings/)"

        },

        {

          "type": "text",

          "id": "siblings_collection",

          "label": "Product siblings collection handle",

          "info": "Use a metafield containing a collection handle for color siblings.  The collection should contain all color options as unique products."

        },

        {

          "type": "text",

          "id": "sibling_color",

          "label": "Product color metafield",

          "info": "Use a single line text metafield called 'theme.sibling_color' for product color."

        },

        {

          "type": "header",

          "content": "Spacing"

        },

        {

          "type": "range",

          "id": "margin_bottom",

          "min": 0,

          "max": 50,

          "step": 2,

          "unit": "px",

          "label": "Margin bottom",

          "default": 20

        }

      ]

    }

  ]

}

{% endschema %}

[Gabe]

Hey @moritz01 

Alle Theme sind anders strukturiert und meine vorherige Anleitung ist mehr für die Shopify Free Themes, nicht für die Premium Themes wie dein Vision Theme. Für dein Theme wirst du entweder mit den Theme Entwickler oder mit einem Experten arbeiten müssen, die ich oben bereits empfohlen habe.

Generell gesagt, kannst du den Code direkt in die main.product.liquid Datei oder eine entsprechende Liquid-Datei einfügen, die für die Produktseite verwendet wird direkt vor oder nach dem Add-to-Cart-Button Code. Da in deinem vorherigen Code-Ausschnitt der Add-to-Cart-Button nicht direkt ersichtlich ist, empfehle ich, in den Bereichen nachzuschauen, die sich auf Produktinformationen beziehen, wie beispielsweise in den render-Aufrufen für product-information. Es ist möglich, dass der Button innerhalb dieser gerenderten Teile definiert wird. Es ist auch möglich, dass im Vision Theme der Button in einem anderen inkludierten Template (render oder include Befehl) definiert ist, musst du möglicherweise dort den Code einfügen.

Der Add-to-Cart-Button ist somit in deinem obigen nicht direkt sichtbar, ausser du kannst es finden. Überprüfe, ob es eine Render-Anweisung oder ein weiteres Template gibt, das für die Darstellung des Buttons verantwortlich ist, vielleicht im Theme-Verzeichnis unter Snippets. Dies könnte in einer der render-Anweisungen in deinem Dokument enthalten sein, wie z.B. {%- render 'product-information', product: product, section: section, update_url: true, pickup: true, first_image: first_image, hide_variants: hide_variants -%}. Sobald du den Standort des Buttons gefunden hast, kannst du dein Datalayer-Snippet dort einfügen. Achte darauf, dass du den JavaScript-Code innerhalb von <script>-Tags platzierst, wenn er direkt in eine Liquid-Datei eingefügt wird.

Hoffe das hilft dir weiter - lass wissen falls nicht! 😉

---
Warum nicht etwas Gamification in das Shop einbauen, um deinen Kunden etwas Fun im Shop anzubieten? Gerne kann ich bei Interesse Tipps dazu geben!

Hast du weitere Fragen zum Shop? Gebe einfach ein Suchbegriff oben in der Suchleiste der Community Landingpage ein, denn das Thema haben wir sehr wahrscheinlich schon besprochen. Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.