> ## Documentation Index
> Fetch the complete documentation index at: https://docs.y.uno/llms.txt
> Use this file to discover all available pages before exploring further.
# Apple Pay & Google Pay enhanced experience
> Enable a seamless wallet experience on VTEX checkout and unlock Apple Pay installments.
The Apple Pay & Google Pay enhanced experience is an optional add-on for stores already using the Yuno VTEX plugin. It improves the checkout experience for shoppers by removing an intermediate screen between the VTEX checkout and the device's native wallet sheet, which is known to reduce conversion on wallet payments.
## What it is
By default, when a shopper selects Apple Pay or Google Pay, the Yuno Payment App opens an intermediate screen inside the VTEX checkout before the device's native confirmation sheet (Face ID, fingerprint, or PIN) appears.
The **enhanced experience** removes that intermediate screen: the Apple Pay and Google Pay buttons appear **directly inside the VTEX checkout payment step**, and tapping a button opens the device's native sheet immediately.
This integration also unlocks the optional **Apple Pay installments** feature.
## How it works
When a shopper reaches the checkout, the Yuno SDK quietly prepares a payment session in the background. By the time they reach the payment step, the Apple Pay and Google Pay buttons appear instantly.
* **Fast confirmation**: Tapping a button opens the native wallet sheet immediately.
* **Auto-recalculation**: If the shopper changes their cart (adds an item, applies a coupon, changes shipping), the SDK recalculates the session automatically.
* **Error handling**: If a payment fails, the shopper can try again without reloading the page.
***
## Integration guide
Setting up the enhanced experience involves adding a small JavaScript snippet to your VTEX checkout and finding the values to fill into it.
The snippet is added to your store's `checkout6-custom.js` file from the VTEX dashboard.
1. In the **VTEX dashboard**, search for **Checkout** in the top bar.
2. Select the website your store uses (usually **Default**).
3. Open the **Code** tab and select `checkout6-custom.js` from the file list on the right.
4. Add the snippet below at the end of the file, then click **Save**.
```javascript theme={"theme":{"light":"github-dark","dark":"github-dark"}}
(function () {
window.addEventListener('yuno-sdk-vtex-io-ready', function (event) {
var YunoVTEXIO = event.detail.YunoVTEXIO;
YunoVTEXIO.initialConfiguration({
paymentMethods: ['Google Pay', 'Apple Pay'],
affiliationName: 'YOUR_AFFILIATION_NAME'
});
});
var script = document.createElement('script');
script.src = 'https://sdk-web-vtex-io.y.uno/v1/main.js';
document.head.appendChild(script);
})();
```
Replace `YOUR_AFFILIATION_NAME` with the affiliation name from your Yuno provider configuration. In `paymentMethods`, list the wallets you want to enable — `'Apple Pay'`, `'Google Pay'`, or both.
The `affiliationName` value is the same one you set when configuring Yuno as a payment provider.
1. In the **VTEX dashboard** search bar, type `providers` and select the **Providers** result.
2. Find the Yuno provider configured for this store and open it.
3. In the provider's detail view, copy the value from the **Affiliation Name** field and use it in the snippet.
After saving the snippet, the enhanced experience is live. Apple Pay and Google Pay buttons will
appear directly inside the VTEX checkout payment step
***
## Apple Pay installments
Apple Pay installments is an optional feature within the enhanced experience that lets shoppers split their purchase into installments.
### What shoppers see
Once enabled, an **Installments** selector appears above the Apple Pay button. Tapping it opens a panel listing every installment option.
If the plan includes interest, a **Payment details** panel appears below showing the breakdown (number of installments, financing cost, etc.).
### Eligibility rules
Each installment plan configured in your Yuno dashboard can include optional limits:
* **Amount range**: Minimum and maximum order total.
* **Availability window**: Start and end date for the plan.
If the order doesn't meet these rules, the selector is hidden and Apple Pay renders as a plain button.
### How to enable
To turn on Apple Pay installments, add the `appleInstallmentsMerchantReference` field to the snippet's `initialConfiguration` call:
1. In the **Yuno dashboard**, go to **Installments**.
2. Open the detail panel for the installment plan you want to offer.
3. Copy the **Merchant reference** value.
Update your snippet in `checkout6-custom.js`:
```javascript theme={"theme":{"light":"github-dark","dark":"github-dark"}}
YunoVTEXIO.initialConfiguration({
paymentMethods: ['Google Pay', 'Apple Pay'],
affiliationName: 'YOUR_AFFILIATION_NAME',
appleInstallmentsMerchantReference: 'YOUR_MERCHANT_REFERENCE'
});
```
Save the snippet. The installments selector will appear above the Apple Pay button on the next
checkout.