Customization

Customization is a powerful feature you can use to control every aspect of integration with Wink without having to write any code. Every piece of inventory you sell can be customized. Add or remove features, change color scheme and much more.

Customization entry

While on the Customization page, click on the Actions button under the customization you want to work with and click Update. You already have a default entry available to you when you create your account. This entry cannot be removed.

This will take you to the customization form where you can see 5 - 7 tabs (depending on your account type).

General

Here are the options available to you under the General tab.

• Name Give your customization a name to easily remember. e.g. For my travel blog
• Display currency Select the initial currency users will see displayed next to bookable travel inventory. e.g. USD
• Display language Select the initial language users will encounter. e.g. English
• Append to page title You can control what gets added to the page title (the title you see in the browser tab). This is mainly used for our booking engine. e.g. If you navigate to https://ota.wink.travel, by default, you will see Home | Traveliko - Hotels with Benefits. You can change everything after the ’|’ pipe.

Theme

The Theme tab lets you customize the look and feel of our booking engine website, WinkLinks website and all our Web Components.

Use the card on the right as an indicator, to get an idea of what to expect. We use the popular Bootstrap CSS framework, for our naming convention as a guideline. (Ironically… it’s all Tailwind CSS under the hood)

Nothing beats the real thing. Head over to your WinkLinks URL to see what it will actually look like.

Analytics

We support GA4 analytics out of the box. If you want to track your entire enhanced ecommerce conversion path, from start to finish, have your measurement ID ready and enter it in the field under the Analytics tab.

Reminder

Don’t forget to add i.trvl.as, book.wink.travel and ota.wink.travelto your GA4 property streams.

Maps

In order to embed our maps into your site by either using our WordPress plugin or Web Components, you need to provide us with your own Google Maps API key.

Note

Create a Google Maps API key here

Once you’ve generated your key, and configured it for your site, enter it under the Analytics tab.

Itinerary

The Itinerary tab is probably the most interesting in terms of making sure prices show up for inventory you’ve selected. As travel inventory pricing is rather complex, Wink needs to know the user’s itinerary before being able to display an accurate price.

This section lets you set the default itinerary to display prices for all our digital real estate, such as:

• Our social-friendly images with price overlay.
• WinkLinks grids, cards and links.
• Web Components
• Booking engine

Dates

You can choose whether you want to set a static date range or a rolling one.

• Choose a static date range if you will be using the customization for a particular event that occurs on a given date.
• Choose a rolling date range if you want to either:
  1. Default to today + 1 night, which most OTAs do it OR.
  2. Default to a date in the future that should always have availability.

Room configuration

By default, the itinerary is set to 2 adults, as it is the most common setting for most travelers. This can easily be changed and you can add multiple rooms with multiple occupants; both adults and children.

Promotions

Promotions is a nifty feature that saves your users some time. If a propery has given you a promo code you can share with your friends, you can choose to enter it here. Anyone coming in through your link, or similar, will automatically get the promo code added to their itinerary and they will see the discounted price apply automatically.

Integration

The Integration tab is for hotels, integrators and travel agents who wish to have more control over how bookings on Wink are distributed.

Notifications

This gives the hotel and integrator the option to let Wink notify all parties involved when a booking occurs. This includes notifying the channel manager.

By default, these options are all enabled. Use cases where a integrator might want to disable, one or more of, these features are:

• The travel agent is integrated at the API-level and wants to send their own confirmation emails.
• The hotel is testing its integration and does not want to bother their sales staff.
• The hotel doesn’t care about e-mails and only want to get notified via their PMS.

E-mail logo

For integrators who wish to use our e-mail notification service, they can customize the email so it looks like it comes from them.

Note

Recommended dimensions are 300px wide x 75px tall

Hotel-specific

Under the Hotel-specific tab are options that let the hotel control what is displayed on their landing page on our booking engine and what to display when there is no inventory for the requested itinerary.

• Rankings: A property, that has not yet attained any meaningful rankings, might choose to disable that feature.

Note

The property cannot control how an affiliate choose to display the hotel landing page… Those are two different configurations.

• Availability: Lets the property choose whether to continue displaying the inventory even though there is no availability.

Note

In most cases, the property would want to give users a way to click the Book button to continue on to their landing page where they can change their itinerary and try to find an available date. Enable this switch when you want to block the user from continuing.

How to use

In most scenarios, you will choose which Customization to apply to your links, cards, maps and grids.

Here are the times when you might want to manually apply your configuration:

• Manual override You want to share a link to our booking engine directly, and not use our Shareable Links feature, with your custom configuration applied.
• WordPress plugin Add the configuration to your Wink WordPress Plugin Settings.
• Custom integration Manually apply it to your custom integrator with the use of our wink-app-loader Web Component.

Manual override

Here is a simple example of how to apply your configuration ID, with all your settings, to our main booking engine URLs.

https://ota.wink.travel?configurationId=MY-UNIQUE-ID

Note

When a user clicks on this link, you will also set your affiliate attribution cookie.

WordPress plugin

Navigate to the Wink WordPress plugin to learn more.

Custom integration

Control all your embedded Wink Web Components on a page with the wink-app-loader Web Component.

Below is a sample that uses MY-UNIQUE-ID as the configuration ID.

<html>
  <head>
    <link rel="stylesheet" href="https://elements.wink.travel/styles.css"></link>
  </head>
  <body>

    <script src="https://elements.wink.travel/elements.js" type="module" defer></script>

    <wink-app-loader
      client-id="YOUR CLIENT ID GOES HERE"
      configuration-id="MY-UNIQUE-ID"
    ></wink-app-loader>
  </body>
</html>

API

Developers who want to manage customziations can head over to Developers > API > Inventory.