How to Integrate AnyAlt Widget on any Webpage

The AnyAlt Widget allows project developers to embed the AnyAlt swap function on their project page to perform transactions between fiat and cryptocurrency (f2c) or between cryptocurrencies (c2c). 

This guide will help you embed the Anyalt Widget into your website using the provided widget URL and iframe code. Follow the steps below to successfully integrate the widget.

Step 1: Understand the Widget URL Parameters

The widget URL has four main parameters:

1. THEME (optional): 

   – Options: “light” or “dark”

   – Default: “light”

   – Example: `theme=dark`

2. API_KEY (required):

   – Your organization’s API key provided by Anyalt.

   – Example: `apiKey=your_api_key_here`

3. Source_URL (required):

   – Your organization’s website URL.

   – Example: `sourceUrl=https://www.yourwebsite.com`

4. Redirect_URL (required):

   – The URL where users will be redirected after completing a transaction.

   – Example: `redirectUrl=https://www.yourwebsite.com/thank-you`

Step 2: Construct the Widget URL

Combine the parameters into the widget URL format:

https://widget.anyalt.finance/?theme=<THEME>&apiKey=<API_KEY>&sourceUrl=<Source_URL>&redirectUrl=<Redirect_URL>

If your API key is `12345`, your source URL is `https://www.example.com`, and your redirect URL is `https://www.example.com/thank-you`, with the default theme (“light”), your widget URL would look like this:

https://widget.anyalt.finance/?theme=light&apiKey=12345&sourceUrl=https://www.example.com&redirectUrl=https://www.example.com/thank-you

Step 3: Embed the Widget in an Iframe

Use the constructed widget URL in the iframe code provided:

<iframe
  src="https://widget.anyalt.finance/?theme=<THEME>&apiKey=<API_KEY>&sourceUrl <Source_URL>&redirectUrl=<Redirect_URL>"
  frameBorder="0px"
  width="468px"
  height="780px"
  allow="accelerometer; autoplay; camera; gyroscope; payment; microphone"
/>

Using the example URL from Step 2:

<iframe

  src="https://widget.anyalt.finance/?theme=light&apiKey=12345&sourceUrl=https://www.example.com&redirectUrl=https://www.example.com/thank-you"

  frameBorder="0px"

  width="468px"

  height="780px"

  allow="accelerometer; autoplay; camera; gyroscope; payment; microphone"

/>

Step 4: Add the Iframe to Your Website

1. Open the HTML file of the webpage where you want to embed the widget.

2. Paste the iframe code into the desired location within the HTML file.

Step 5: Test the Integration

1. Save the changes to your webpage code file.

2. Open your webpage in a web browser to ensure the widget loads correctly.

3. Test the widget to verify that it functions as expected and that the redirection works after a transaction is completed.

That’s it! You’ve successfully integrated the Anyalt Widget into your website using the steps above, providing a seamless experience for your users to complete transactions. If you encounter any issues, contact the AnyAlt support team for assistance.