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
- Example:
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
- Example:
iso
: The ISO 3-letter country code.- Example:
iso=FRA
- Only provide either the destination name or its ISO code.
- Example:
startDate
: The trip start date inMM-dd-yyyy
format.- Example:
startDate=06-01-2025
- Example:
endDate
: The trip end date inMM-dd-yyyy
format.- Example:
endDate=06-12-2025
- If
startDate
andendDate
are omitted, the default trip duration when a destination is provided is 9 days.
- Example:
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.