DOCSEARCHbyAlgolia
Submit Docs

Zooza Documentation

website·Indexed 33 days ago

https://docs.zooza.online

Developer documentation for Zooza, featuring a REST API (v1) for programmatic data access and a suite of embeddable widgets including Calendar, Profile, Checkout, and Video widgets. Includes guides on authentication, error handling, WordPress installation, and widget configuration via JavaScript or URL parameters.

Tokens
20.4K
Snippets
99
Records
135
Agent score
56%

What's inside Zooza

  3. Zooza REST API Overview

    The Zooza REST API provides programmatic access to manage programmes, classes, registrations, and payments. All responses are returned in JSON format. The current API version is v1, and all endpoints are prefixed with /v1/.

    When to use the REST API vs Widgets:

    • Use Widgets: For embedding pre-built booking forms, calendars, and profiles via a script tag (no server-side auth required).
    • Use REST API: For building custom UIs, admin/back-office tools, data caching, or synchronizing data with external systems (requires server-side authentication).

    Important: REST API keys are different from Widget API keys and are not interchangeable.

  4. Download default Zooza widget CSS

    If you disable the 'Use CSS' setting to create a custom design, it is recommended to download the default styling as a starting point. The CSS can be retrieved via the following API endpoint using your API URL and API Key.
    API_URL/widgets/v1/css/?widget=YOUR_API_KEY&type=registration

  5. Track enquiry attribution and campaign parameters

    Every enquiry automatically records attribution data, including the page_url, referrer, UTM parameters (utm_source, utm_medium, utm_campaign, utm_term, utm_content), fbclid (Facebook), and gclid (Google Ads).

    By default, these are read from the current page URL. To track visitors who arrive on one page but submit the form on another, enable Remember where the visitor first came from in the configuration. This stores campaign parameters in the browser's localStorage under the key zooza_contact_first_touch for a specified duration (1 to 90 days, default 30). The first campaign captured wins and is not overwritten by subsequent visits.

    Note: Storing parameters in localStorage is considered marketing tracking and requires user consent via a cookie consent manager.

  6. Retrieve the company ID for API scoping

    After obtaining a user token, you must retrieve the company ID to use in the X-ZOOZA-COMPANY header. Call the /v1/user endpoint and locate the desired company ID within the user.companies array of the response body.
    curl -X GET https://api.zooza.app/v1/user \
  -H "X-ZOOZA-API-KEY: your_api_key" \
  -H "X-ZOOZA-TOKEN: your_token"

  7. Install the Zooza Contact widget via embed code

    The Zooza Contact widget is installed using a placeholder div and a loader script. The loader can be placed in the <head> for faster loading or in the <body> immediately after the placeholder.

    Important Constraints:

    • Only one contact placeholder is allowed per page. Multiple placeholders will result in an error message: "Only one contact form can be shown per page."
    • The website domain must be allowed in the Zooza app under Publish > Widget > Contact form for the form to load.

    Regional API URLs:

    • Europe: https://api.zooza.app
    • UK: https://uk.api.zooza.app
    • UAE: https://asia.api.zooza.app

    <!-- Placeholder in <body> --> <div data-zooza-widget='contact' data-zooza-id='YOUR_API_KEY'></div>

    <!-- Loader in <head> or <body> --> <script async src='ZOOZA_API_URL/widgets/v1/loader.js'></script>

  8. Embed the Zooza Checkout widget

    The Zooza Checkout widget can be embedded using a placeholder div and a loader script. You must replace YOUR_API_KEY with the key found in the Zooza application under Publish > Widget and ZOOZA_API_URL with the region-specific API URL:

    • Europe: https://api.zooza.app
    • UK: https://uk.api.zooza.app
    • UAE: https://asia.api.zooza.app

    <!-- Option 1: Both in body --> <div data-zooza-widget='checkout' data-zooza-id='YOUR_API_KEY'></div> <script async src='ZOOZA_API_URL/widgets/v2/loader.js'></script>

    <!-- Option 2: Loader in head, placeholder in body --> <!-- In <head> --> <script async src='ZOOZA_API_URL/widgets/v2/loader.js'></script> <!-- In <body> --> <div data-zooza-widget='checkout' data-zooza-id='YOUR_API_KEY'></div>

  9. Embed Zooza Calendar widget via HTML

    To embed the calendar widget, use a placeholder div and the Zooza loader script.

    Configuration Variables:

    • YOUR_API_KEY: The API key found in the Zooza application under Publish > Widget.
    • ZOOZA_API_URL: The regional API endpoint:
      • Europe: https://api.zooza.app
      • UK: https://uk.api.zooza.app
      • UAE: https://asia.api.zooza.app

  10. Install the Zooza Checkout widget on WordPress or Wix

    The Checkout widget allows customers to purchase digital products, eBooks, coupons, or vouchers.

    For WordPress: Install the Zooza plugin and navigate to Settings > Zooza to select the target page. Alternatively, use the [zooza type="checkout"] shortcode.

    For Wix: In the Wix editor, select the Zooza widget, enter the API key in the Settings panel, and choose Checkout as the widget type.

    [zooza type="checkout"]

  11. Embed the Zooza Profile widget using the legacy script

    The legacy embed method is supported for existing installations but is no longer maintained. It does not support modern data-zooza-* attributes. Place this snippet directly in the <body> where the widget should appear.
    <script data-version='v1' data-widget-id='zooza' id='YOUR_API_KEY' type='text/javascript'>
( function() {
function async_load(){
	document.body.setAttribute('data-zooza-api-url', 'ZOOZA_API_URL');
	var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true;
	s.src = document.body.getAttribute('data-zooza-api-url') +
	 '/widgets/v1/?type=profile&ref=' + encodeURIComponent( window.location.href );
	var embedder = document.getElementById( 'YOUR_API_KEY' );
	embedder.parentNode.insertBefore( s, embedder );
}
if ( document.readyState !== 'loading' ) {
	async_load();
} else if ( document.addEventListener ) {
	document.addEventListener( 'DOMContentLoaded', async_load );
} else {
	document.attachEvent( 'onreadystatechange', function() {
		if ( document.readyState === 'complete' ) { async_load(); }
	} );
}
} )();
</script>

  12. Install the Zooza Map widget

    The Map widget provides a map view of locations. When a location is selected, contact details and available classes are displayed. Clicking a class redirects the customer to the Registration Form.

    Installation Methods:

    • WordPress: Navigate to Settings > Zooza and select the target page from the dropdown, or use the shortcode [zooza type="map"].
    • Wix: In the Wix editor, select the Zooza widget, enter the API key in the Settings panel, and choose Map as the widget.
    • Embed Code: Use a placeholder div and the Zooza loader script. Replace YOUR_API_KEY with the key from Publish > Widget and ZOOZA_API_URL with the regional URL:
      • Europe: https://api.zooza.app
      • UK: https://uk.api.zooza.app
      • UAE: https://asia.api.zooza.app
    <!-- Placeholder in <body> -->
<div data-zooza-widget='map' data-zooza-id='YOUR_API_KEY'></div>

<!-- Loader in <head> or <body> -->
<script async src='https://api.zooza.app/widgets/v2/loader.js'></script>