SDKs & Libraries
Add website events and newsletter signup to your hotel website. Connect loyalty and existing visitor tracking through your application's backend.
Choose the right credential
gme_pk_ is the public Website Events key. gm_pub_ is the newsletter publishable key. Configure each source's allowed website origins before using it.
Private gmkr_ API keys stay on your server. They authorize tenant data access and must never appear in browser code, HTML or a public environment variable. A tenant slug does not authenticate a request.
gm-events.jsUse a public browser source from Website Events settings. Add the exact origin of your website or booking engine to its allow-list, including https:// and any port. The source must be enabled.
- Async command queue with no script dependencies or cookies
- Custom events, guest identification and abandoned checkout reporting
- allow() and deny() connect event collection to your consent banner
- Marketing consent includes the text, timestamp and form the guest agreed to
Install and validate a lead form
Replace the public key and connect setGuestMakerEventConsent to your banner's current state and consent changes. Collection consent and email marketing consent are separate. This example uses test: true to validate without creating contacts or starting journeys. Remove it after validation. Live events are stored when a contact exists and an active journey listens.
<form id="guestmaker-lead">
<label>Email <input name="email" type="email" required></label>
<label>
<input name="marketing_consent" type="checkbox">
<span data-consent-text>I agree to receive news and offers by email.</span>
</label>
<button type="submit">Send</button>
</form>
<script async src="https://www.guestmaker.ai/sdk/gm-events.js"></script>
<script>
window.gme = window.gme || function () {
(window.gme.q = window.gme.q || []).push(arguments);
};
gme('init', {
key: 'gme_pk_YOUR_PUBLIC_KEY',
endpoint: 'https://www.guestmaker.ai',
waitForConsent: true,
persistContact: false
});
var eventsAllowed = false;
// Connect this to your banner's initial state and every consent change.
window.setGuestMakerEventConsent = function (allowed) {
eventsAllowed = allowed === true;
gme(eventsAllowed ? 'allow' : 'deny');
};
document.getElementById('guestmaker-lead').addEventListener('submit', function (event) {
event.preventDefault();
if (!eventsAllowed || !this.reportValidity()) return;
var email = this.querySelector('[name="email"]').value;
var optedIn = this.querySelector('[name="marketing_consent"]').checked;
gme('identify', { email: email });
gme('track', 'lead.captured', {
consent: {
email_marketing: optedIn,
text: this.querySelector('[data-consent-text]').textContent,
captured_at: new Date().toISOString(),
form_id: 'guestmaker-lead',
language: 'en'
},
test: true // Remove after validating to store events and start matching journeys.
});
});
</script>For checkout recovery, use abandonOnLeave({ getCart }) and call completed(cart) when a booking finishes. identify(contact, { consent }) can also record a consented lead. Consent evidence never re-subscribes an opted-out guest.
Using another language?
Call the REST API from your server with the scopes your integration needs.