Skip to main content

CELITECH iFrame Integration Guide

Overview​

This guide provides step-by-step instructions for integrating CELITECH's new iFrame link iframe.celitech.com into your project. The iFrame requires authentication and supports customization through query parameters.

Authentication​

To access the iFrame, you must provide a valid authentication token in the query string. Without a token, the iFrame UI will be blocked.

Fetching a Token​

To obtain a token, call our API endpoint in your backend using your client credentials without any additional parameters:

POST /iframe/token

The endpoint will return a token which shall be used in the iframe link in your frontend.

Please refer to our API Reference for more details.

Token Expiry​

The token is valid for 30 minutes after issuance.

Query Parameters​

The iFrame link supports various optional query parameters for customization:

Authentication (required)​

  • token: The authentication token obtained from /iframe/token.
    Example: token=<your-token>

Customization (optional)​

  • color: A HEX color code (without the # sign) to customize the iFrame appearance.
    • Example: color=000000
  • referenceId: An identifier provided by the partner to link this purchase to their booking or transaction for analytics and debugging purposes.

Trip Details (optional)​

  • destination: The name of the destination country.
    • Example: destination=France
  • iso: The ISO 3-letter country code.
    • Example: iso=FRA
    • Only provide either the destination name or its ISO code.
  • startDate: The trip start date in MM-dd-yyyy format.
    • Example: startDate=06-01-2025
  • endDate: The trip end date in MM-dd-yyyy format.
    • Example: endDate=06-12-2025
    • If startDate and endDate are omitted, the default trip duration when a destination is provided is 9 days.

Example Usage​

A properly formatted iFrame URL might look like this:

https://iframe.celitech.com?token=your_token&color=ff5733&iso=FRA&startDate=06-01-2025&endDate=06-12-2025

Embedding the iFrame​

To embed the CELITECH iFrame into your project, use the following example:

<iframe
  src="https://iframe.celitech.com?token=your_token&color=ff5733&iso=FRA&startDate=01-06-2025&endDate=10-06-2025"
  width="1000"
  height="450"
  style="border:none;"
/>

Implementation Notes​

  • Ensure that the token is retrieved dynamically from /iframe/token before embedding the iFrame.
  • Always URL-encode query parameters where necessary.
  • If using a custom color, provide the HEX code without the # sign.