Trigger Your Sign-up Flow

In this section, we will walk you through how to trigger the Checkin.com modal and some of the configurable settings on initiation.

Import your Checkin.com Script

The partner key will be shared separately and needs to be imported before you can trigger your sign-up flow.

<script src="https://[partner].regily.com/[key].js" async></script>

Trigger the Checkin.com Module

The Checkin.com framework supports several ways of triggering the registration flow.

πŸ“˜

Contextual Registration

The Checkin.com Framework is built on the concept of contextual registration. In order to not loose the focus of the customer, it is recommended to trigger the flow on the same page where your Call To Action button is without a re-direct in-between

// Trigger the Checkin.com module by using a Javascript event on a button click 

 function triggerRegily() {
    window.regily.signUp.open()
  }
<!-- Trigger with button -->
<button data-regily-trigger="click">Sign up</button>
<!-- Trigger on page load -->
<html data-regily-trigger="load">
  ...
</html>
// Trigger with javascript
// This is an example function to call when a button is clicked for instance
function registationButtonWasClicked() {
    window.location.hash = '#regily'
}

Configure your registration flow

Set Language

The Checkin.com framework supports several languages by default and others can easily be added by request. To ensure a seamless experience we recommend you to set the language to that of your own page. Language is set either as an HTML attribute or by using JavaScript.

See Available Languages for a list of languages currently available and their corresponding language code.

<html data-regily-language="en">
document.documentElement.dataset.regilyLanguage = 'en'

πŸ“˜

Language Priority

If the language setting is not available, the module will use the user's browser language. In the case where the browser language is also not available, the module will be displayed in English.

Set Country

The Checkin.com Framework already has support and localization for all countries world-wide. Therefore it is recommended to use the in-built Geo Location lookup within the Checkin.com Framework rather than setting it manually. If you for initial test purposes might want to run one specific market for a start, you can set a country in a similar way as language.

<html data-regily-country="DE">
document.documentElement.dataset.regilyCountry = 'DE'

Use pre-collected data

If you are already collecting user data (such as the email address) before you trigger the Checkin.com module, you can send this data and display it as pre-filled for the user when you trigger the Checkin.com sign-up flow.

<html data-regily-known-data="{ 
  "credentials": {
    "email":"[email protected]"
   }
}">
// Set data in Regily known data tag
document.documentElement.dataset.regilyKnownData = '{"credentials":"email":"[email protected]"}}'

πŸ“˜

Do you pre-collect more than just the email?

Reach out to [email protected] and we will help you out