4. La personnalisation par un squelette
Contents
1. 4 2 URL du squelette dynamique L URL du squelette dynamique doit tre h berg e sur votre site de vente en ligne Aucun squelette ne sera h berg directement sur les serveurs Payline L URL doit tre en absolue doit contenir le chemin complet et ne doit pas contenir de port Seul le port s curis HTTPS 443 est appel par Payline Tous les composants inclus dans le squelette doivent tre en absolus Le m me squelette peut tre appel pour tous les paiements ou il peut tre g n r dynamiquement par le commer ant en fonction des donn es de la commande et des donn es contextuelles Dans ce cas l URL appel e par Payline pourrait tre https url_ squelette dynamique orderRef amp orderAmount amp orderCurrency amp step 2 L URL sera transmise par le commer ant lors de l initialisation d un paiement web fonction doWebPayment dans le param tre CustomPaymentTemplateURL 4 3 Param tres Contextuels Les deux param tres contextuels suivant sont transmis au commer ant lors de la r cup ration des Templates Dynamique Monext Propri tairem Page 7 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre El ment Commentaire O Le token utilis pour le paiement web step L tape en cours2. peut prendre les valeurs suivantes 1 choix moyen de paiement 2 saisie donn es cartes 3 r sultat de paiement wait pour les processus d attente error pour les messages d erreur de traitement 4 4 Zone Payline Le squelette dynamique permet un commer ant de cr er ses propres pages web de paiement La seule exigence est que le squelette contienne la chaine HTML lt div id PaylineForm gt lt div gt indiquant o Payline va inclure dynamiquement les champs du bloc paiement pr c demment d crit Un squelette dynamique minimaliste pourrait tre lt html gt lt body gt lt div id PaylineForm gt lt div gt lt body gt lt html gt Important un squelette ne doit pas contenir de champs BASE FRAME ou FORM 4 5 Feuille de style Le code HTML ajout par Payline est normalis et est conforme aux sp cifications HTML v4 01 http www w3 org TR html4 Vous pouvez ainsi personnaliser l apparence du bloc Payline ajout dans les pages de paiement par l utilisation d une feuille de style Pour personnaliser la partie ajout e par Payline il suffit d ajouter dans le bloc lt head gt lt head gt du corps HTML le code CSS ci dessous lt style type text css gt lt PaylineForm font family Tahoma sans serif font size 76 margin 0 auto width 750px PaylineForm h2 margin 0 padding 0 font size lem line height 1 5em color orange PaylineForm h3 margin
3. 0 Monext Propri taireM Page 8 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre margin bottom 5em font size lem font weight bold color 333 PaylineForm input type radio PaylineForm label PaylineForm label img checkable vertical align middle PaylineForm form margin 0 Panel contenant les champs PaylineForm pane padding 5em margin bottom 5em background color efefef border 1px solid orange PaylineForm div radio margin bottom 5em Bouton de validation PaylineForm submitButton background color orange color white font weight bold bouton d annulation PaylineForm cancelButton background color orange color white Informations portefeuille PaylineForm table walletdata margin bottom 1 5em background white border 1px solid orange PaylineForm table walletdata th PaylineForm table walletdata td vertical align baseline padding 2em 5em PaylineForm table walletdata th text align right text decoration underline background color orange color white Monext Propri taireM Page 9 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle to
4. 3 Personnalisation du pied de page sssssinrussenneenineemmentninannmeenennennetemereneantents 4 La personnalisation par un squelette dynamique de page PA LA LEE 0 lUe LR E E E E 4 2 URL du squelette dynamique ss 4 3 Param tres Contextuels ii OA e AR E E E E EE 45 Feuille de StylE sirni E EE EEEE N E R EERS Monext Propri taire Page 3 16 Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre 1 Introduction 1 1 Objet du document Lorsque vous souhaitez personnaliser les pages web de paiement Payline afin d assurer la continuit de la charte graphique de votre site de vente en ligne vous avez le choix entre deux solutions la d finition d un style de page qui permet entres autres des d finir les couleurs de texte des cadres et du fond d cran des pages de paiement la cr ation d un squelette dynamique qui permet de donner l impression que les informations de paiements sont dans les pages web de votre site Cette option est r serv des commer ants ayant souscrit l offre Ce document d crit les possibilit s et les limites de la personnalisation aussi bien par la d finition d un style de paiement que par la cr ation d un squelette dynamique 1 2 Public vis Ce document est destin aux int grateurs qui so
5. Payline Con u pour vendre Manuel d utilisation de la personnalisation dynamique des pages web Version 1 B Payline Monext Propri taire Page 1 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou buts pe unication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre Page des volutions Le tableau ci dessous liste les derni res modifications effectu es sur ce document Date Version Modifications 13 12 2012 1 A Cr ation du document Monext Propri taireM Page 2 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre Table des mati res 1 a de Le LUS 16 PR ne 1 1 Objet OO CL S tt nnr ASStEEEEEEEEESSEEEEEEEEE NESSE EE EEEE Ennen nErenn T2 PUBIC MIS et ee ee mo dou 10 AN SNISSO RSSS a i aa e aa aaa are Piarais 1 4 Documents de R T r NC nn ed Sie is 1 5 COMAC S ericeira sentake R EEEE NEA EAE NEE EEA ENERE EA NER EEEN EREEREER EEES 2 Les pages de paiements Payline ss ssssssnnnnrrrrreeneennnnnennnneenenessnnnne 3 La personnalisation par un style de page ns 3 1 Personnalisation de l ent te de page 3 2 Personnalisation du corps de page 22 inner anse 3
6. e e g Payer avec la carte existante PaylineForm submitButton lineForm submitButton Bouton de validation e g Valider Page de s lection du moyen de paiement avec l utilisation d un portefeuille virtuel MOYEN DE PAIEMENT Pavel avec l cart ex tante PavlineForm table walletdata ZEUS jawed khelil PavlineForm COIN 111122XXXXXX4444 DELCE C SEL 1208 Payer avec une nouvelle carte PavlineForm table walletdata table walletdata SRE ON AMERIANI ESS Monext Propri taireB Page 12 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre Page de saisi des donn es de paiement Merci de renseigner un num ro de carte valide PavlineForm table form DONNEES DE PAIEMENT Veuillez renseigner vos donn ez de paiement PavlineForm table form ae Se er ner M SE Li n Num ro de care ne l i 1 I Date de fin de vaiatt 06 x 2008 PavlineForm table form Cryptogramme Visuel Plus d informations Sopsesosomssosogoc emo sssncossessscse El ment Description O Titre formulaire e g MOYEN DE PAIEMENT PaylineForm h3 Titre section de formulaire e g Payer avec la carte existante PaylineForm submitButton Bouton de validation e g Valider PaylineForm cancelBut
7. e pied de page d afficher ou non le logo de l acqu reur associ au contrat VAD s lectionn partir de l tape 2 du paiement Monext Propri tairem Page 6 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre 4 La personnalisation par un squelette dynamique de page Ce paragraphe pr sente la personnalisation des pages web de paiement par un squelette dynamique Le guide d int gration Payline pr cise comment le commer ant va communiquer l URL du squelette 4 1 Introduction Un squelette dynamique est une technique avanc e pour personnaliser le contenu des pages web de paiement Pour utiliser un squelette dynamique vous devez cr er votre propre squelette aussi appel markup de page en positionnant une zone dans la page qui sera compl t e par Payline lors de la construction d une page de paiement L URL du squelette dynamique de page devra tre transmise Payline au travers le service web doWebPayment pour chaque transaction IMPORTANT Ce fonctionnement implique que Payline g n re une requ te vers votre site web pour charger le squelette dynamique lors de chaque transaction Cela a pour cons quence d augmenter le temps n cessaire l affichage de la page de paiement l utilisateur final le client du commer ant
8. kground white border top lpx solid orange text align right zone contenant le bouton actionButtons text align center Liens de bas de page actionLinks padding top 5em text align center actionLinks vertical align middle actionLinks a text decoration underline actionLinks a hover text decoration none Messages d erreur PaylineForm ul errors PaylineForm ul errors li margin 0 padding 0 list style none PaylineForm ul errors padding 5em margin bottom 1lem color red background color ffe border 1px solid ccc champs d sactiv s disabled background color fafafa gt lt style gt Lorsque vous utilisez ses instructions code CSS les parties HTML suivantes sont mises en forme Monext Propri taireB Page 11 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre Page de s lection du moyen de paiement MOYEN DE PAIEMENT PavlineForm h2 PavlineForm Veuillez selectionner votre moyen de paiement DR SEC Cramer AMERICANI C ESS ET PavlineForm O El ment Description _ _ _ RS Titre formulaire e g MOYEN DE PAIEMENT PaylineForm h3 Titre section de formulair
9. l Plus d informations M Veuillez mettre jour vos coordonn es Adresse 260 rue claude nicolas ledou Compl ment d adresse Vile Aix en provence Code postal F3356 Pays FRANCE T l phone 1014565989 Email jawed khelil experianr El ment Description PaylineForm h3 Titre section de formulaire e g Veuillez mettre jour vos coordonn es PaylineForm submitButton Bouton de validation e g Valider PaylineForm table form th Formulaire de saisie cellules d en t te e g Type de carte Formulaire de saisie libell s de champs de formulaires e g Num ro de carte tr cardLogo td img formulaire de saisie lien eg Plus d informations tr cardNumber td a Monext Propri taireB Page 16 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite
10. line Le nombre de page affich peut varier en fonction du contexte Par exemple utilisation du moyen de paiement PayPal affiliation au programme 3D Secure et du compte commer ant Par exemple affichage ou non du ticket de paiement Le processus de paiement est g n ralement constitu de 3 pages le choix par l acheteur du moyen de paiement page 1 la collecte des donn es de la carte de paiement page 2 l affichage du r sultat de la demande de paiement ticket de paiement ou refus d autorisation page 3 Dans le cas d une utilisation du moyen de paiement Paypal ou d une affiliation au programme 3D Secure Payline affiche une page d attente page 4 avant d effectuer une redirection vers un site Internet externe Les messages d erreur en cas de probl me technique sont affich s sur une page d di page 5 Enfin les pages de gestion de portefeuilles virtuels Payline permettent la cr ation d un portefeuille page 6 la modification d un portefeuille existant page 7 Monext Propri tairem Page 5 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre 3 La personnalisation par un style de page Ce paragraphe d finit ce qui est personnalisable dans une page web de paiement standard Le manuel utilisateur du cen
11. ton Bouton d annulation e g Retour PaylineForm table form th formulaire de saisie cellules d en t te e g Type de carte PaylineForm table form th label formulaire de saisie libell s de champs de formulaires e g Num ro de carte formulaire de saisie champs de formulaire eg num ro de tr cardNumber td input carte formulaire de saisie lien eg Plus d informations tr cardNumber td a PaylineForm ul errors li Messages d erreur Monext Propri tairem Page 13 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre Page d affichage du r sultat d une demande de paiement Votre paiement est accept V4 paymenimessag CARTE BANCAIRE ticket LE 10 06 08 A 14 16 Es VEOLIA TICKET DE PAIEMENT 11112204445 001 111111111 80610141603386 SAISIE MANUELLE DEBIT N AUTO A554 MONTANT 123 32 EUR PaylineForm TICKET CONSERVER Retourner la aa actionLinks a L Imprimer Enregistrer En PDF El ment 7 Description HPaylneFomm PaylineForm R glage sur toute la zone police taille etc paymentmessage Message de fin de paiement e g Votre paiement est accept ticket Police et taille du ticket actionLinks a Liens de bas de page PaylineForm submitButton Bouton de
12. tre d administration pr cise comment cr er des styles pour les pages de paiement Une page de paiement se compose de trois parties l ent te de page le corps de page le pied de page 3 1 Personnalisation de l ent te de page La personnalisation se limite afficher ou non l ent te de page d finir le contenu texte de cette zone faire afficher une image format max d finir et pouvoir la positionner dans la zone centrer aligner gauche ou droite afficher ou non le choix des langues 3 2 Personnalisation du corps de page Le corps de page affiche des informations dans deux blocs distincts le rappel des informations sur la commande et le b n ficiaire dans le bloc information sur le paiement le choix du moyen de paiement le formulaire de saisi des donn es de paiement et le r sultat du paiement dans le bloc paiement La personnalisation permet de d finir la couleur du texte principal et du texte des boutons d finir la couleur des titres de chaque bloc a d finir la couleur de bordure des blocs d finir la couleur de fond de la page des blocs et des boutons 3 3 Personnalisation du pied de page Le pied de page contient principalement le logo paiement s curis par payline et le logo verisign qui permet l acheteur de contr ler que le site payline est bien certifi par une autorit digne de confiance La personnalisation permet de afficher ou non l
13. uhaitent choisir la solution de personnalisation des pages de paiement Payline la plus adapt e leurs exigences utilisent d j Payline et souhaitent mettre en uvre la fonctionnalit avanc e de personnalisation des pages de paiement 1 3 Avertissement Ce document est la propri t exclusive de Monext Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit de Monext est illicite Monext marque communautaire et internationale propri t exclusive de Monext Ltd et ou des soci t s du groupe Payline marque nationale et internationale propri t exclusive de Monext et ou des soci t s du groupe 1 4 Documents de R f rence Ce document compl te le manuel utilisateur du centre d administration Payline disponible sur simple demande aupr s du service d assistance technique Payline 1 5 Contacts Vous avez besoin d aide de conseil ou vous souhaitez simplement nous poser une question contactez le Support Payline par email support payline com Monext Propri taireM Page 4 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre 2 Les pages de paiements Payline Les pages de paiement regroupent les crans web affich s par les serveurs Pay
14. ute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre formulaire infos carte PaylineForm table form margin bottom 1lem PaylineForm table form th text align right font weight normal padding right 5em width 15em formulaire infos portefeuille PaylineForm table walletForm margin bottom 0em cgvBlock margin top 5em message de feed back de paiement paymentmessage text align center background fefefe line height 3em Affichage du ticket de paiement ticket width 200px margin lem auto border 1px solid ccc padding 5em font family monospace font size 1 2em background ddd ticket ticketTransactionDate ticket ticketNumContrat ticket ticketMode ticket ticketAmount ticket ticketKeep margin top 1lem Ech ancier billList margin top 1em text align center table billList border 1px solid orange margin 0 auto lem font monospace width 40 table billList th background orange Monext Propri tairem Page 10 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre color white text align rig table billList td bac
15. validation e g Retourner la boutique Monext Propri tairem Page 14 16 m Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre Page d affichage du r sultat d une demande de paiement TICKET DE PAIEMENT Votre paiement est accept CARTE BANCAIRE LE 10 06 08 14 57 VEOLIA 111122X0XXX4444 001 111111111 80610145655401 SAISIE MANUELLE DEBIT amp N AUTO A554 MONTANT 5 00 EUR TICKET CONSERVER e table billList Votre Ech ancier de Paiement table billList th Montant Date de paiement table billList 5 00 EUR 10 06 2008 10 00 EUR 06 2008 Slici Imprimer Enregistrer en PDF El ment Description Monext Propri tairem Page 15 16 Ce document est la propri t exclusive de MONEXT Toute reproduction int grale ou partielle toute utilisation par des tiers ou toute communication des tiers sans accord pr alable crit est illicite Payline Con u pour vendre Page de modification d un portefeuille virtuel Peai PaylineForm ul errors li Merci de renseigner un num ro de carte valide DONNEES DE PAIEMENT PaylineForm h3 V Veuillez mettre jour vos donn es de paiement meso CO D COE F Num ro de carte PaylineForm Date de fin de validit 06 2008 Cryptogramme Visue
Download Pdf Manuals
Related Search