Payline personnalisation avancée des pages web Manuel utilisateur

Document
Manuel d’utilisation de la personnalisation
avanc&eacute;e des pages web
Version 1.B
Payline
PROPRIETAIRE
Page 1/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
Version du mod&egrave;le : DocStd_50
Page des &eacute;volutions
Le tableau ci-dessous liste les derni&egrave;res modifications effectu&eacute;es sur ce document.
Date
Version
Modifications
14/08/12
1.A
Livraison version initiale
30/10/12
1.B
MAJ 4.31
Page 2/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
Table des mati&egrave;res
1
INTRODUCTION................................................................................................................................................4
1.1 OBJET DU DOCUMENT.....................................................................................................................................4
1.2 AVERTISSEMENT .............................................................................................................................................4
1.3 CONTACTS .......................................................................................................................................................4
2
PERSONNALISATION DES PAGES WEB ..................................................................................................5
2.1 CREER UNE PERSONNALISATION DE PAGE WEB DE PAIEMENT ....................................................................6
2.1.1
Cr&eacute;er un style de page web de paiement avanc&eacute;e.....................................................................6
2.1.2
Le template html..................................................................................................................................9
2.1.3
Feuille de style ...................................................................................................................................10
2.2 LISTER / MODIFIER LES STYLES DE PAGES .................................................................................................13
3
UTILISATION DE LA PERSONNALISATION ............................................................................................14
Page 3/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
1
Introduction
1.1
Objet du document
Vous avez choisi la solution Payline pour votre e-commerce, vous acc&eacute;dez ainsi au Centre
d’administration Commer&ccedil;ant qui vous permet d’effectuer des op&eacute;rations sur vos transactions, de suivre
des dossiers de paiement, et de g&eacute;rer votre compte e-commerce Payline.
Ce document d&eacute;crit la fonctionnalit&eacute; de personnalisation avanc&eacute;e des pages web par l’hebergement sur
le serveur Payline des fichiers
1.2
Avertissement
Ce document est la propri&eacute;t&eacute; exclusive de Monext. Toute reproduction int&eacute;grale ou partielle, toute
utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit de Monext est
illicite.
Monext&reg;, marque communautaire et internationale propri&eacute;t&eacute; exclusive de Monext Ltd et/ou des soci&eacute;t&eacute;s
du groupe.
Payline&reg;, marque nationale et internationale propri&eacute;t&eacute; exclusive de Monext et/ou des soci&eacute;t&eacute;s du
groupe.
1.3
Contacts
Vous avez besoin d’aide, de conseil ou vous souhaitez simplement nous poser une question, contactez
le Support Payline par email :
[email protected]
Si vous d&eacute;couvrez une erreur dans cette documentation, vous pouvez nous envoyer un email en
d&eacute;crivant l’erreur ou le probl&egrave;me aussi pr&eacute;cis&eacute;ment que possible. Merci de pr&eacute;ciser la r&eacute;f&eacute;rence du
document, sa date (indiqu&eacute;e sur la premi&egrave;re page du document) et le(s) num&eacute;ro(s) de page(s).
Page 4/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
2
Personnalisation des pages web
Le centre d’administration Payline vous offre la possibilit&eacute; de personnaliser les 3 pages de
paiement qui interviennent dans le processus de paiement en ligne de votre e-commerce. On parle
de &quot;pages web de paiement&quot;, il s’agit de :
PAGES WEB DE PAIEMENT
•
•
•
Page 1
Page 2
CHOIX DU
MOYEN DE
PAIEMENT
SAISIE DES
DONNEES
CARTE
Page 3
CONFIRMATION
DE PAIEMENT
la page affichant le choix du moyen de paiement
la page affichant la saisie des donn&eacute;es carte
la page affichant la confirmation du paiement
Le commer&ccedil;ant ou un utilisateur qu’il aura d&eacute;l&eacute;gu&eacute;, peut d&eacute;finir une ou plusieurs pr&eacute;sentations de
pages de paiement pour chaque site e-Commerce.
Personnaliser revient &agrave; cr&eacute;er un style de page propre &agrave; votre site e-commerce puis affecter la
pr&eacute;sentation au point de vente.
Si vous avez plusieurs points de vente, vous pouvez affecter &agrave; chaque point de vente une
pr&eacute;sentation diff&eacute;rente ou bien affecter sur plusieurs points de vente la m&ecirc;me pr&eacute;sentation.
Pour acc&eacute;der &agrave; la personnalisation des pages web allez dans le menu Configuration,
Personnalisation des pages web.
Page 5/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
2.1 Cr&eacute;er une personnalisation de page web de paiement
Pour cr&eacute;er une nouvelle personnalisation, allez au menu Configuration &gt; Personnaliser vos pages
de paiement, vous parvenez &agrave; l’&eacute;cran suivant :
Point de vente
C’est le point de vente pour lequel vous allez personnaliser les pages de paiement
S&eacute;lectionnez le point de vente pour lequel vous d&eacute;sirez personnaliser les pages de paiement et
cliquez sur
.
Vous acc&eacute;dez au formulaire vous permettant de choisir entre une personnalisation standard ou
une personnalisation avanc&eacute;e par template de la page et CSS
2.1.1 Cr&eacute;er un style de page web de paiement avanc&eacute;e
Ce choix de personnalisation permet d’h&eacute;berger un template sur Payline (et non plus chez le
commer&ccedil;ant). Le template dynamique (fichier HTML), une feuille de style CSS et jusqu’&agrave; 10
images peuvent &ecirc;tre t&eacute;l&eacute;charg&eacute;es sur Payline via le centre d’administration.
La personnalisation avanc&eacute;e est une option &agrave; laquelle il faut souscrire. Pour cela vous devez vous
rapprocher du support Payline joignable au 04.42.25.15.43 ou par mail [email protected]
Page 6/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
Nom
Indiquez un nom significatif &agrave; la pr&eacute;sentation que vous souhaitez faire
Identifiant
Il est attribu&eacute; automatiquement par le syst&egrave;me et doit &ecirc;tre renseign&eacute; dans le site e-commerce du
commer&ccedil;ant aupr&egrave;s de Payline sinon un style par d&eacute;faut est affect&eacute;.
Page 7/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
Etat
Ce bouton radio, pr&eacute;-coch&eacute; est &agrave; activer lors de la cr&eacute;ation du template.
Fichier template
Le fichier html template est obligatoire lors de la cr&eacute;ation/&eacute;dition du template.
Taille maximum de 500ko
Type : html
Fichier CSS
Il s’agit du fichier CSS du template.
&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;#Template.css#&quot; /&gt;
Taille maximum : 500 ko
Type : css
Image
Une image pouvant &ecirc;tre utilis&eacute; dans le template et/ou le fichier CSS. Vous pouvez en t&eacute;l&eacute;charger jusqu’&agrave;
10 en r&eacute;p&eacute;tant cette &eacute;tape. Dans le fichier template, les commer&ccedil;ants indiqueront leurs images par la
chaine : #monImage.jpg#
&lt;img src=&quot;#monImage.JPG#&quot; /&gt;&lt;br/&gt;
Taille maximum : 500 ko
Type : png, jpg, gif.
Si vous t&eacute;l&eacute;chargez une ou plusieurs images trop volumineuse ou n'ayant pas le bon format et cliquez
sur le bouton enregistr&eacute;. La page se recharge, formulaire pr&eacute;-rempli, avec le message &quot;Un ou plusieurs
des &eacute;l&eacute;ments t&eacute;l&eacute;charg&eacute;s n'a pas le format ou la taille requise&quot;. Le ou les champs incrimin&eacute;s
apparaissent en rouge.
Page 8/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
2.1.2 Le template html
Le fichier template.html vous indique les noms des cl&eacute;s
&lt;html&gt;
&lt;head&gt;
&lt;title&gt;Paiement commande #PaylineOrderRef#&lt;/title&gt;
&lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;#Template.css#&quot; /&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div id=&quot;pointOfSale&quot;&gt;
&lt;img src=&quot;#monImage.JPG#&quot; /&gt;&lt;br/&gt;
&lt;b&gt;Personnalisation Payline&lt;/b&gt;
&lt;br/&gt;Paiement en ligne&lt;br/&gt;
&lt;/div&gt;
&lt;div id=&quot;aboutPayline&quot;&gt;
&lt;img src=&quot;#secure.png#&quot; width=&quot;300&quot; height=&quot;150&quot; /&gt;
&lt;/div&gt;
&lt;div id=&quot;orderInfos&quot;&gt;
&lt;span class=&quot;title&quot;&gt;Votre commande&lt;/span&gt;
&lt;span class=&quot;label&quot;&gt;R&amp;eacute;f&amp;eacute;rence : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineOrderRef#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;Montant : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineFormattedAmount#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;Date : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineOrderDate#&lt;/span&gt;
&lt;/div&gt;
&lt;div id=&quot;shippingAddress&quot;&gt;
&lt;span class=&quot;title&quot;&gt;Vos coordonn&amp;eacute;es&lt;/span&gt;
&lt;span class=&quot;label&quot;&gt;Nom : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerShippingAddress.name#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;Rue : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerShippingAddress.street1#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;Compl&amp;eacute;ment : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerShippingAddress.street2#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;Ville : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerShippingAddress.cityName#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;Code postal : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerShippingAddress.zipCode#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;Pays : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerShippingAddress.country#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;T&amp;eacute;l&amp;eacute;phone fixe : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerShippingAddress.phone#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;T&amp;eacute;l&amp;eacute;phone mobile : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerMobilePhone#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;IP : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylineBuyerIp#&lt;/span&gt;
&lt;/div&gt;
&lt;div id=&quot;privateData&quot;&gt;
&lt;span class=&quot;title&quot;&gt;Private Data&lt;/span&gt;
&lt;span class=&quot;label&quot;&gt;Data 1 : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylinePrivateData[productFamily]#&lt;/span&gt;&lt;br/&gt;
&lt;span class=&quot;label&quot;&gt;Data 2 : &lt;/span&gt;
&lt;span class=&quot;value&quot;&gt;#PaylinePrivateData.data2#&lt;/span&gt;&lt;br/&gt;
&lt;/div&gt;
&lt;div id=&quot;PaylineForm&quot;&gt;&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
Page 9/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
Le div PaylineForm n'est pas personnalisable, le libell&eacute; et les champs &agrave; renseigner dans le step 2
sont fig&eacute;s et envoy&eacute;s par Payline. Seule la charte (la police, couleur, etc) peut &ecirc;tre configur&eacute;e
El&eacute;ments
Description
#PaylineOrderRef#
R&eacute;f&eacute;rence de votre commande
#PaylineFormattedAmount#
Montant de votre commande
#PaylineOrderDate#
Date de votre commande
#PaylineBuyerShippingAddress.name#
Nom
#PaylineBuyerShippingAddress.street1#
Rue
#PaylineBuyerShippingAddress.street2#
Compl&eacute;ment
#PaylineBuyerShippingAddress.cityName#
Ville
#PaylineBuyerShippingAddress.zipCode#
Code postal
#PaylineBuyerShippingAddress.country#
Pays
#PaylineBuyerShippingAddress.phone#
T&eacute;l&eacute;phone fixe
#PaylineBuyerMobilePhone#
T&eacute;l&eacute;phone mobile
#PaylineBuyerIp#
IP
#PaylinePrivateData[productFamily]#
Private Data 1
#PaylinePrivateData.data2#
Private Data 2
Attention : Nous pr&eacute;conisons de ne pas utiliser de Javascript, ou formulaire imbriqu&eacute; dans ce
fichier. Il ne doit pas contenir de champs BASE, FRAME ou FORM
2.1.3 Feuille de style
Le template.css vous permettra de configurer votre propre charte graphique
Exemple du fichier template.css
body {
background:white url('#1.bmp#') repeat-x bottom;
}
#pointOfSale {
float:left;
font-family:&quot;Verdana&quot;;
font-style:italic;
font-size:14px;
display:inline-block;
Page 10/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
text-align:center;
}
#aboutPayline {
float:right;
}
#orderInfos {
width:500px;
background-color:#dddddd;
margin-left:auto;
margin-right:auto;
margin-bottom:15px;
}
#shippingAddress {
width:500px;
background-color:#dddddd;
margin-left:auto;
margin-right:auto;
margin-bottom:15px;
}
#privateData {
width:500px;
background-color:#dddddd;
margin-left:auto;
margin-right:auto;
margin-bottom:15px;
}
#PaylineForm {
width:500px;
height:200px;
border:5px double red;
margin-left:auto;
margin-right:auto;
}
Page 11/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
.title{
/*border:1px solid;*/
background-color:#bbbbbb;
text-align:center;
display:inline-block;
width:100%;
font-family:&quot;Lucida Console&quot;;
font-size:26px;
color:#006600;
}
.label{
text-align:right;
width:150px;
font-family:&quot;Verdana&quot;;
font-style:italic;
font-size:14px;
display:inline-block;
}
.value{
font-family:&quot;Verdana&quot;;
font-size:14px;
font-weight:bold;
R&eacute;capitulatif pour personnaliser une page Web de paiement
1
T&eacute;l&eacute;charger les fichiers obligatoires. Ils sont marqu&eacute;s d’une &eacute;toile rouge ;
2 Affichez le r&eacute;sultat par le bouton
nouvelle page ;
3 Cliquez sur le bouton
apportez les modifications souhait&eacute;es.
afin de vous donner un aper&ccedil;u de votre
si la pr&eacute;visualisation vous a donn&eacute; satisfaction sinon
3bis Un clic sur le bouton
vous permet d’abandonner les saisies que vous avez
effectu&eacute;es et vous permet de retourner &agrave; l’&eacute;cran &laquo; Personnaliser vos pages de paiement &raquo;.
Page 12/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
2.2 Lister / Modifier les styles de pages
Si vous avez cr&eacute;&eacute; plusieurs styles de pages, il vous est possible de les consulter par point de
vente et ensuite de les modifier. Pour r&eacute;aliser cette &eacute;tape, allez dans le menu Configuration&gt;
personnalisez vos pages de paiement.
S&eacute;lectionner le point de vente pour lequel vous souhaitez consulter les styles de page. Effectuez
les modifications souhait&eacute;s et cliquez sur le bouton
Le r&eacute;sultat est rendu sous forme de tableau indiquant l’identifiant, le nom, le d&eacute;faut et l’&eacute;tat des
pages web comme pr&eacute;sent&eacute; sur l’&eacute;cran suivant.
Identifiant
Il est attribu&eacute; automatiquement par le syst&egrave;me et doit &ecirc;tre renseign&eacute; dans le site e-commerce du
commer&ccedil;ant aupr&egrave;s de Payline sinon un style par d&eacute;faut est affect&eacute;.
Nom
C‘est le nom de la page web de paiement
D&eacute;faut
Indique que la page web est votre page par d&eacute;faut. Tout paiement se fera en utilisant ce style de
personnalisation.
Etat
Informe de l’&eacute;tat de la page web. Ici la page web est active donc fonctionnelle.
R&eacute;capitulatif pour la modification d’une page web de paiement
1 Cliquez sur l’un des identifiants des pages web personnalis&eacute;es pour acc&eacute;der le formulaire de
page web
2 Apportez les modifications souhait&eacute;es
3 Cliquez sur
NB : L’identifiant, le nom, le d&eacute;faut et l’&eacute;tat de la page web sont des champs qui ont &eacute;t&eacute; renseign&eacute;s
lors de la cr&eacute;ation des pages de paiement
Page 13/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
3
Utilisation de la personnalisation
Une fois que vous avez param&eacute;tr&eacute; un template sur le centre d'administration, vous pouvez l'utiliser
sur les pages web de paiement. Pour pouvoir utiliser le template, il faut :
Que celui-ci soit actif (&agrave; param&eacute;trer sur le centre d'administration : cf. XX)
Que le commer&ccedil;ant renseigne le code du template lors de l'appel au web service
doWebPayment, dans la balise customPaymentPageCode :
Il peut &ecirc;tre utilis&eacute; pour les webservices suivants :
doWebPayment
createWebWallet
updateWebWallet
En cas d’erreur dans le code de pages personnalis&eacute;es, renseign&eacute; dans les pages web de
paiement, une erreur est lev&eacute;e.
Le code r&eacute;sultat retourn&eacute; est
02309 : le libell&eacute; indique que le code
&laquo; CustomPaymentPageCode is inactive &raquo;.
02307 : le libell&eacute; indique que le code est invalide &laquo; Invalid transaction &raquo; &laquo; Invalid custom
page code &raquo;
est
inactif
&laquo; Operation
Refused &raquo;
Page 14/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
Payline&reg;, marque nationale et internationale propri&eacute;t&eacute; exclusive de Monext et/ou des soci&eacute;t&eacute;s du groupe.
www.payline.com www.monext.fr
Page 15/15
Ce document est la propri&eacute;t&eacute; exclusive de MONEXT. Toute reproduction int&eacute;grale ou partielle, toute utilisation par des tiers, ou toute communication &agrave; des tiers, sans accord pr&eacute;alable &eacute;crit est illicite.
">
Hello! I am an AI chatbot specifically trained to assist you with the Payline personnalisation avancée des pages web Manuel utilisateur. I have thoroughly reviewed the document and can help you locate the exact information you need or explain the content in clear and simple terms. Whether you’re looking for guidance on specific features, troubleshooting steps, or general usage, feel free to ask your questions. The more details you provide about your concerns or needs, the more accurately and effectively I can assist you!
Assistant typing
Assistant is out of keyboard. Please, try again later.
It looks like you''ve reached a document that is written in multiple languages, including one that isn''t your native language. You can use the following links to temporarily hide pages without the language you prefer.