Getting started
Client side
Server side
Getting started
Getting set up with Fly Now Pay Later

Here’s everything you need to know about setting flexible ways for your customers to pay for their next adventure.

Before you begin…

If you haven’t already got one, you’ll need a Fly Now Pay Later merchant account. Get in touch with our sales team and they’ll set you up.

Once you’ve got your details, you’ll be able to log into our Merchant Portal.

Contact the sales team

Processing an application

To the customer, you can present Fly Now Pay Later as a flexible payment option and an alternative way to split the cost of their booking. However, this is still technically a loan and is subject to credit checks.

We run these credit checks automatically through a form that is dynamically injected into your site once the user clicks “Checkout with Fly Now Pay Later”.

If the application is successful, you’ll need to request a Virtual Debit Card using a Server Side call to our virtual card API endpoint.

We’ll show you how to set up that button and request a Virtual Debit Card further down this page.

What can customers use Fly Now Pay Later for?

Your customers can use Fly Now Pay Later to book anything related to their holiday or trip, as long as they can get an e-ticket.

That usually means they can book packages, flights and hotels, but not things like rail journeys.

Setting up your integration

Getting set up is super simple.

  • Step 1:     Login into the Merchant Portal using the details you got from our sales team.
  • Step 2:     Once you’re in, click the “add new” button to set up a new integration.
  • Step 3:     Tell us the domain that you’ll be setting Fly Now Pay Later up on.
  • Step 4:     Hit the “Done” button.
  • Step 5:     You’ll see the integration screen and the integration key that you’ll need to integrate the library of Fly Now Pay Later features into your site.
Setting up the stuff your customers see

This is where the magic happens.

Before you start, make sure you have the correct integration key for your implementation. (See Setting up your integration for more information.)

Include our Library

You must include Fly Now Pay Later service through a script tag targeting our API endpoint. Here are the supported URL parameters you can provide within the URL:

https://widget.us.flynowpaylater.com/cdn/integration.min.js

When integrating testing environment, the application will integrate in developer mode.

Within this screen you can confirm all of the variables sent to us, as well as use triggers that our application can execute.

  • callback=myCallback

    The name of your callback function.

  • key=**********

    The integration key representing your integration from the portal.

  • currency=usd (optional)

    The currency in which integration will be loaded in.

  • locale=en (optional)

    The integration interface language.

  • jurisdiction=us (optional)

    The country code of the jurisdiction where this application is taking place.

  • mode=demo (optional)

    Only available in testing mode – Loads the Fly Now Pay Later demo application process.

  • reference=ABC1234 (optional)

    This is your system reference.

<script type="text/javascript" src="https://widget.us.flynowpaylater.com/cdn/integration.min.js?callback=fnplCallback&key=ABC"></script>

Your Callback

You must create a callback function that will be executed at the point of Fly Now Pay Later service being loaded. Once loaded, the service will call the governed callback and provide you with the Fly Now Pay Later model. Which then can be used to setup your itinerary and customer information.

<script type="text/javascript">
    	window.fnplCallback = FNPL => {
        		// ... FNPL variable represents the FNPL model. 
    	};
</script>

Fly Now Pay Later Model

The model will be provided to you at the initiation of the Fly Now Pay Later service. Once provided you may start using it. Please note to keep the model in private scope and not set it to a public scope to avoid advanced users from accessing it through the browser console.

  • Itinerary methods
  • itinerary.type.setFlightType(): void DEPRECATED

    Sets the itinerary type to “Flight Booking”.

  • itinerary.clearFlights(): void

    Clears all flights from the itinerary.

  • itinerary.addFlight(FlightObject): void

    Registers a flight against the itinerary.

  • itinerary.clearHotels(): void

    Clears all hotels from the itinerary.

  • itinerary.addHotel(HotelObject): void

    Registers a hotel against the itinerary.

  • itinerary.clearRentals(): void

    Clears all rental items from the itinerary.

  • itinerary.addRental(RentalItem): void

    Registers a rental item against the itinerary.

  • itinerary.person.name.set(string): void

    The full name of the primary passenger on your booking.

  • itinerary.person.name.get(): string | NULL

    Returns the primary passengers full name.

  • itinerary.person.name.clear(): void

    Clears the primary passengers full name.

  • itinerary.person.dob.set(int day, int month, int year): void

    Sets the primary passengers date of birth.

  • itinerary.person.dob.get(): Date | NULL

    Returns the primary passengers date of birth.

  • itinerary.person.dob.clear(): void

    Clears the primary passengers date of birth.

  • Checkout methods
  • checkout.amount.set(float): void

    Sets the full checkout amount you wish to receive.

  • checkout.amount.get(): float | NULL

    Returns the full checkout amount you wish to receive.

  • checkout.currency.get(): string

    Returns the currency code for this checkout.

  • checkout.locale.get(): string

    Returns the locale code for this checkout.

  • checkout.jurisdiction.get(): string

    Returns the jurisdiction country code for this checkout.

  • Applicant methods
  • applicant.fullName.set(string): void

    Sets the applicants full name.

  • applicant.fullName.get(): string | NULL

    Returns the applicants full name.

  • applicant.fullName.clear(): void

    Clears the applicants full name.

  • applicant.dateOfBirth.set(int day, int month, int year): void

    Sets the applicants date of birth.

  • applicant.dateOfBirth.get(): Date | NULL

    Returns the applicants date of birth.

  • applicant.dateOfBirth.clear(): void

    Clears the applicants date of birth.

  • applicant.residentialType.set(integer): void

    Sets the applicants residential type using ResidentialType.

  • applicant.residentialType.get(): integer | NULL

    Returns the applicants residential type.

  • applicant.residentialType.clear(): void

    Clears the applicants residential type.

  • applicant.employmentType.set(integer): void

    Sets the applicants residential type using EmploymentType.

  • applicant.employmentType.get(): integer | NULL

    Returns the applicants residential type.

  • applicant.employmentType.clear(): void

    Clears the applicants residential type.

  • applicant.phone.country.set(string country code): void

    Sets the applicants mobile phone country code.

  • applicant.phone.country.get(): string | NULL

    Returns the applicants mobile phone country code.

  • applicant.phone.country.clear(): void

    Clears the applicants mobile phone country code.

  • applicant.phone.number.set(string): void

    Sets the applicants mobile phone number without country code.

  • applicant.phone.number.get(): string | NULL

    Returns the applicants mobile phone number without country code.

  • applicant.phone.number.clear(): void

    Clears the applicants mobile phone number.

  • applicant.email.set(string): void

    Sets the applicants e-mail address.

  • applicant.email.get(): string | NULL

    Returns the applicants e-mail address.

  • applicant.email.clear(): void

    Clears the applicants e-mail address.

  • applicant.salary.currency.set(string currency code): void

    Sets the applicants salary currency.

  • applicant.salary.currency.get(): string | NULL

    Returns the applicants salary currency.

  • applicant.salary.currency.clear(): void

    Clears the applicants salary currency.

  • applicant.salary.annualAmount.set(integer): void

    Sets the applicants salary annual amount.

  • applicant.salary.annualAmount.get(): integer | NULL

    Sets the applicants salary annual amount.

  • applicant.salary.annualAmount.clear(): void

    Sets the applicants salary annual amount.

  • applicant.gender.set(integer GenderType): void

    Sets the applicant gender using GenderType.

  • applicant.gender.get(): integer | NULL

    Return the applicants gender.

  • applicant.gender.clear(): void

    Clears the applicants gender.

  • applicant.address.floor.set(string): void

    Sets the applicants primary address’s floor.

  • Sets the applicants primary address's floor.

    Sets the applicants primary address’s floor.

  • applicant.address.floor.clear(): void

    Clears the applicants primary address’s floor.

  • applicant.address.apartment.set(string): void

    Sets the applicants primary address’s apartment.

  • applicant.address.apartment.get(): string | NULL

    Sets the applicants primary address’s apartment.

  • applicant.address.apartment.clear(): void

    Clears the applicants primary address’s apartment.

  • applicant.address.house.set(string): void

    Sets the applicants primary address’s house.

  • applicant.address.house.get(): string | NULL

    Sets the applicants primary address’s house.

  • applicant.address.house.clear(): void

    Clears the applicants primary address’s house.

  • applicant.address.street.set(string): void

    Sets the applicants primary address’s street.

  • applicant.address.street.get(): string | NULL

    Sets the applicants primary address’s street.

  • applicant.address.street.clear(): void

    Clears the applicants primary address’s street.

  • applicant.address.city.set(string): void

    Sets the applicants primary address’s city.

  • applicant.address.city.get(): string | NULL

    Sets the applicants primary address’s city.

  • applicant.address.city.clear(): void

    Clears the applicants primary address’s city.

  • applicant.address.county.set(string): void

    Sets the applicants primary address’s county.

  • applicant.address.county.get(): string | NULL

    Sets the applicants primary address’s county.

  • applicant.address.county.clear(): void

    Clears the applicants primary address’s county.

  • applicant.address.postcode.set(string): void

    Sets the applicants primary address’s postcode.

  • applicant.address.postcode.get(): string | NULL

    Sets the applicants primary address’s postcode.

  • applicant.address.postcode.clear(): void

    Clears the applicants primary address’s postcode.

  • applicant.address.country.set(string country code): void

    Sets the applicants primary address’s country.

  • applicant.address.country.get(): string | NULL

    Sets the applicants primary address’s country.

  • applicant.address.country.clear(): void

    Clears the applicants primary address’s country.

  • Generic methods
  • build(your-element-id): void

    Once called, we will create an iframe element within the specified dom element. This is the location where all of our application visual processes will take place.

  • setCallback.complete(function): void

    In the event of successful customer application, customer wll authorise their funds and Fly Now Pay Later library will execute the success callback. Here you must assign your success callback function that will be executed at the point of successful customer fund authorisation. When executed, function must contain one argument token. The token provided can then be used to process the authorisation at the Fly Now Pay Later Backend API. If your integration has payment proxy assigned to it, at the point of token submission to Fly Now Pay Later, we will send the funds to your payment processor, in any other case, we will return the full card information that you may then process using your own payment processing tools.

  • save(): void

    Commits the information provided by you and submits to our system. If at any point you need to make amendments, change the relevant itinerary field and execute the .save() method to confirm the changes.

FlightObject

This is an object that contains information for a one way flight information.

  • flightNumber string

    Contains the flight number, for example SVO8122.

  • passengers array

    Contains an array of one or many PersonObject objects.

  • from.date.day integer

    Contains departure date’s day figure

  • from.date.month integer

    Contains departure date’s month figure

  • from.date.year integer

    Contains departure date’s year figure

  • from.airport string

    Contains departure airport IATA code, for example LGW.

  • from.country string

    Contains departure country code, for example US.

  • to.date.day integer

    Contains arrival date’s day figure

  • to.date.month integer

    Contains arrival date’s month figure

  • to.date.year integer

    Contains arrival date’s year figure

  • to.airport string

    Contains arrival airport IATA code, for example LGW.

  • to.country string

    Contains arrival country code, for example US.

HotelObject

This is an object that contains information for a single hotel booking.

  • checking.in.day integer

    Contains check-in day figure

  • checking.in.month integer

    Contains check-in month figure

  • checking.in.year integer

    Contains check-in year figure

  • checking.out.day integer

    Contains check-out day figure

  • checking.out.month integer

    Contains check-out month figure

  • checking.out.year integer

    Contains check-out year figure

  • persons array

    Contains an array of one or many PersonObject objects.

  • name string

    Name of the hotel.

  • rooms integer

    Room count booked.

  • country string

    Contains country code where hotel is located, for example US.

RentalObject

This is an object that contains information for a single rental item.

  • period.start.day integer

    Contains period start day figure

  • period.start.month integer

    Contains period start month figure

  • period.start.year integer

    Contains period start year figure

  • period.end.day integer

    Contains period end day figure

  • period.end.month integer

    Contains period end month figure

  • period.end.year integer

    Contains period end year figure

  • persons array

    Contains an array of one or many PersonObject objects.

  • name string

    Name of the hotel.

  • country string

    Contains country code where hotel is located, for example US.

PersonObject

This is an object that contains base level information about a person.

  • name string

    Contains the full name of the passenger.

  • dob.day integer

    Contains the date of birth day figure for the passenger.

  • dob.month integer

    Contains the date of birth month figure for the passenger.

  • dob.year integer

    Contains the date of birth year figure for the passenger.

GenderType

List of supported types.

  • 101     Female
  • 102     Male

EmploymentType

List of supported types.

  • 100     Other
  • 101     Full Time Employment
  • 102     Part Time Employment
  • 103     Self Employed
  • 104     Not Employed
  • 105     Student
  • 106     Homemaker
  • 107     Retired

ResidentialType

List of supported types.

  • 100     Other tenant
  • 101     Owner
  • 102     Tenant Unfurnished
  • 103     Council Tenant
  • 104     House Share
  • 105     Living With Parents
  • 106     Tenant Furnished

Integration example

Here’s an example of the full client side integration. You must provide as much as information you can to ensure the customer goes through our process as fast as possible to complete your checkout.

<div id="your-element-id"></div>
<script type="text/javascript"> 
	window.fnplCallback = FNPL => {
		FNPL.build('your-element-id'); // Set the information about the applicant (Might be same as the primary passenger)
		FNPL.applicant.fullName.set('John Stuart-Tomas Doe');
		FNPL.applicant.dateOfBirth.set(16, 3, 1990);
		FNPL.applicant.residentialType.set(101);
		FNPL.applicant.employmentType.set(101);
		FNPL.applicant.phone.country.set('US');
		FNPL.applicant.phone.number.set('7777000066');
		FNPL.applicant.email.set('customer@email-addre.ss');
		FNPL.applicant.salary.currency.set('USD');
		FNPL.applicant.salary.annualAmount.set(30000);
		FNPL.applicant.address.floor.set('4');
		FNPL.applicant.address.apartment.set('12b');
		FNPL.applicant.address.street.set('Market street');
		FNPL.applicant.address.city.set('Hyde');
		FNPL.applicant.address.county.set('Greater Manchester');
		FNPL.applicant.address.postcode.set('SK14 1HG');
		FNPL.applicant.address.country.set('US');
		
		// Set the information about the primary passenger on your booking
		FNPL.itinerary.person.name.set('John Stuart-Tomas Doe');
		FNPL.itinerary.person.dob.set(16, 3, 1990);
		
		// Set the information about your flight itinerary //
		FNPL.itinerary.type.setFlightType();
		
		// DEPRECATED // You may register all of the connected, returning, or individual flights on the ticket, there is no limit. // Set the first flight on the ticket, with all of its passengers on this flight.
		FNPL.itinerary.addFlight({ flightNumber: 'FL123', passengers: [ { name: 'John Stuart-Tomas Doe', dob: {day:16, month: 3, year: 1990} }, { name: 'Anna Doe', dob: {day:2, month: 5, year: 1985} } ], from: { date: {day:10, month:1, year: 2021}, country: 'us', airport: 'lgw', }, to: { date: {day:10, month:1, year: 2021}, country: 'us', airport: 'lut', } });
		
		// Set the followup or return flights on the ticket
		FNPL.itinerary.addFlight({ flightNumber: 'FL345', passengers: [ { name: 'John Stuart-Tomas Doe', dob: {day:16, month: 3, year: 1990} } ], from: { date: {day:10, month:1, year: 2021}, country: 'us', airport: 'lgw', }, to: { date: {day:11, month:1, year: 2021}, country: 'lv', airport: 'rix', } });
		FNPL.itinerary.addHotel({ name: 'Tree House', rooms: 2, country: 'US', checking: { in: {day:11, month:1, year: 2021}, out: {day:16, month:1, year: 2021} }, persons: [ { name: 'John Stuart-Tomas Doe', dob: {day:16, month: 3, year: 1990} }, { name: 'Anna Doe', dob: {day:2, month: 5, year: 1985} } ] });
		FNPL.itinerary.addRental({ name: 'BMW e70, year 2007, x-drive 3.0d', country: 'US', period: { start: {day:11, month:1, year: 2021}, end: {day:16, month:1, year: 2021} }, persons: [ { name: 'John Stuart-Tomas Doe', dob: {day:16, month: 3, year: 1990} }, { name: 'Anna Doe', dob: {day:2, month: 5, year: 1985} } ] });

		// Set the checkout information
		FNPL.checkout.amount.set(799.98); 

		// Set the callback function we will call once a successful authorisation has commenced.
		FNPL.setCallback.complete(dispersalToken => { Alert('Your dispersal token is: ' + dispersalToken); });

		// Trigger the save function, to send the changes to our service.
		FNPL.save(); 
	};
</script>

Server side

As we described in the Client Side documentation, if the process of an application or login is successful, i.e. a Fly Now Pay Later customer has authorised a payment to you then you have received a dispersal token. You will then need to process a server side request to the Fly Now Pay Later Backend API to receive a payment card details.

If your integration is setup to use payment proxy, we will execute the payment towards your payment proxy and return the information received by them.

Authorising funds

If your integration is setup to use payment proxy, we will execute the payment towards your payment proxy and return the information received by them.
You must send the dispersal token received by the client side to our Backend APIs disperse endpoint.

Please refer to your integration record in Fly Now Pay Later Merchant Portal to see your api key authorization token.

Marketing Assets

Overview

Give shoppers the option to pay over time with Fly Now Pay Later. Including Fly Now Pay Later logos, banners, and buttons early and throughout the shopping experience helps motivate shoppers to complete their purchases.

Compliance requirements

Please do not modify any assets without consent from Fly Now Pay Later.
Do not mask or alter Fly Now Pay Later’s brand by ‘white-labeling’ or by changing Fly Now Pay Later materials with different content, color, or design.

Logos

Download ZIP File
Name Example Download
F logo blue PNG / JPEG / SVG / EPS / PDF
F logo white PNG / JPEG / SVG / EPS / PDF
FNPL logo black PNG / JPEG / SVG / EPS / PDF
FNPL logo white PNG / JPEG / SVG / EPS / PDF
FNPL logo blue PNG / JPEG / SVG / EPS / PDF
FNPL logo plain PNG / JPEG / SVG / EPS / PDF

Banners

Download ZIP File
Name Example Download
160x600
Low Res:
PNG
High Res:
PNG
240x400
Low Res:
PNG
High Res:
PNG
300x250
Low Res:
PNG
High Res:
PNG
300x600
Low Res:
PNG
High Res:
PNG
336x280
Low Res:
PNG
High Res:
PNG
468x60
Low Res:
PNG
High Res:
PNG
550x480
Low Res:
PNG
High Res:
PNG
728x90
Low Res:
PNG
High Res:
PNG
728x210
Low Res:
PNG
High Res:
PNG
728x300
Low Res:
PNG
High Res:
PNG

Social Media

Download ZIP File
Name Example Download
Facebook
Low Res:
PNG
High Res:
PNG
Instagram
Low Res:
PNG
High Res:
PNG
Linkedin
Low Res:
PNG
High Res:
PNG
Twitter
Low Res:
PNG
High Res:
PNG

For Print

Download ZIP File
Name Example Download
Flyer Page 1 / Page 2
Poster
Size:
A2 / A3 / A4