Insert the following initialization code in each of your pages in which you want to use the widget:

<script>!function(){function e(){if(!window.customerlySettings||!window.customerlySettings.app_id)return void console.log("%c customerly error: missing customerlySettings.app_id parameter. Please read the integration guide or contact us.","background: #ffecec; color: #ed0000");var e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="//widget.customerly.io/widget.js?"+window.customerlySettings.app_id;var r=t.getElementsByTagName("script")[0];r.parentNode.insertBefore(e,r)}var r=window,t=document,n=function(){n.c(arguments)};r.customerly_queue=[],n.c=function(e){r.customerly_queue.push(e)},r.customerly=n,r.attachEvent?r.attachEvent("onload",e):r.addEventListener("load",e,!1)}();</script>

Then setup the widget with the following configuration:

<script> window.customerlySettings = { app_id: "app_id", email: "user@gmail.com", user_id: 123, whatever_you_want: "state_value" }; </script>

Whenever you want to track an event, you just call:

<script> customerly('event', 'event_name'); </script>

Note that if you enable the safe-mode in the control panel, you should also send email_hash and user_id_hash (if user_id is used) in the configuration:

email_hash: "<?=hash_hmac(sha256, email, secret_key)>", user_id_hash: "<?=hash_hmac(sha256, used_id, secret_key)>",