Single page applications

Use this installation guide if your website is a single page application or otherwise renders HTML with Javascript.
Step 1 is to copy and paste the following snippet into all pages you want Notifly to appear on. This would usually be your template for your application (an HTML file). The snippet should be placed right before the </body> tag:
1
<script>
2
(function(){
3
  w=window;n=w.Notifly=function(){n.q.push(arguments)};n.q=[];
4
  d=document;s=d.createElement("script");s.src="https://app.notifly.io/static/v2/notifly.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);
5
})();
6
</script>
Copied!
Step 2 Is to call window.Notifly('init', ...) as shown below when the element with the ID elementId has been rendered:
1
window.Notifly('init', {
2
  appId: "<YOUR_NOTIFLY_APP_ID>",
3
  authCode: "<USER_NOTIFLY_HASH>",
4
  elementId: "<ELEMENT_ID_FOR_WIDGET_TO_ATTACH_ONTO>",
5
  externalId: "<EXTERNAL_USER_ID>"
6
});
Copied!
React example
In React calling window.Notifly('init', ...)  would be done as follows.
In the component that the Notifly icon should appear in, add a useEffect -hook similar to this:
1
const NotiflyWrapper = ({ user }) => {
2
  useEffect(() => {
3
    if (window.Notifly) {
4
      window.Notifly('init', {
5
        appId: "<YOUR_NOTIFLY_APP_ID>",
6
        authCode: "<USER_NOTIFLY_HASH>", // e.g. could be `user.notiflyId` here
7
        elementId: "notifly-wrapper",
8
        externalId: "<EXTERNAL_USER_ID>"// e.g. could be `user.id` here
9
      });
10
    }
11
  }, [window.Notifly]) // add `user` here if required
12
​
13
  return <div id="notifly-wrapper" />
14
}
Copied!

Widget - Previous

Installation

Static pages (HTML)

Last modified 2yr ago

Copy link

Contents