Permettre aux clients de payer dans votre portail

Si vos clients se connectent à un site Experience Cloud (un portail résidents, propriétaires ou clients), vous pouvez y intégrer l’écran de paiement REDA Pay. Un client connecté paie, configure des paiements récurrents et enregistre des cartes et des comptes bancaires, le tout rattaché à ses propres enregistrements, sans que votre équipe ne touche un numéro de carte. Cet article met cela en place.

Comment fonctionne le parcours dans le portail

Un client du portail ne choisit jamais d’enregistrement : REDA Pay prend le contact (ou le compte) de l’utilisateur connecté comme enregistrement parent, retrouve ou crée son Pay Customer et ouvre le même écran que celui du personnel. Le parcours traverse quatre pages que vous créez dans Experience Builder :

Les quatre mêmes, avec NewPayMethod, NewPayMethodRequest et NewPayMethodResult, permettent aux clients d’enregistrer un moyen sans payer.

La page d’entrée de paiement du portail vue par un client connecté : « Select Pay Profile » avec les boutons radio des profils et Cancel, recadrée sur le composant REDA Pay

La page d’entrée. Avec un seul profil actif, cette étape est sautée.

L’écran de paiement du portail vu par un client connecté : la marque du compte de traitement, les onglets Card et Bank, les comptes bancaires enregistrés du client et le panneau New Payment ; pas de bouton Back

L’écran de paiement dans le portail. Les clients voient leurs propres moyens enregistrés.

Partie 1 — Donner l’accès aux utilisateurs du portail

L’accès au portail comporte quatre éléments. Chacun est configuré pas à pas, pour les deux types de licence de portail, dans Accès au portail : autorisations et partage pour les clients ; en résumé :

1. Accès aux objets, aux classes et aux métadonnées. Attribuez REDA Pay - Community User aux utilisateurs du portail, ou donnez au profil du portail les mêmes paramètres. Il accorde la création et la modification sur les Pay Customers et les Pay Methods, la lecture sur les Pay Orders, Pay Transactions, Pay Profiles, Processing Accounts et Fee Setups, les deux classes Apex derrière les écrans et l’accès en lecture aux types de métadonnées personnalisées REDA Pay Process Config et REDA Pay Setup.
2. Ensemble de partage. Les utilisateurs du portail ne voient que les enregistrements partagés avec eux. Un ensemble de partage sur Pay Order, Pay Customer et Pay Method, chacun reliant User: Contact au champ Contact de l’objet en Lecture/Écriture, donne à chaque client ses propres enregistrements : Configuration → Expériences numériques → Paramètres → Ensembles de partage (Digital Experiences → Settings → Sharing Sets).
3. Pay Profiles et Processing Accounts. Les clients doivent lire ceux qui sont actifs. Pour les licences basées sur les rôles (Customer Community Plus, Partner), créez deux règles de partage selon le critère Is Active égal à True, partagées avec All Customer Portal Users, en Lecture seule. Pour les licences à volume élevé (Customer Community, Customer Community Login), que les règles de partage n’atteignent pas, définissez l’Accès externe par défaut des deux objets sur Accès public en lecture seule. Les Fee Setups suivent automatiquement leur Processing Account.
4. Appartenance au site. Le profil du portail doit être membre du site.

L’écran de configuration de l’ensemble de partage avec Pay Order, Pay Customer et Pay Method, chacun reliant User: Contact à Contact en lecture/écriture

L’ensemble de partage est ce qui fait que « mes paiements » désigne les paiements du client connecté.

Partie 2 — Créer les pages

Dans Experience Builder pour le site :

1. Pages → New Page → Standard Page → Blank (pages → nouvelle page → page standard → vierge), nommée par exemple New Pay Order (notez son nom d’API, affiché dans les propriétés de la page ; vous le saisirez plus bas). Faites-y glisser NewPayOrder (sous Custom Components, les composants personnalisés) et définissez :
   • Is Portal : coché.
   • Portal Record Identifier : User-Contact (ou User-Account si les paiements appartiennent à l’entreprise du client).
   • Portal Payment Page : le nom d’API de la page de l’étape suivante.
   • Portal Success Page, Portal Error Page : les noms d’API des pages de résultat.
   • Portal Return URL : où mène Cancel, l’accueil du site ou votre site web.
   • Restreignez l’écran pour ce public : pour un portail résidents, décochez Allow Pay Method Type - Card si les cartes ne sont pas souhaitées, décochez Enable Order Link (les liens sont un outil du personnel), gardez Enable Scheduling Order pour le paiement automatique. Consultez la Référence des paramètres des composants.
2. Une nouvelle page nommée par exemple New Pay Order Request, avec NewPayOrderRequest. Aucun paramètre.
3. Deux autres pages, Payment Success et Payment Error, chacune avec NewPayOrderResult ; cochez Is Success sur la première uniquement. Ajoutez votre propre texte autour du composant : « Merci », ce qui se passe ensuite, un lien vers l’accueil.
4. Répétez les étapes 1 à 3 avec NewPayMethod (en définissant Portal Method Input Page), NewPayMethodRequest et NewPayMethodResult si les clients doivent pouvoir enregistrer des moyens sans payer.
5. Ajoutez les pages d’entrée au menu de navigation du site (par exemple Make a Payment et Payment Methods).
6. Publiez le site.

Accès aux pages : les pages doivent exiger une connexion (c’est le comportement par défaut d’une page dans un site qui exige une connexion). Seul le site public des liens de paiement utilise l’accès invité ; consultez Configurer le site public des liens de paiement.

Partie 3 — Tester en tant que client

Ouvrez le contact d’un client de test, utilisez Log in to Experience as User (se connecter à l’expérience en tant qu’utilisateur) et parcourez le flux : choisissez un profil et un compte si on vous le demande, vérifiez vos moyens enregistrés, saisissez un montant, appuyez sur Pay, annulez le récapitulatif. Testez ensuite dans une fenêtre de la taille d’un téléphone : les vignettes et le panneau de paiement s’empilent et rien ne défile horizontalement.

L’écran de paiement du portail en largeur de téléphone, avec les vignettes des moyens enregistrés empilées au-dessus du panneau New Payment

La même page sur un téléphone.

Vérifiez en tant que client, pas en tant qu’administrateur : un administrateur voit des enregistrements qu’un client ne voit pas, et une règle de partage manquante n’apparaît que pour un vrai utilisateur du portail.

Exemple pratique

Le portail résidents de Meridian Properties : les résidents paient leur loyer et configurent le paiement automatique par compte bancaire ; ni cartes, ni liens.

Erreurs à éviter

Questions fréquentes

Pour aller plus loin

• Accès au portail : autorisations et partage pour les clients
• Paiement automatique sur le portail : paiements récurrents créés par les clients
• Personnaliser les pages de paiement du portail à votre image