Payment-method icon

Walley Component

Add Walley to an existing Components integration.

This page explains how to add Walley to your existing Web Components integration.

Requirements

Requirement Description
Integration type Make sure that you have built your Components integration.

Walley for Web requires at least v3.23.0 of Components.

Setup steps Before you begin, contact our Support Team to add Walley in your test Customer Area.

API reference

You must include the following fields when making a /sessions request:

Parameter name Required Description
telephoneNumber -white_check_mark- The shopper's telephone number.
You must collect a working mobile phone number (including country code) from the customer. Incorrect or missing numbers will fail Walley's validation.
shopperEmail -white_check_mark- The shopper's email address.
company.name -white_check_mark- The name of the company making the payment. This will be prefilled and presented to the shopper on Walley's payment form. Only required for walley_b2b payments.
company.registrationNumber Only relevant to business-to-business payments. The registration number of the company making the payment.
lineItems.id -white_check_mark- The ID of the line item.
lineItems.description -white_check_mark- A description of the line item. Maximum length: 50 characters.
lineItems.amountExcludingTax -white_check_mark- The item amount excluding the tax, in minor units.
lineItems.taxAmount -white_check_mark- The tax amount, in minor units.
lineItems.taxPercentage -white_check_mark- The tax percentage, in minor units.
lineItems.quantity -white_check_mark- The number of items.

Component configuration

Step 1: Create a DOM element

Create a DOM element on your checkout page, placing it where you want the payment method form to be rendered:

Copy code
 <div id="walley-container"></div>

Step 2: Create an instance of the Component

v6.0.0 or later

Create an instance of the Component, passing:

  • Your instance of AdyenCheckout.
Copy code
const walley = new Redirect(checkout, { type: 'walley' }).mount('#walley-container');

Use the create method of your AdyenCheckout instance, in this case checkout, to create the Component:

Copy code
const walleyComponent = checkout.create('walley').mount('#walley-container');

Test and go live

You can perform the test scenarios described on Walley's technical documentation using Adyen's /payments endpoint. Consider the following:

  • Include the CivRegNo as the socialSecurityNumber.
  • When testing a Walley B2B transaction, provide the company information as shown in the following example:
    Copy code
    "company": {
    "name": "Adyen N.V.",
    "registrationNumber": "5562000116"
    }

Check the status of Walley verification payments in your Customer Area > Transactions > Payments.

See also