Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Principe général

Menu

  1. A quoi sert le Javascript de SPREAD

 

Anchor
Titre_un
Titre_un

A quoi sert le Javascript de SPREAD? 

Le javascript de SPREAD permet :

  •  de mettre en place d'afficher les widgets sur votre site web (exemples ci-dessous)Javascript 1),
  •  de faire remonter les créations de compte dans la CRM SPREAD (Javascript 2),
  •  de faire remonter les commandes dans la CRM SPREAD (Javascript 3).

 

La CRM SPREAD permet ensuite de regrouper les informations commerciales, sociales et comportementales de votre base clients / prospects pour mener des actions spécifiques (fidélisation, animation, relance etc...)

 

Le javascript de SPREAD a été conçu pour Le javascript de SPREAD a été conçu pour ne pas ralentir le temps d’affichage de vos pages (fonctionnement asynchrone) et ainsi vous garantir un fonctionnement transparent.

 

Anchor
Titre_deux
Titre_deux

JAVASCRIPT 1 - Widgets

 

Le javasript ci-dessous Ce javascript est à insérer sur toutes les pages du site, juste avant la balise </body>.

Sa fonction principale est de permettre de piloter les widgets depuis le backoffice SPREAD. Associé aux javascript à la remontée de création de compte et de remontée de commandes(Javascript 2) et à la remontée des commandes (Javascript 3), il permet également de faire remonter ces infos dans la CRM SPREAD.

 

Deux possibilités pour intégrer ce JavaScript :

  • Méthode 1 : Le JavaScript est ajouté uniquement lorsque votre page est chargée (plus rapide)
  • Méthode 2 : Le JavaScript est ajouté même si le contenu de votre page n'est pas fini d'être chargé (plus lent)

     

    Code Block
    languagejs
    themeEmacs
    titleMéthode Javascript 1 - Affichage des widgets
     <script type="text/javascript">
    		var spconfig = {
     var  publicKeySb = "????????????????";  /*à remplacer par votre clé d’API Publique*/ public_key: "*****************************",
         var sbsetcookie = true; /*facultatif : uniquement si vous utilisez le parrainage*/     debug: false,
                set_cookie: true,
                track_order_enabled: true
            };
            function loadSpreadTracker(){ window.domLoadEventFired=true;var e=document.createElement("script");e.type="text/javascript";e.async=true;e.charset="UTF-8";e.id="spread-tracker";e.src="//static-sb.com/js/sb-tracker.js";document.body.appendChild(e) } if(window.addEventListener) { window.addEventListener("load",loadSpreadTracker,false) } else if(window.attachEvent) { window.attachEvent("onload",loadSpreadTracker) } else { window.onload=loadSpreadTracker }
    
    
    
     </script>
    Code Block
    languagejs
    titleMéthode 2
     <script type="text/javascript">
    
    	var publicKeySb = "????????????????" ;  /*à remplacer par votre clé d’API Publique*/ 
        var sbsetcookie = true; /*facultatif : uniquement si vous utilisez le parrainage*/
    	var iproto = (("https:" == document.location.protocol) ? "https://" : "http://");
    
    	document.write(unescape("%3Cscript src='" + iproto + "static-sb.com/js/sb-tracker.js' charset='UTF-8' type='text/javascript'%3E%3C/script%3E"));	
    
    </script>
    Note
    titleAttention

    N'intégrez pas directement le fichier "sb-tracker.js" sur votre site sans quoi vous ne pourrez pas bénéficier des mises à jour que nous réalisons régulièrement

    JAVASCRIPT 2 -  Remontée de commandes

     

    Le traqueur de commande permet d’intégrer automatiquement les commandes et les clients dans la CRM de SPREAD (à chaque fois qu’un de vos clients passe une commande).

     

    Le code suivant est à insérer sur la page de confirmation de commande, en plus du tag sur toutes les pages (de préférence avant).

     

     

     

    Code Block<script type="text/javascript"> var siteid = "????????????????" ; /*à remplacer par votre clé d’API Publique*/ var sbactionOrder = 1; var spreadOrderEmail = "john@doe.com" ; var spreadOrderAmount = 13.30 ; var spreadOrderFirstname = "John" ; /* seulement si le nom et le prénom sont séparés*/ var spreadOrderName = "Doe" ; /* «John Doe» si pas séparés */ var spreadIdOrder = "1340" ; /* ID de la commande */ var spreadOrderOptin = 1 ; var spreadOrderState = 20 ; /* 10, 20, 50, 100, 0 */ var ordertest = 0 ; var sbOrderNum = "F2013-9743"; /* 2ème numéro de facture possible */ /* Champs optionnels */ var spreadOrderBirthday = "1975-12-25"; var spreadOrderGender = "male"; /* ou «female» */ var spreadOrderAddress = "8, rue de la place"; var spreadOrderCp = "76000"; var spreadOrderCity = "Rouen"; var spreadOrderCountry = "FR"; /* pays au format ISO : FR, ES, IT, DE... */ var spreadOrderTel = "0235000000"; var spreadOrderMobile = "0690870089"; var spreadOrderFonction = "CEO"; var spreadOrderCompany = "My Company"; /* Champs personnalisables */ /* 7 et 8 correspondent aux id des champs personnalisables que vous trouvez dans votre backoffice, menu Paramétrage > Tracker

     

    Dans ce script, il vous suffit de modifier les étoiles ( **** ) par votre clé API publique que vous trouverez dans votre BackOffice (onglet Paramétrage > Tracker).

     

    Note
    titleAttention

    N'intégrez pas directement le fichier "sb-tracker.js" sur votre site sans quoi vous ne pourrez pas bénéficier des mises à jour que nous réalisons régulièrement

    Anchor
    Titre_trois
    Titre_trois

     

    Javascript 3 - Remontée des créations de compte

     

     

    Ce javascript permet d’intégrer automatiquement les visiteurs qui créent un compte sur votre site directement dans la CRM de SPREAD.

     

    Le code suivant est à insérer sur la page de confirmation de création du compte, en plus du tag sur toutes les pages.

     

     

    Code Block
    languagejs
    <script type="text/javascript">
    var siteid = "????????????????" ; /*à remplacer par votre clé d’API Publique*/
    var sbactionSignup = 1; 
    var spreadOrderEmail = "john@doe.com" ; 
    var spreadOrderFirstname = "John" ; /* seulement si le nom et le prénom sont séparés*/
    var spreadOrderName = "Doe" ; /* «John Doe» si pas séparés */ 
    var spreadOrderOptin = 1 ; 
    var ordertest = 0 ; 
    
    
    /* Champs optionnels */
    var spreadOrderBirthday = "1975-12-25"; 
    var spreadOrderGender = "male"; /* ou «female» */
    var spreadOrderAddress = "8, rue de la place";
    var spreadOrderCp = "76000";
    var spreadOrderCity = "Rouen";
    var spreadOrderCountry = "FR"; /* pays au format ISO : FR, ES, IT, DE... */
    var spreadOrderTel = "0235000000";
    var spreadOrderMobile = "0690870089";
    var spreadOrderFonction = "CEO";
    var spreadOrderCompany = "My Company";
    
    /* Champs personnalisables */
    /* 7 et 8 correspondent aux id des champs personnalisables que vous trouvez dans votre backoffice, menu Paramétrage > Tracker */
    var sbCustomFields = {custom_fields : {7 : "Professionnel", 8 : "Cosmétique"}}; 
    /* Tags */
    var add_tag = "tag1, tag2, tag3";
    var del_tag = "tag4";
    
    </script>
    Info

    Pour retrouvez les identifiants de vos champs personnalisables, rendez-vous dans le paramétrage du tracker.

     

     

     

    Informations obligatoires

     

    Les seules informations obligatoires sont :

    •  le «spreadOrderEmail» qui est l’adresse email du client
    •  le «siteid»
    •  le «sbactionSignup» qui permet de savoir qu’il s’agit d’une création de compte









































     

    Anchor
    Titre_quatre
    Titre_quatre

    JAVASCRIPT 2 -  Remontée de commandes

    Le traqueur de commande permet d’intégrer automatiquement les commandes et les clients dans la CRM de SPREAD (à chaque fois qu’un de vos clients passe une commande).

     

    Le code suivant est à insérer sur la page de confirmation de commande, en plus du tag sur toutes les pages (de préférence avant).

     

     

     

    Code Block
    <script type="text/javascript">
    
    	var siteid = "????????????????" ; /*à remplacer par votre clé d’API Publique*/              
        var sbactionOrder = 1;			
        var spreadOrderEmail = "john@doe.com" ; 		
        var spreadOrderAmount = 13.30 ; 				
        var spreadOrderFirstname = "John" ; /* seulement si le nom et le prénom sont séparés*/
        var spreadOrderName = "Doe" ; 	/* «John Doe» si pas séparés */
        var spreadIdOrder = "1340" ;  /* ID de la commande */
        var sbCustomFieldsspreadOrderOptin = {custom_fields : {7 : "Professionnel", 8 : "Cosmétique"}}; 
    
        /* Tags 1 ; 
        var spreadOrderState = 20 ; /* 10, 20, 50, 100, 0 */
        var add_tagordertest = "tag1, tag2, tag3";0 ;
    
        var del_tagsbOrderNum = "tag4F2013-9743"; 
    </script>
    Info

    Pour retrouvez les identifiants de vos champs personnalisables, rendez-vous dans le paramétrage du tracker.

     

    Informations obligatoires

     

    Les seules informations obligatoires sont :

    •  le «orderemail» qui est l’adresse email du client
    •  le «siteid» qui est la clé d’API du site et peut être trouvé dans le tableau de bord SPREAD de la boutique ( Paramétrage > Clé API). Si vous avez mis le javascript sur toutes les pages, avec le  «publicKeySb» vous n’avez pas besoin de le préciser.
    •  le «sbactionOrder» qui permet de savoir qu’il s’agit d’une commande 

     

     

     Gestion de l’idorder

    La valeur «idorder» est l’identifiant unique de la commande sur la boutique. La première fois que cet identifiant est utilisé, la commande est enregistrée dans la CRM. Si l’identifiant de commande est présenté une deuxième fois, les données sont mises à jour.

    Cet identifiant est particulièrement utile pour changer l’état de la commande (l’annuler ou la mettre à expédier).

     

     

    Gestion de l’état de la commande (orderstate)

    Si vous avez indiqué l’ «idorder» vous allez pouvoir faire évoluer l’état de la commande au fur et à mesure avec la variable orderstate :

    •  10     :    enregistrée
    •  20     :    payée
    •  50     :    expédiée
    •  100   :    reçue
    •  0       :    annulée

     

    sbOrderNum est optionnel et peut être utilisé pour passer un numéro de facture différent de l’ID de commande.

     

     

    Gestion des champs optionnels

    Il est possible de faire remonter l'anniversaire, le sexe, l’adresse, le code postal, la ville, le pays, le numéro de téléphone (portable et fixe) du client. Egalement sa fonction et son entreprise pour le BtoB (voir le détail des variables pour le format).  

    Gestion des champs personnalisables

    Avec les champs personnalisables, il est possible d’insérer des infos spécifiques dans la CRM SPREAD. Chacun de vos champs personnalisables possèdent un identifiant unique qui permet de les utiliser dans le tracker. Vous pouvez retrouver ces identifiants dans le paramétrage du tracker.

     

    Exemple :

    Code Block
    languagejs
    var sbCustomFields = {custom_fields : {390 : "Professionnel", 391 : "Boutique US"}};
     

    Image Removed

     

     Gestion des tags

    Avec les tags vous pouvez ajouter des informations concernant votre client ou ses commandes. Ils sont exclusivement liés à un client.

    La variable add_tag permet d’ajouter des tags (séparés par une virgule).

    La variable del_tag permet de supprimer des tags (séparés par une virgule).

     

     

    Exemple :

    •  add_tag      :     « tag1,tag2,tag3 » 
    •  del_tag      :     « tag4 »

    Javascript 3 - création de compte

     

    Ce javascript permet d’intégrer automatiquement les visiteurs qui créent un compte sur votre site directement dans la CRM de SPREAD.

    Le code suivant est à insérer sur la page de confirmation de création du compte, en plus du tag sur toutes les pages.

     

    Code Block
    languagejs
    <script type="text/javascript">
    var siteid = "????????????????" ; /*à remplacer par votre clé d’API Publique*/
    var sbactionSignup = 1; 
    var spreadOrderEmail = "john@doe.com" ; 
    var spreadOrderFirstname = "John" ; /* seulement si le nom et le prénom sont séparés*/
    var spreadOrderName = "Doe" ; /* «John Doe» si pas séparés */ 
    var spreadOrderOptin = 1 ; 
    var ordertest = 0 ; 
    
    
    /* Champs optionnels */
    var spreadOrderBirthday = "1975-12-25"; 
    var spreadOrderGender = "male"; /* ou «female» */
    var spreadOrderAddress = "8, rue de la place";
    var spreadOrderCp = "76000";
    var spreadOrderCity = "Rouen";
    var spreadOrderCountry = "FR"; /* pays au format ISO : FR, ES, IT, DE... */
    var spreadOrderTel = "0235000000";
    var spreadOrderMobile = "0690870089";
    var spreadOrderFonction = "CEO";
    var spreadOrderCompany = "My Company";
    
    /* Champs personnalisables */
    /* 7 et 8 correspondent aux id des champs personnalisables que vous trouvez dans votre backoffice, menu Paramétrage > Tracker */
    /* 2ème numéro de facture possible */
    
        /* Champs optionnels */
        var spreadOrderBirthday = "1975-12-25"; 
        var spreadOrderGender = "male";  /* ou «female» */
        var spreadOrderAddress = "8, rue de la place";
        var spreadOrderCp = "76000";
        var spreadOrderCity = "Rouen";
        var spreadOrderCountry = "FR";  /* pays au format ISO : FR, ES, IT, DE... */
        var spreadOrderTel = "0235000000";	
        var spreadOrderMobile = "0690870089";
        var spreadOrderFonction = "CEO";
        var spreadOrderCompany = "My Company";
    
        /* Champs personnalisables */
        /* 7 et 8 correspondent aux id des champs personnalisables que vous trouvez dans votre backoffice, menu Paramétrage > Tracker */
        var sbCustomFields = {custom_fields : {7 : "Professionnel", 8 : "Cosmétique"}}; 
    
        /* Tags */
        var add_tag = "tag1, tag2, tag3";
        var del_tag = "tag4";
    
    </script>
    Info

    Pour retrouvez les identifiants de vos champs personnalisables, rendez-vous dans le paramétrage du tracker.

     


    Informations obligatoires

     

    Les seules informations obligatoires sont :

    •  le «orderemail» qui est l’adresse email du client
    •  le «siteid» qui est la clé d’API du site et peut être trouvé dans le tableau de bord SPREAD de la boutique ( Paramétrage > Clé API). Si vous avez mis le javascript sur toutes les pages, avec le  «publicKeySb» vous n’avez pas besoin de le préciser.
    •  le «sbactionOrder» qui permet de savoir qu’il s’agit d’une commande 

     

     

     Gestion de l’idorder

    La valeur «idorder» est l’identifiant unique de la commande sur la boutique. La première fois que cet identifiant est utilisé, la commande est enregistrée dans la CRM. Si l’identifiant de commande est présenté une deuxième fois, les données sont mises à jour.

    Cet identifiant est particulièrement utile pour changer l’état de la commande (l’annuler ou la mettre à expédier).

     

     

    Gestion de l’état de la commande (orderstate)

    Si vous avez indiqué l’ «idorder» vous allez pouvoir faire évoluer l’état de la commande au fur et à mesure avec la variable orderstate :

    •  10     :    enregistrée
    •  20     :    payée
    •  50     :    expédiée
    •  100   :    reçue
    •  0       :    annulée

     

    sbOrderNum est optionnel et peut être utilisé pour passer un numéro de facture différent de l’ID de commande.

     

     

    Gestion des champs optionnels

    Il est possible de faire remonter l'anniversaire, le sexe, l’adresse, le code postal, la ville, le pays, le numéro de téléphone (portable et fixe) du client. Egalement sa fonction et son entreprise pour le BtoB (voir le détail des variables pour le format).  



    Gestion des champs personnalisables

    Avec les champs personnalisables, il est possible d’insérer des infos spécifiques dans la CRM SPREAD. Chacun de vos champs personnalisables possèdent un identifiant unique qui permet de les utiliser dans le tracker. Vous pouvez retrouver ces identifiants dans le paramétrage du tracker.

     

    Exemple :

    Code Block
    languagejs
    var sbCustomFields = {custom_fields : {
    7
    390 : "Professionnel", 
    8
    391 : "
    Cosmétique
    Boutique US"}};
      /* Tags */ var add_tag = "tag1, tag2, tag3"; var del_tag = "tag4"; </script> InfoPour retrouvez les identifiants de vos champs personnalisables, rendez-vous dans le paramétrage du tracker


     

    Image Added

     

     Gestion des tags

    Avec les tags vous pouvez ajouter des informations concernant votre client ou ses commandes. Ils sont exclusivement liés à un client.

    La variable add_tag permet d’ajouter des tags (séparés par une virgule).

    La variable del_tag permet de supprimer des tags (séparés par une virgule).

     

     

    Informations obligatoires

    Exemple :

    •  

    Les seules informations obligatoires sont :

  •  le «spreadOrderEmail» qui est l’adresse email du client
  •  le «siteid»
  •  le «sbactionSignup» qui permet de savoir qu’il s’agit d’une création de compte
    • add_tag      :     « tag1,tag2,tag3 » 
    •  del_tag      :     « tag4 »


     Détail des  variables

     

    VariablesDescriptionType
    siteid

    Clé API Publique Spread (Paramètrage > Tracker)

    chaîne

     facultatif si «publicKeySb» est définie

    spreadOrderEmail 

    Adresse email du client 

    chaîne

     obligatoire 

    spreadOrderAmount

    Montant de la commande 

    num

    point en séparateur de décimal 

    spreadOrderFirstname

    Prénom du client 

    chaîne 

    spreadOrderName

    Nom du client.

     (Si le prénom n’est pas dissocié, ne pas mettre orderfirstname et mettre le nom ET le prénom dans ordername)

    chaîne 

    spreadIdOrder

    Identifiant unique de commande 

    chaîne, fortement conseillée

    spreadOrderOptin

    Le client accepte de recevoir votre newsletter 

    boolean 1 ou 0 



    spreadOrderState



    Etat de la commande 

    integer
    10 : enregistrée 

     20 : payée 

     50 : expédiée 

     100 : reçue

    0 : annulée 

    ordertest 

    à 1, le script affiche les valeurs chargées au lieu d’effectuer le tracking 

    boolean

    1 ou 0

    sbOrderNum 

    Pour passer un numéro de commande (public contrairement à l’idorder) 

    varchar
    VariablesDescriptionType
    spreadOrderBirthdayDate d'anniversaire

    date

    ("YYYY-MM-DD")

    spreadOrderGenderSexe : female ou malechaîne
    spreadOrderAddressAdressechaîne
    spreadOrderCpCode Postalchaîne
    spreadOrderCityVillechaîne
    spreadOrderCountryPayschaîne
    spreadOrderTelNuméro de téléphonechaîne
    spreadOrderMobileNuméro de portablechaîne
    spreadOrderFonction

    Fonction occupée dans l'entreprise

    (BtoB)

    chaîne
    spreadOrderCompany

    Entreprise du client

    (BtoB)

    chaîne
    add_tag

    Possibilité de passer des informations liées au client

    (Abonnement, etc...)

    chaîne
    del_tagPossibilité de supprimer un tag ajouté précédemmentchaîne

    Intégration solutions e-commerce

     

    Découvrez dans la documentation «solutions» l’intégration avec votre logiciel ecommerce. 

     

    A télécharger ici : http://sb.am/public/Integration_traqueur_SB_solution.pdf 

     

    Historique du document

     

    2.3 - 28 mars 2014 : gestion des tags et ajout de champs optionnels : adresse, ville, code postal, téléphone, fonction, entreprise.

     

    2.2 - 17 novembre 2013 : charset UTF-8 dans le javascript

     

    2.1 - 23 juillet 2013 : séparation nom / prénom

     

    2.0 - 6 juin 2013 : détails sur les widgets

     

    1.9 - 27 mai 2013 : ajout de détails sur les variables et les javascript

     

    1.8 - 27 janvier 2013 : ajout des variables anniversaire, sexe et pays

     

    1.7 - 4 janvier 2013 : ajout du sbOrderNum 

     

    1.6 - 27 novembre 2012 : remplacement de static.sb.am par static-sb.com dans le code de tracking

     

    1.5 - 27 octobre 2012 : ajout des «custom fields» qui permettent d’insérer des infos de type text, num, date ou boolean dans la CRM

     

    1.4 - 19 octobre 2012 : nouvelle version du javascript et nouveau code à insérer qui gère l’inscription à l’espace client d’un site e-commerce et des actions personnalisées

     

    1.3 - 18 avril 2012 : nouvelle version du javascript à installer sur tout le site pour pouvoir activer les widgets

     

    1.2.2 - 12 janvier 2012 : lien vers le document spécifique sur les solutions ecommerce

     

    1.2.1 - 1 décembre 2011 : détails 42Stores

     

    1.2 - 17 novembre 2011 : ajout du protocole HTTPS

    Les paramètres n’ont pas changé, si votre site n’utilise pas de https sur votre page de conversion, vous n’avez pas besoin de mettre à jour.

     

    1.1.1 - 14 octobre 2011 : correction des " autour de la clé d’API dans le javascript. Nouvelle version du plugin Prestashop

     

    1.1 - 3 octobre 2011 : ajout des informations sur l’ensemble des plateformes et solutions ecommerce.

     

    1.0 - version initiale

     


     

    Besoin de plus d'aide?

    Column
    width30%
    Align
    alignleft

     

    Pour toutes questions et informations supplémentaires, n'hésitez pas à contacter notre support par email à support@spreadfamily.com

    Column
    width5%

     

    Column
    width30%
    Align
    alignright

     

    Le support technique est aussi disponible dans votre backoffice en haut à droite dans «AIDE»

     

    Column
    width5%

     

    Column
    width30%
    Align
    aligncenter