Espace client sous Wordpress

Ce module a été développé pour que vous puissiez proposer à vos clients un espace membre sur votre site, dans lequel ils pourront trouver :

  • Les coordonnées que vous avez enregistrées (utile s'il déménage et qu'il ne sait pas sous quelle adresse il est connu)
  • Ses devis
  • Ses factures
  • Un lien vers un paiement Paypal

Dans Gestan, vous créez pour un contact un accès à son espace client. Il sera alors automatiquement reporté dans Wordpress. Une fois que le client se connecte à votre site, il pourra voir les informations qui le concernent : coordonnées, devis, factures.

Voilà une présentation en video de la simplicité d'utilisation.

(vous pouvez mettre cette video en plein écran.)

L'installation et le paramétrage ne sont pas compliqués, le tuto ci-dessous vous explique tout.

Vous pouvez installer librement l'addon, qui est disponible via l'écran de gestion des ressources Gestan dans une version valable 30 jours. Si l'addon vous plaît, passez commande de la version de production, via ce formulaire. Nous vous enverrons la version de production, qui sera valide pour toutes les machines de votre entreprise, et la facture correspondante.

Pour ceux qui le souhaitent, nos services peuvent effectuer le travail pour vous selon plusieurs formules :

  • création éventuelle de votre site Internet
  • installation et paramétrage de l'addon sur votre site.

Voir conditions sur la page de commande de l'addon sur le site de Gestan (ce lien).

Toutefois, pour ceux qui le préfèrent, nous proposons d'effectuer ce travail pour vous, selon deux formules (voir formulaire de commande sur le site de Gestan) :

  • installation et paramétrage sur votre site existant.
  • installation et paramétrage + réalisation ou migration de votre site Internet.

Pré-requis

Il vous faut :

  • Un site sous Wordpress
  • Un accès FTP
  • L'extension Gestan pour Wordpress téléchargeable ici: gestan.zip

Il faut que votre base MySql soit accessible depuis l'extérieur, ce qui n'est pas toujours le cas chez tous les hébergeurs. Il vous faut aussi un peu d'espace disque (1 facture~=60Ko), mais ce point est rarement bloquant.

Installation de l'extension

Installez normalement l'extension “Gestan” sous Wordpress. Vous pouvez la télécharger ici: gestan.zip.

  • connectez-vous comme administrateur au backoffice de votre site (habituellement, l'adresse pour accéder au backoffice est “www.votresite.fr/wp-admin”)
  • allez sur la page des extensions puis cliquez sur le bouton “ajouter”.
  • cliquez sur le bouton “Mettre une extension en ligne” puis sélectionnez le fichier “Gestan.zip” précédemment téléchargé.
  • enfin, activez l'extension.

Cette extension va créer 4 tables dans la base de données de votre site Wordpress: une pour les clients, une pour les factures, une pour les devis, et enfin une pour les paramétrages.

Elle créée également des shortcodes (Un shortcode dans Wordpress est un petit code entre crochets ([ ]) qui concentre une multitude de fonctionnalités. Vous pouvez placer ces shortcodes n'importe où: dans une barre latérale, une page, un article, etc… avec toute la puissance de Wordpress).

Concrètement, vous pouvez utiliser les shortcodes Gestan pour afficher les données qui seront envoyées par Gestan. Par exemple, si vous mettez “[Gestan_Prenom]” dans une page, il remplacera ce shortcode par le prénom de l'utilisateur connecté.

En voici la liste complète:

  • [Gestan_Email]: Email du contact
  • [Gestan_Civilite]:Civilité courte du contact
  • [Gestan_Prenom]: Prénom du contact
  • [Gestan_Nom]: Nom du contact
  • [Gestan_Adresse1]: 1ère ligne d'adresse du contact
  • [Gestan_Adresse2]: 2ème ligne d'adresse du contact
  • [Gestan_CP]: Code postal du contact
  • [Gestan_Ville]: Ville du contact
  • [Gestan_Telephone_Portable]: Téléphone portable du contact
  • [Gestan_Telephone_Fixe]: Téléphone fixe du contact
  • [Gestan_Date_Naissance]: Date de naissance du contact
  • [Gestan_Coordonnees]: L'ensemble des coordonnées du contact (les éléments non-renseignés ne seront pas affichés)
  • [Gestan_Factures]: Affiche un tableau contenant un résumé des factures, avec la possibilité de les télécharger et/ou de les payer
  • [Gestan_Factures telechargeable=“faux”]: Affiche un tableau contenant un résumé des factures, sans possibilité de les télécharger
  • [Gestan_Devis]: Affiche un tableau contenant un résumé des devis, avec la possibilité de les télécharger
  • [Gestan_Devis telechargeable=“faux”]: Affiche un tableau contenant un résumé des devis, sans possibilité de les télécharger

Créez trois pages (mais vous pourriez aussi tout mettre sur une seule page, ou ajouter d'autres pages selon les besoins), par exemple :

une page coordonnées

Bonjour [Gestan_Prenom],

Bienvenue dans votre espace client, dans lequel vous pourrez retrouver devis et factures émis par Liemi-Office, et régler en ligne si vous possédez une carte bancaire ou un compte Paypal.

Voici vos coordonnées telles que nous les avons enregistrées. Si elles sont inexactes, demandez-nous de les corriger.

[Gestan_Civilite] [Gestan_Prenom] [Gestan_Nom]
[Gestan_Coordonnees]

une page devis

Voici la liste des devis établis à votre intention :

[Gestan_Devis]

une page factures

Voici la liste des factures établies pour votre compte.

[Gestan_Factures]

Créez les menus pour afficher ces trois pages (Selon votre thème WordPress, vous pouvez utiliser une extension comme Widget Logic pour afficher ce menu sur certaines pages et pas d'autres).

Pour gérer l'aspect Espace Membre, vous pouvez utiliser le suffixe wp-admin sur votre site ou une extension faite pour cela (Vous pouvez utiliser “Member Access”)

Pour la page de connexion, faites une page “Espace Membre”, avec par exemple ce simple formulaire :

<form name="loginform" id="loginform" action="http://www.liemi-office.com/wp-login.php" method="post"> 
<p class="login-username">
<label for="user_login">Identifiant</label>
<input type="text" name="log" id="user_login" class="input" value="" size="20">
</p>

<p class="login-password">
<label for="user_pass">Mot de passe</label>
<input type="password" name="pwd" id="user_pass" class="input" value="" size="20">
</p>

<p class="login-remember">
<label><input name="rememberme" type="checkbox" id="rememberme" value="forever"> Se souvenir de moi</label> | <a href="http://www.liemi-office.com/wp-login.php?action=lostpassword">Mot de passe oublié</a>
</p>

<p class="login-submit">
<input type="submit" name="wp-submit" id="wp-submit" class="button-primary" value="Se connecter">
<input type="hidden" name="redirect_to" value="http://www.liemi-office.com/vos-coordonnees/">
</p> 
</form>

N'oubliez pas de déclarer la visibilité de ces pages comme privées !

Installation de l'extension

Commencer par installer dans votre répertoire de programme Gestan (typiquement, C:\Program Files (x86)\GESTAN) les deux fichiers ci-dessous :

Puis :

  • Si vous voulez tester l'extension (version de démonstration limitée à 30 jours) : Il faut installer le module complémentaire. Pour cela, via Outils > Administration > Ressources complémentaires et cherchez le module nommé “GESTAN_WORDPRESS”, puis cliquez sur “Install”. Il sera alors automatiquement téléchargé et installé.
  • Si vous voulez mettre en place l'extension de production : Téléchargez le fichier GESTAN_WORDPRESS.wdl depuis le lien spécifique transmis par ICS-Informatique, et installez-le dans le répertoire des ressources du programme “Data Utilisateur” (vous pouvez ouvrir ce répertoire via Outils > Administration > Répertoires et fichiers, cf ci dessous).

Paramétrage du module

Ouvrez la fenêtre de paramétrages via Outils > Paramètre de l'application > Paramétrage des Add-Ons > Espace client Wordpress.

Page "Paypal"

Vous avez la possibilité de recevoir des paiements Paypal depuis votre site. Pour cela, vous devez indiquer:

  • Adresse Paypal de réception des paiments : un email rattaché à un compte Paypal sur lequel vous recevrez les paiements.
  • Page de retour si le paiement est accepté : l'URL complète de retour si le paiement a abouti (une page créée disant au client que le paiement a bien été reçu)
  • Page de retour si le paiement est refusé : l'URL complète de retour si le paiement est refusé ou qu'il a été annulé (une page créée disant au client que le paiement n'a pas abouti)

Page "Email"

Dans cet onglet, créez un message-type qui pourra être envoyé au client une fois son accès créé.

Là aussi, utilisez les mots-clés disponibles de Gestan :

  • %CIVILITE%: Civilité courte du contact
  • %PRENOM%: Prénom du contact
  • %NOM%: Nom du contact
  • %EMAIL%: Email du contact
  • %TELEPHONE_PORTABLE%: Téléphone portable du contact
  • %TELEPHONE_DOMICILE%: Téléphone domicile du contact
  • %ADRESSE1%: 1ère ligne d'adresse du contact
  • %ADRESSE2%: 2ème ligne d'adresse du contact
  • %CP%: Code postal du contact
  • %VILLE%: Ville du contact
  • %CHAINE_ALEATOIRE%: Mot de passe généré aléatoirement

Page "SQL"

Cet onglet vous permet d'entrer les accès à la base SQL.

  • Adresse du serveur: Adresse URL ou IP de votre serveur
  • Nom de la base de données: Nom de la base de données Worpdress
  • Utilisateur: Nom d'utilisateur ayant accès à la base (avec droits de lecture et d'écriture)
  • Mot de passe: Mot de passe de l'utilisateur lié à la base
  • Préfixe de la base: Préfixe de la base Wordpress, “wp_” par défaut

Vous pouvez trouver ces informations dans le fichier wp-config.php de votre serveur, où:

  • L'adresse du serveur peut être “DB_HOST” (sauf dans le cas où il est “localhost”)
  • Le nom de la base de données est défini par “backupge_wp”
  • L'utilisateur est défini par “DB_USER”
  • Le mot de passe est défini par “DB_PASSWORD”
  • Le préfixe de la base est défini par “$table_prefix”

N'hésitez pas à contacter votre hébergeur pour vous aider à l'accès MySQL Distant

Page "FTP"

Afin d'envoyer les factures et devis sur le serveur, le module a besoin d'un accès FTP.

  • Serveur FTP: L'adresse ftp de votre serveur (souvent le nom de domaine précédé de “ftp.”)
  • Nom d'utilisateur: Le nom d'utilisateur de l'accès FTP
  • Mot de passe: Le mot de passe lié à l'utilisateur pour l'accès FTP
  • Numéro de port: Le port utilisé pour l'accès FTP (par défaut, 21, qui correspond à une connexion non-sécurisée)

La case “Afficher un popup en fin d'opération” permet d'afficher une fenêtre discrète en bas à droite de votre écran pour vous signaler la fin du traitement de transmission des factures et devis.

Les factures et devis seront respectivement uploadés dans des dossiers “Factures” et “Devis”, puis classés par ID de contact Gestan.

Fenêtre "Liste des accès"

Vous pouvez voir via Métier > Espace client Wordpress > Liste des accès la liste des accès en cours.

Vous pouvez également supprimer l'accès d'un client via cette fenêtre.

Le bouton “Ajouter” permet d'accéder à la …

Fenêtre "Nouvel accès"

Qui permet de créer un accès pour un nouveau client ou un client existant.

En cochant la case “envoyer un mail de création de compte”, un aperçu d'email sera visible avec les mots de passe client.

Les factures et devis existants pour ce client seront également automatiquement télé-versés vers Wordpress (cela peut prendre un certain temps suivant votre ordinateur et votre connexion Internet).

Toutes les 30 minutes, une routine exportera automatiquement les factures et devis pour les accès existant. Vous n'avez donc rien à faire. Elle est pas belle la vie ?

Il faut que les pièces (factures et devis) soient notées comme “transmises” pour être transférées vers Wordpress

Fenêtre "Outils"

Via Métier > Espace client Wordpress > Outils, vous avez accès à un écran qui permet de :

  • Supprimer tous les accès client: En cliquant sur ce bouton, vous pouvez supprimer tous les accès des clients. Ils seront détruits et les mots de passe réinitialisés si vous souhaitez recréer un accès ultérieurement.
  • Réinitialiser tous les mots de passe : En cas d'attaques, il peut être intéressant de rapidement réinitialiser tous les accès. Les nouveaux mots de passes seront affichés dans une table.
  • Renvoyer tous les devis : Il peut parfois être intéressant de renvoyer tous les devis sur le serveur (en cas de changement d'en-têtes par exemple)
  • Renvoyer toutes les factures : Il peut parfois être intéressant de renvoyer tous les factures sur le serveur (en cas de changement d'en-têtes par exemple)

Autres personnalisations

Couleurs et aspect du tableau

Vous pouvez changer les couleurs du tableau, en mettant dans votre page un CSS personnalisé.

Par exemple, pour obtenir le tableau ci-dessous, utilisez le CSS suivant :

<style type="text/css">  
  <!-- 
  table.Gestan { 
    margin-bottom: 21px; 
    width: 100%; 
    text-align: center; 
  } 
  th { 
    background: #045D9F; 
    color: #FFF; 
    line-height: 30px; 
    font-weight: bold; 
    font-size: 13px; 
    vertical-align: top; 
    margin-right:7px; 
    margin-left:7px; 
    padding-right:7px; 
    padding-left:7px; 
  } 
  tr { 
    background: #dce2e5; 
    line-height: 30px; 
    border-top: 1px solid darkgrey; 
    border-bottom: 1px solid darkgrey; 
    font-size: 13px; 
  } 
  tr:nth-child(even) { 
    background-color:#E5F2FA; 
  } 
  tr:nth-child(odd) { 
    background-color:#C1E3FA; 
  } 
  tr:hover{ 
    background-color: #F2F2F2; 
  } 
  td { 
    vertical-align: top; 
    font-size: 14px; line-height: 24px; 
    text-align: center; 
    padding-left:7px; } 
    td.Factures_Libelle, td.Devis_Libelle{ 
    text-align: left; 
    padding-left: 5px; 
  } 
    td.Factures_Montant, td.Devis_Montant{ 
    text-align: right; padding-right: 5px; 
  } 
  -->
</style>

Icones de statut

Vous pouvez changer les icones de statut : il s'agit des fichiers Check.png et Paiement.png situés dans /wp-content/plugins/Gestan/img