# Adyen Add-On ¶

## Introduction ¶

> The Adyen Add-On is a premium one, you can buy it on our landing page. Thank you!

Easy Forms Adyen Payments Add-On allows you integrate Easy Forms with Adyen Payments. With this add-on you can create payment forms by using the new Dropin.js SDK to create a payment form that securely collects your customer’s card information without you needing to handle sensitive card data.

## Install Adyen Add-On ¶

The Adyen Add-On installing process is very simple, same to any other Add-On. To install the Adyen Add-On follow the documentation to install an Add-On from the Add-On Manager.

## Create a Payment Form ¶

Forms are created through the Form Builder. You just need to drag and drop the fields your form needs and add an HTML Snippet Field with the following content:

    {{ADYEN}}

Then, from the Adyen Add-On UI you can select the fields that will collect the necessary information to pay in Adyen. For example, price, quantity, etc.

## Get your API Keys from your Adyen account ¶

Now that you have your form, let's integrate it with your Adyen account. For this you must get the following information from your Adyen Account:

1. Api Key
2. Origen Key
3. Loading Context
4. Merchant Account
5. Live Url Prefix (Required to pass a production and receive live payments)

Here are the steps your must follow to get the required information.

- Adyen - Get started with Adyen
- Adyen - How to get the api keys

> Note: Take into consideration that you can create a Test Account to test your forms and payments, then you can change your Keys and Environment to pass to production and receive Live payments.

## Set Up Payment Forms with your Adyen account ¶

To create a Adyen configuration, you must perform the following steps

1. Go to the Add-Ons Manager and click on Adyen.
2. Click the Setup a Payment Form button.

3. A form used to configure the payment process will appear:

   - Form: Required. It is the form you'll integrate with your Adyen account.
   - Status: Allows to disable the Adyen configuration.
   - Live: Enable this option when you are ready to pass a "Production".
   - Api Key: Required. Api Credential.
   - Origin Key: Required. Api Credential.
   - Loading Context: Required. Enter your Test or Live loading context.
   - Live Url Prefix: Required only when you want to pass your form to Production.
   - Merchant Account: Required. Your Adyen Merchant Account ID.
   - Opt-In Condition: Enable a conditional logic to only accept payments when a condition is met.
   - Items: Each item represents a product or service that will be detailed on the Adyen website. It's composed of:
     - Description: Describes your product or service.
     - Price: It's the form field used to collect the product price.
     - Quantity: It is the form field to collect the number of products. The number of products is multiplied by the price of each product, to get the sub-total transaction. If you don't select any fields, the amount used is going to be 1.
   - Credit Card Field Settings: Is a group of fields that let you customize how your customers see your Credit Card field and share their information. You can set:
     - Label: Text to identify your credit card.
     - Locale: The language of your Credit Card field. By default, en_US. Available Options
     - Currency: To change the transaction currency.
     - Dom Element: To change the HTML div ID.
     - Hide Label: Enable to hide the CC label.
     - Required: Enable to accept payments only. Submissions without payments, won't be accepted.
     - Store Detail: Enable to store Customer information for use it in a future transaction.
     - Holder Name: Enable to display the Cardholder name.
     - Styles: This field let you customize the Credit Card Field appearance by using CSS properties in JSON format. Click here to get more details.
     - Placeholders: This field let you specify the sample values you want to appear for card detail input fields in JSON format. Click here to get more details.

4. Click Create.