Getting Started

Overview Getting Started Embed Code Widget Configuration API Reference

Step 1 — Contact us & create your agency

Write to sales@aviaframe.com to get access. We'll create your agency account in the portal and send you:

Step 2 — Fill in your agency details

Before your clients can make bookings, complete your agency profile in the portal:

Note: Bank Name and IBAN are required. Without them, the system cannot show payment instructions to clients after they complete a booking.

Step 3 — Embed the widget on your website

Add two lines of HTML to any page on your website where you want the flight search to appear:

<!-- 1. Place this div where you want the widget -->
<div
  id="aviaframe-widget"
  data-api-url="https://YOUR-BACKEND-URL/webhook/drct/search"
  data-checkout-url="/booking"
></div>

<!-- 2. Load the widget script -->
<script src="https://widget.aviaframe.com/widget/aviaframe-widget.js"></script>

Replace YOUR-BACKEND-URL with the API endpoint we provided. That's it — the widget initialises itself automatically.

See all embed options and parameters →

Step 4 — Verify it's working

  1. Open your website — the flight search form should appear
  2. Search for a flight — results should load from the API
  3. Select a flight — you should see the passenger details form
  4. Complete a test booking — check it appears in the portal dashboard under Orders
  5. Open the order → View Payment Instructions — confirm your bank details appear correctly

Step 5 — Customise your widget (optional)

Add your brand colors and logo to make the widget match your website:

<div
  id="aviaframe-widget"
  data-api-url="https://YOUR-BACKEND-URL/webhook/drct/search"
  data-primary-color="#0057b8"
  data-logo-url="https://youragency.com/logo.png"
  data-title="Search Flights"
></div>

Full widget customisation reference →

Need help?

Write to us at sales@aviaframe.com — we'll help you get set up and answer any questions.