Wix

Simple sites (without Members Area)

Wix support adding Atlas snippet as a global custom code, similar to marketing or analytics tools.

Sites with Members Area

This setup requires additional steps in order to supply a user details to Atlas.

Snippet code

<script>
  (() => {
    const ATLAS_APP_ID = "YOUR_APP_ID";
    let identityParams;

    window.addEventListener(
      "message",
      (event) => {
        const message = event.data;

        if (message?.channel !== "Atlas") return;
        if (!message.identityParams) return;
        // console.log("Received message from bridge", message);

        if (window?.Atlas) {
          window.Atlas.call("identify", message.identityParams);
        } else {
          identityParams = message.identityParams;
        }
      },
      false
    );

    // Atlas Snippet from install page
    (()=>{"use strict";var t,e={appId:ATLAS_APP_ID,v:2,q:[],call:function(){this.q.push(arguments)}};window.Atlas=e;var n=document.createElement("script");n.async=!0,n.src="https://app.atlas.so/client-js/atlas.bundle.js";var s=document.getElementsByTagName("script")[0];null===(t=s.parentNode)||void 0===t||t.insertBefore(n,s)})();

    window.Atlas.call("start");

    if (identityParams) {
      window.Atlas.call("identify", identityParams);
      identityParams = undefined;
    }
  })();
</script>

Fetching user information

This step is sending a user details object from Wix Javascript environment to a browser environment where Atlas widget operates.

Add the code below to masterPage.js. This file executes on Wix servers before every page of your site.  Details on this file on Wix docs .

The code is specifically built with separate functions. In case you already have any code running in $w.onReady, just append startAtlasBridge() to the end of it.

import { authentication, currentMember } from "wix-members-frontend";
import wixWindowFrontend from "wix-window-frontend";

$w.onReady(function () {
  // some code may already be here

  startAtlasBridge();
});

function startAtlasBridge() {
  if (authentication.loggedIn()) {
    notifyLogIn(currentMember, "PAGE_LOAD");
  }

  authentication.onLogin((updatedCurrentMember) => {
    notifyLogIn(updatedCurrentMember, "LOGGED_IN");
  });
}

function notifyLogIn(currentMember, event) {
  currentMember
    .getMember()
    .then((member) => {
      wixWindowFrontend.postMessage({
        channel: "Atlas",
        event,
        identityParams: buildIdentityParams(member),
      });
    })
    .catch((error) => {
      console.error(error);
    });
}

function buildIdentityParams(member) {
  const userId = member._id;
  let name = [member.contactDetails?.firstName, member.contactDetails?.lastName]
    .filter(Boolean)
    .join(" ")
    .trim();
  if (name === "") {
    name = member.profile.nickname;
  }

  // do not pass empty keys
  const params = { userId, name };

  const email = member?.loginEmail || member.contactDetails?.emails[0];
  if (email) {
    params.email = email;
  }

  if (member.contactDetail?.phones?.length) {
    params.phoneNumber = member.contactDetails.phones[0];
  }

  return params;
}