Configuration Guide

The Aiuta SDK is highly configurable and designed to seamlessly integrate with your platform.

Import

import { AiutaTryOnButton, AiutaTryOnSdkProvider } from "aiuta-try-on-sdk";

Basic Configuration

To integrate the SDK, include the following <AiutaTryOnSdkProvider> tag on your website. Replace the placeholder with your actual api-key:

<AiutaTryOnSdkProvider apiKey=""></AiutaTryOnSdkProvider>

🔑 How to Obtain an api-key

To generate your api-key, sign up at the Aiuta Developer Portal and follow the provided instructions.

Try-On Button Configuration

The Aiuta SDK uses a standardized configuration scheme to render Try-On buttons.

To display the Try-On button, include a <AiutaTryOnButton> element with the required attributes:

• skuId – Use your product's unique identifier as the value.
• skuCatalogName (optional) – If you provide this value, it will be used to generate the product. If omitted, a default catalog name will be used.

<AiutaTryOnButton skuId="" skuCatalogName="">Try On</AiutaTryOnButton>

⚠️ Ensure this <AiutaTryOnButton> is placed on your product page and populated with the correct skuId and, optionally, skuCatalogName.

Button Style Configuration

Customize the appearance of the Try-On button using the style configuration below:

<AiutaTryOnButton
  dynamicStyles={{
    bt_bg_color: "",
    bt_tx_color: "",
    bt_fontFamily: "",
    bt_borderRadius: "",
  }}
>
  Try On
</AiutaTryOnButton>

Summary

1. Add the SDK <AiutaTryOnSdkProvider> tag with your api-key.
2. Insert the Try-On <AiutaTryOnButton> with your skuId and optionally skuCatalogName on the product page.
3. Optionally, configure the button styles and click behavior as needed.

For more information, visit the Aiuta Developer Portal.