Skip to content

Shopify

È facile integrarsi con il tuo negozio Shopify. Al momento non siamo ancora disponibili come App Shopify, ma far funzionare Fanplayr 360 con il tuo negozio è semplice come copiare e incollare due snippet di codice.

Per Iniziare

Per aggiungere una nuova integrazione Shopify:

  • Vai su Integrazioni / Catalogo / Web, App e Altro.
  • Clicca sull'integrazione Shopify.
  • Sotto Origini, clicca Aggiungi sull'elemento "Traccia evento sito web".
  • Aggiungi un nome alla tua integrazione Origine. Questo è il modo in cui la referenzierai in tutto il sistema Fanplayr 360.
  • Clicca Salva.
  • Verranno ora generate e visualizzate una Chiave di Scrittura e un Endpoint. Le userai nelle istruzioni seguenti, referenziate come WRITE_KEY e ENDPOINT.

Non dimenticare di abilitare questa integrazione una volta che sei pronto a usarla con l'interruttore in alto a destra della pagina.

Tracciamento Pagina

  1. Accedi all'area di amministrazione del tuo negozio.
  2. Vai su Negozio online > Temi.
  3. Clicca sui 3 puntini e poi su Modifica codice.

  • Clicca su theme.liquid

  • Ora aggiungi il seguente codice quasi in fondo alla pagina, appena prima del tag di chiusura </body>.

INFO

Non dimenticare di sostituire la WRITE_KEY con quella che hai creato in precedenza.

javascript
<script>
  (function(t,n){const e=window;let r=e[n];if(!r){r=e[n]=[]}let o=false;try{for(const t of[1]){}crypto.subtle.digest("SHA-256",new ArrayBuffer(0))}catch(t){o=true}if(o){console.log("Fanplayr ignoring old browser");return}const c=["identify","page","track","setConfig","user.set","user.setOnce","user.unset","user.increment"];function s(t){const n=t.split(".");let e=n[0];let o=r;if(n.length===2){o=r[e]=r[e]||{};e=n[1]}o[e]=function(){const n=[t];n.push(...Array.prototype.slice.call(arguments));r.push(n);return r}}for(let t=0;t<c.length;t++){var f=c[t];s(f)}r.init=function(e,o){const c=t.createElement("script");c.type="module";c.async=true;c.dataset["fpLibName"]=n;c.src=typeof FANPLAYR_CUSTOM_LIB_URL!=="undefined"?FANPLAYR_CUSTOM_LIB_URL:"https://cdn.fanplayr.com/cdp/fanplayr-latest.min.js";const s=t.getElementsByTagName("script")[0];s.parentNode.insertBefore(c,s);r["_options"]=o;r["_writeKey"]=e;r["_stubVersion"]="1.0.0"};return r})(document,"fp360");

  fp360.init({
    writeKey: "WRITE_KEY",
    endpoint: "ENDPOINT",
    debug: true
  });

{%- assign pageType = "other" -%}
  {%- case template -%}
    {%- when "index" -%}
        {%- assign pageType = "home" -%}
    {%- when "product" -%}
        {%- assign pageType = "product" -%}
    {%- when "collection" -%}
        {% assign pageType = "category" -%}
    {%- when "cart" -%}
        {% assign pageType = "cart" -%}
    {%- when "search" -%}
        {% assign pageType = "search" -%}
    {%- when "blog" -%}
        {%- assign pageType = "blog" -%}
  {%- endcase -%}

  fp360.page({
    type: {{ pageType | json }}
  });

  {% if template == "collection" %}
  (function(){
    var products = [];
    {%- for product in collection.products -%}
    products.push({
      id: {{ product.id | json }},
      name: {{ product.title | json }},
      price: {{ product.price | divided_by: 100 | json }},
      url: new URL({{ product.url | json }}, location).href,
      imageUrl: new URL({{ product.featured_image | img_url | json }}, location).href
    });
    {%- endfor %}
    fp360.track("Product List Viewed", {
      $products: products
    });
  })();
  {% endif %}

  {% if template == "cart" %}
  (function(){
    var products = [];
    {%- for item in cart.items -%}
    products.push({
      id: {{ item.product_id | json }},
      name: {{ item.title | json }},
      price: {{ item.price | divided_by: 100 | json }},
      url: new URL({{ item.url | json }}, location).href,
      imageUrl: {{ item | img_url | json }},
      quantity: {{ item.quantity | json }}
    });
    {%- endfor %}
    fp360.track("Cart Viewed", {
      $cart: {
        currency: "USD",
        products: products
      }
    });
  })();
  {% endif %}

  {% if template == "product" %}
  fp360.track("Product Viewed", {
    $product: {
      id: {{ product.id | json }},
      name: {{ product.title | json }},
      price: {{ product.price | divided_by: 100 | json }},
      url: new URL({{ product.url | json }}, location).href,
      imageUrl: new URL({{ product.featured_image | img_url | json }}, location).href
    }
  });
  {% endif %}
</script>

Pagina di Conferma Ordine

  • Clicca Impostazioni in basso a sinistra nell'area di amministrazione del negozio

  • Clicca Cassa e account

  • Scorri fino al campo Pagina stato ordine, dove puoi aggiungere il seguente script per tracciare gli ordini.

INFO

Anche in questo caso, non dimenticare di sostituire la WRITE_KEY con quella che hai creato in precedenza.

javascript
<script>
  (function(t,n){const e=window;let r=e[n];if(!r){r=e[n]=[]}let o=false;try{for(const t of[1]){}crypto.subtle.digest("SHA-256",new ArrayBuffer(0))}catch(t){o=true}if(o){console.log("Fanplayr ignoring old browser");return}const c=["identify","page","track","setConfig","user.set","user.setOnce","user.unset","user.increment"];function s(t){const n=t.split(".");let e=n[0];let o=r;if(n.length===2){o=r[e]=r[e]||{};e=n[1]}o[e]=function(){const n=[t];n.push(...Array.prototype.slice.call(arguments));r.push(n);return r}}for(let t=0;t<c.length;t++){var f=c[t];s(f)}r.init=function(e,o){const c=t.createElement("script");c.type="module";c.async=true;c.dataset["fpLibName"]=n;c.src=typeof FANPLAYR_CUSTOM_LIB_URL!=="undefined"?FANPLAYR_CUSTOM_LIB_URL:"https://cdn.fanplayr.com/cdp/fanplayr-latest.min.js";const s=t.getElementsByTagName("script")[0];s.parentNode.insertBefore(c,s);r["_options"]=o;r["_writeKey"]=e;r["_stubVersion"]="1.0.0"};return r})(document,"fp360");

  fp360.init({
    writeKey: "WRITE_KEY",
    endpoint: "ENDPOINT",
    debug: true
  });

  fp360.page({
    type: "Order Completed"
  });

  (function() {
    var order_number = {{order.order_number | json}};
    var subtotal_price = parseFloat("{{order.subtotal_price}}") / 100 || 0;
    var total_price = parseFloat("{{order.total_price}}") / 100 || 0;
    var tax_price = parseFloat("{{order.tax_price}}") / 100 || 0;
    var shipping_price = parseFloat("{{order.shipping_price}}") / 100 || 0;
    var discount = parseFloat("{{order.discount}}") / 100 || 0;
    var discountCode = {{discountCode | json}};
    var currency = {{shop.currency | json}};

    var products = [];
{%- for item in order.line_items -%}
    products.push({
      id: {{ item.product_id | json }},
      price: {{ item.price | divided_by: 100 | json }},
      quantity: {{ item.quantity | json }},
      name: {{ item.title | json}},
      url: "//" + window.location.hostname + {{ item.url | json }},
      imageUrl: {{ item | img_url | json }}
    });
    {%- endfor %}

    fp360.track("Order Completed", {
      $order: {
        orderNumber: order_number,
        revenue: subtotal_price,
        discount: discount,
        discountCode: discountCode,
        shipping: shipping_price,
        tax: tax_price,
        currency: currency,
        products: products
      }
    });
  })();
</script>