Checkout Builder

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.

The Checkout Builder is a no-code tool designed to customize your checkout experience. It includes two main modules:

• Payment method settings: Enable payment methods with a published route to show to your customers. Additionally, you can define under which circumstances specific payment methods are displayed.
• Checkout styling: Adjust the checkout’s visual elements for desktop and mobile devices, including colors and typography. This ensures the checkout experience is consistent with your brand.

Any changes made using the Checkout Builder are immediately reflected in the user-facing checkout, providing a straightforward way to manage and adapt the checkout experience to meet your business requirements.

​

Advantages of using Checkout Builder

• Customization with no code: Enjoy the flexibility of tailoring your checkout experience without the need for complex coding. This empowers you to create a checkout process that aligns seamlessly with your brand and business objectives.
• Payment method flexibility: Easily enable, organize, and display the payment methods that best suit your customer base and market.
• Intuitive user interface: Yuno’s interface makes it a breeze to configure payment methods, set display conditions, and customize styling.

​

Payment method settings

This module lets you configure and customize the payment methods used in the checkout experience. Beyond activating payment methods, you can adjust the order in which they’re displayed, customize their appearance, set required fields, and determine conditions for when each payment method is displayed. This breadth of customization ensures the checkout experience fits your audience and specific use case. You must click Publish settings on the Checkout Builder to apply all changes to the checkout.

​

Conditions

You can control when a payment method appears at checkout by setting display conditions based on criteria such as the order’s country, amount, currency, or integration metadata. To configure these settings:

​

Required fields

Required fields specify the information users must provide when using each payment method. Some payment methods require specific data to process payments, and Yuno may request it even if you didn’t specify it. Yuno streamlines the process of adding or removing desired fields through its user interface. The Required Fields panel in the Checkout Builder lets you collect billing and shipping addresses as two independent forms during checkout. Billing address is used for card verification (AVS) and integrations with providers such as Stripe and Adyen, while shipping address is used for physical delivery.

​

Where to find it

1. Open the Checkout Builder in the Yuno Dashboard.
2. In Payment method settings, click the three dots (⋯) on the payment method you want to configure and select Set Required fields.
3. Find the Address configuration section in the Required Fields drawer.

​

How to configure

1. In the Address configuration section, turn the toggle on.
2. Choose the address mode:
   • Billing Address only
   • Billing & Shipping Address
3. Click Save changes.
4. Return to the Checkout Builder and click Publish settings for the changes to take effect in the live checkout.

No additional SDK parameters are required in the merchant’s integration — as long as Web SDK v1.7 or later is integrated, the address forms render automatically based on the Checkout Builder configuration.

​

Available configuration

​

Important notes

• Backward compatibility: Existing checkouts that only had billing_address enabled continue to work exactly as before — the previous address fields are mapped to the billing address. No action is required for merchants who don’t want shipping collection.
• Standalone Postal Code: The postal code field can be used standalone (without other address fields) for all providers and all SDK flows. When postal code is enabled and other address fields are disabled, the backend allows null values for all address fields except postal code. If both postal code and address fields are enabled in the Checkout Builder, the backend prioritizes address fields over postal code.
• Configure during low-traffic periods: Publishing changes to required fields affects all subsequent checkout sessions immediately. Customers in the middle of an in-flight session may see inconsistent forms during the propagation window. We recommend configuring and publishing this setting during low-traffic periods to minimize impact.

In the Required fields, you can also configure the behavior for enrolled cards. You can configure whether to request the CVV for every transaction or only during the customer’s first payment.

​

Edit name and logo

The name and logo settings control how a payment methods appear during checkout. This option is unavailable for enrolled payment methods. To adjust these settings:

1. Within Payment method settings, click the three dots icon next to any non-enrolled payment method and select Edit name and logo.
2. Select Use custom settings to make changes.
3. Enter your preferred name for the payment method.
4. Optionally, you can add a description and provide a new logo URL. The URL must start with “https://”. Use a square image (JPG or PNG), 100x100 pixels in size, and up tp 10 KB.
5. Click Save changes, followed by Publish settings to apply all changes.

​

Checkout styling

Match your brand’s unique look and feel using the Checkout Styling module. Changes made in this module are reflected in the end-user checkout immediately after publishing.

​

General Styling Options

The General Styling section allows you to adjust key visual elements, creating a consistent and professional look throughout the checkout experience. In this section, you can customize the following elements: