Cet article concerne les membres de la boutique : les clients qui ont créé un compte client dans votre boutique. Les clients qui ont commandé sans créer de compte n'ont pas de mot de passe. Cela ne les concerne donc pas.

Un compte de membre ne coûte rien à vos clients. Sa création est gratuite.

Si vous avez activé Services > Set up Customer Membership Accounts dans ShopFactory, votre boutique affiche déjà un bouton de connexion dans le menu principal. Ce bouton permet à un membre de se connecter, mais pas de changer son mot de passe. Le script de cet article ajoute un second bouton qui le permet.

Ce que fait le nouveau bouton

• Un membre clique sur le bouton et une fenêtre de connexion s'ouvre.
• Il se connecte avec l'adresse e-mail et le mot de passe qu'il utilise déjà dans votre boutique.
• Sur cette page, il peut modifier ses coordonnées et définir un nouveau mot de passe.
• La même page lui permet de suivre ses commandes.

Avant de commencer

L'adhésion client doit être activée dans votre boutique. Dans ShopFactory, ouvrez le menu Services et cochez Set up Customer Membership Accounts.

La configuration complète est décrite dans Paramètres d'adhésion client dans ShopFactory.

Étape 1 : créez une page pour le bouton

Vous pouvez placer le bouton sur une page existante. La plupart des marchands créent une nouvelle page pour cela.

1. Ouvrez votre boutique dans ShopFactory.
2. Dans l'arborescence de gauche, cliquez à l'endroit où vous voulez la page : Navigation 1, Navigation 2 ou Unlisted Pages.
3. Cliquez sur + Page ou appuyez sur F8, puis donnez un titre à la page, par exemple "Mon compte".
4. Vérifiez que la page est réglée sur visible et non masquée.

Une page sous Unlisted Pages n'apparaît pas dans vos menus. Vous y renvoyez vous-même depuis l'endroit de votre choix. Voir Comment créer des pages qui ne font pas partie de Navigation 1 et 2 ?

Étape 2 : ajoutez le script à cette page

1. Double-cliquez sur la page dans l'arborescence de gauche pour ouvrir les Page Properties.
2. Dans le menu de gauche de cette fenêtre, cliquez sur Add Custom Contents (Custom Contents dans certaines versions).
3. Cliquez sur le bouton + pour ajouter un bloc. La fenêtre Custom Contents s'ouvre.
4. Dans Enter an identification name, saisissez un nom que vous reconnaîtrez plus tard, par exemple "Member login".
5. Sous Enter contents, collez l'intégralité du script figurant au bas de cet article.
6. Cochez "Field contains Javascript code". Sans cette case, le bouton ne fonctionne pas. Elle indique à ShopFactory que le bloc contient un script, afin qu'il ne soit pas exécuté pendant que vous modifiez votre boutique. C'est à cela que servent les lignes SFNOTE dans le script.
7. Dans Set Location, choisissez Area 3 ou Area 4, pour que le bouton apparaisse dans le contenu de la page.
8. Cliquez sur OK, puis de nouveau sur OK pour fermer les Page Properties.

Les étapes générales pour le HTML personnalisé sont décrites dans Ajouter du code HTML personnalisé à une page ou à l'ensemble du site.

Étape 3 : indiquez votre propre domaine dans le script

Le script contient une ligne que vous devez modifier :

var isantuurl='https://i.santu.com/webshop/mylogin.cgi?from=myeditdetails&fromshop=yourdomain.com';

Remplacez yourdomain.com par le domaine sur lequel votre boutique est publiée, sans https:// devant. Si votre boutique se trouve à l'adresse https://www.myshop.com, la ligne devient :

var isantuurl='https://i.santu.com/webshop/mylogin.cgi?from=myeditdetails&fromshop=www.myshop.com';

Rien d'autre ne doit être modifié dans le script. Le domaine indique à la page de connexion à quelle boutique le membre appartient.

Étape 4 : enregistrez, publiez et testez

Le bouton ne fonctionne que sur une boutique publiée. Dans l'aperçu de ShopFactory, un message indique que la boutique doit d'abord être publiée, ce qui est normal. Enregistrez votre boutique, publiez-la, puis ouvrez la page dans votre navigateur et testez avec votre propre compte de membre.

Le script

Copiez tout ce qui suit, de la première à la dernière ligne.

<a class="GC91 btn-primary btn sf-button" style="border-radius: 50px; color: rgb(0, 0, 0);" href="#" data-role="isantu-button" data-sfcbpermalink="true"><span>Login to track your orders and/or change your details/password</span></a>
<script>
/* SFNOTE_BEGIN:prevent script execution when in editing mode */
if(typeof(tf)!='undefined'&&(typeof(tf.isInSF)=='undefined'||!tf.isInSF())){
/* SFNOTE_END:prevent script execution when in editing mode */

var isantuurl='https://i.santu.com/webshop/mylogin.cgi?from=myeditdetails&fromshop=yourdomain.com';
$('[data-role="isantu-button"][href=#]').on('click', function(e){
  e.preventDefault();
  if(!tf.wm.online){
    alert(LD.LD_SHOP_MUST_BE_PUBLISHED);return false;
  }
  tf.utils.showPopup(isantuurl,0,0,true);
  return false;
});

/* SFNOTE_BEGIN:prevent script execution when in editing mode */
}
/* SFNOTE_END:prevent script execution when in editing mode */
</script>

Articles associés

• Paramètres d'adhésion client dans ShopFactory
• Comment créer des pages qui ne font pas partie de Navigation 1 et 2 ?
• Ajouter du code HTML personnalisé à une page ou à l'ensemble du site