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.
.CYHISfnd.png)
Tracciamento Pagina
- Accedi all'area di amministrazione del tuo negozio.
- Vai su Negozio online > Temi.
- 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>