README

Widget Options

This object contains options for customizing the WhatsApp floating widget. It has six main properties: gdprStatus, accounts, timezone, defaultAvatar, urlSettings and options.

gdprStatus

This property is used to set the GDPR status of the user. It is currently not used in the script you provided, so it can be left empty.

Note: The field "gdprStatus" is optional and has a default value of empty. If you want to indicate GDPR compliance, set the value to "1".

accounts

This property is an array of WhatsApp accounts that will be displayed in the floating widget. Each account has the following properties:

Option	Type	Description
accountId	number	a unique identifier for the account.
accountName	text	the name of the WhatsApp account.
avatar	link	the URL of the avatar image for the account.
number	phone number	the phone number associated with the account.
title	text	the title to display for the account in the widget.
predefinedText	text	the default message to be sent when the user clicks the account.
willBeBackText	text	the message to be displayed when the user sends a message outside of the account's working hours.
dayOffsText	text	the message to be displayed when the user sends a message on a day when the account is not working.
isAlwaysAvailable	'ON' | 'OFF'	whether the account is always available for messaging, regardless of its working hours.
daysOfWeekWorking	array object	an array object that specifies the working hours for the account on each day of the week.

• daysOfWeekWorking: Each day has the following properties:

  • isWorkingOnDay: whether the account is working on this day.

  • workHours: an array of objects that specify the start and end times for each working period on this day. Each object has the following properties:

    • startTime: the start time of the working period, in HH:mm format.

    • endTime: the end time of the working period, in HH:mm format.

// Example code
[{
    "accountId": 1,
    "accountName": "Dennis",
    "avatar": "",
    "number": "[phone]",
    "title": "Support",
    "predefinedText": "Chat on WhatsApp [njwa_page_title] in page: [njwa_page_url]",
    "willBeBackText": "I will be back in [njwa_time_work]",
    "dayOffsText": "I will be back soon",
    "isAlwaysAvailable": "OFF",
    "daysOfWeekWorking": {
      "sunday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "monday": {
        "isWorkingOnDay": "ON",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "tuesday": {
        "isWorkingOnDay": "ON",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "wednesday": {
        "isWorkingOnDay": "ON",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "thursday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "friday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "saturday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      }
    }
  },
  {
    "accountId": 2,
    "accountName": "Tommy",
    "avatar": "",
    "number": "[phone]",
    "title": "Director",
    "predefinedText": "We order [njwa_page_title] and [njwa_page_url]. Give me an advice?",
    "willBeBackText": "I will be back in [njwa_time_work]",
    "dayOffsText": "I will be back soon",
    "isAlwaysAvailable": "ON",
    "daysOfWeekWorking": {
      "sunday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "monday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "tuesday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "wednesday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "thursday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "friday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      },
      "saturday": {
        "isWorkingOnDay": "OFF",
        "workHours": [{
          "startTime": "08:00",
          "endTime": "17:30"
        }]
      }
    }
  }
]

Notes:

"[njwa_time_work]" is the shortcode to display the time when he is offline. 
"[njwa_page_title]" displays the page title of the current page he clicks on in the account. 
"[njwa_page_url]" adds the current URL to the WhatsApp message.

options

This property is an object that contains various options for customizing the appearance and behavior of the widget. It has three sub-properties: display, styles, and analytics.

display

This sub-property contains options related to when and where the widget is displayed. It has the following properties:

Option	Value	Description
showOnDesktop	'ON' | 'OFF'	whether to display the widget on desktop devices.
showOnMobile	'ON' | 'OFF'	whether to display the widget on mobile devices.
time_symbols	h:m	the time format to use for displaying working hours.

styles

This sub-property contains options related to the appearance of the widget. It has the following properties:

Option	Value	Description
title	text	This field specifies the title of the chat widget that will be displayed to the user.
responseText	'text' | 'html'	This field specifies the default response time that the user can expect when they initiate a chat.
description	'text' | 'html'	This field specifies the introductory text that will be displayed to the user in the chat widget. In this case, the text is "Hello there" with the words "Chat now" in bold.
backgroundColor	color	This field specifies the background color of the chat widget.
textColor	color	This field specifies the text color of the chat widget.
isShowScroll	'ON' | 'OFF'	This field specifies whether or not a scroll bar should be displayed when the chat history exceeds the maximum height.
scrollHeight	number	This field specifies the maximum height of the chat window. If the chat history exceeds this height, the window will become scrollable.
isShowResponseText	'ON' | 'OFF'	This field specifies whether or not the default response time text should be displayed in the chat widget.
btnLabel	text	This field specifies the label that will be displayed on the chat button that the user clicks to initiate a chat.
btnLabelWidth	number	This field specifies the width of the chat button.
btnPosition	'left' | 'right'	This field specifies the position of the chat button. In this case, the button will be positioned to the left of the chat widget.
btnLeftDistance	number	This field specifies the distance between the left edge of the chat widget and the left edge of the chat button.
btnRightDistance	number	This field specifies the distance between the right edge of the chat widget and the right edge of the chat button.
btnBottomDistance	number	This field specifies the distance between the bottom edge of the chat widget and the bottom edge of the chat button.
isShowBtnLabel	'ON' | 'OFF'	This field specifies whether or not the chat button label should be displayed.
isShowGDPR	'ON' | 'OFF'	This field specifies whether or not a GDPR (General Data Protection Regulation) notice should be displayed in the chat widget.
gdprContent	'text' | 'html'	This field specifies the text that will be displayed in the GDPR notice. In this case, the text asks the user to accept a policy and includes an underline.

analytics

The analytics field is an optional parameter that can be used to enable analytics tracking for the chat widget. This field contains two sub-fields, enabledGoogle and enabledFacebook, which can be set to either "ON" or "OFF" depending on whether you want to enable tracking for Google Analytics or Facebook Pixel respectively.

Option	Value	Description
enabledGoogle	'ON' | 'OFF'	The enabledGoogle sub-field determines whether tracking for Google Analytics is enabled. If set to "ON", tracking for Google Analytics will be enabled and data will be sent to your Google Analytics account. If set to "OFF", tracking for Google Analytics will be disabled.
enabledFacebook	'ON' | 'OFF'	The enabledFacebook sub-field determines whether tracking for Facebook Pixel is enabled. If set to "ON", tracking for Facebook Pixel will be enabled and data will be sent to your Facebook Pixel account. If set to "OFF", tracking for Facebook Pixel will be disabled.

Note: that if both enabledGoogle and enabledFacebook are set to "OFF", no analytics tracking will be performed. Also, enabling tracking for these analytics services requires setting up accounts and configuring the tracking code appropriately.

timezone

• The timezone field sets the default timezone for the widget, which is used to display the time of messages and events within the widget.

• In this case, the timezone is set to +07:00, which represents the time zone for Bangkok, Thailand.

defaultAvatar

• The defaultAvatar field sets the default avatar image for users who do not have a profile picture.

• In this case, the default avatar is a SVG image of a green circle with a white phone icon in the center.

urlSettings

• The urlSettings field sets various options related to how links within the widget should behave.

Option	Value	Description
onDesktop	'api' | 'web'	The onDesktop and onMobile options specify the URL scheme to use when opening links on desktop and mobile devices, respectively. In this case, both are set to "api", which suggests that links should be opened using a JavaScript API.
onMobile	'api' | 'protocol'	The onDesktop and onMobile options specify the URL scheme to use when opening links on desktop and mobile devices, respectively. In this case, both are set to "api", which suggests that links should be opened using a JavaScript API.
openInNewTab	'ON' | 'OFF'	The openInNewTab option specifies whether links should be opened in a new browser tab. In this case, it is set to "ON", which suggests that links should be opened in a new tab.

// Example code
{
  options: {
   "display": {
      "showOnDesktop": "ON",
      "showOnMobile": "ON",
      "time_symbols": "h:m"
   },
   "styles": {
      "title": "Start a Conversation",
      "responseText": "The team typically replies in a <strong>few minutes</strong>.",
      "description": "Hi! Click one of our member below to chat on <strong>WhatsApp</strong>",
      "backgroundColor": "#2db742",
      "textColor": "#fff",
      "scrollHeight": "500",
      "isShowScroll": "OFF",
      "isShowResponseText": "OFF",
      "isShowPoweredBy": "ON",
      "btnLabel": "Need Help? <strong>Chat with us</strong>",
      "btnLabelWidth": "156",
      "btnPosition": "right",
      "btnLeftDistance": "30",
      "btnRightDistance": "30",
      "btnBottomDistance": "30",
      "isShowBtnLabel": "ON",
      "isShowGDPR": "OFF",
      "gdprContent": "Please accept our <a href=\"https://ninjateam.org/privacy-policy/\">privacy policy</a> first to start a conversation.",
      "widgetType": "expandable"
   },
   "analytics": {
      "enabledGoogle": "OFF",
      "enabledFacebook": "OFF",
      "enabledGoogleGA4": "OFF"
   },
  },
  timezone: "+07:00",
  defaultAvatar: `<svg width="48px" height="48px" class="nta-whatsapp-default-avatar" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
            viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
            <path style="fill:#EDEDED;" d="M0,512l35.31-128C12.359,344.276,0,300.138,0,254.234C0,114.759,114.759,0,255.117,0
            S512,114.759,512,254.234S395.476,512,255.117,512c-44.138,0-86.51-14.124-124.469-35.31L0,512z"/>
            <path style="fill:#55CD6C;" d="M137.71,430.786l7.945,4.414c32.662,20.303,70.621,32.662,110.345,32.662
            c115.641,0,211.862-96.221,211.862-213.628S371.641,44.138,255.117,44.138S44.138,137.71,44.138,254.234
            c0,40.607,11.476,80.331,32.662,113.876l5.297,7.945l-20.303,74.152L137.71,430.786z"/>
            <path style="fill:#FEFEFE;" d="M187.145,135.945l-16.772-0.883c-5.297,0-10.593,1.766-14.124,5.297
            c-7.945,7.062-21.186,20.303-24.717,37.959c-6.179,26.483,3.531,58.262,26.483,90.041s67.09,82.979,144.772,105.048
            c24.717,7.062,44.138,2.648,60.028-7.062c12.359-7.945,20.303-20.303,22.952-33.545l2.648-12.359
            c0.883-3.531-0.883-7.945-4.414-9.71l-55.614-25.6c-3.531-1.766-7.945-0.883-10.593,2.648l-22.069,28.248
            c-1.766,1.766-4.414,2.648-7.062,1.766c-15.007-5.297-65.324-26.483-92.69-79.448c-0.883-2.648-0.883-5.297,0.883-7.062
            l21.186-23.834c1.766-2.648,2.648-6.179,1.766-8.828l-25.6-57.379C193.324,138.593,190.676,135.945,187.145,135.945"/>
        </svg>`,
  urlSettings: {
    "onDesktop": "api",
    "onMobile": "api",
    "openInNewTab": "ON"
  }
}

How To Use Script

Create Widget

To use the WhatsApp widget, follow these steps:

1. Create an element for the widget to mount:

   <div id="wa"></div>

2. Load the widget script and styles in your HTML:

   <script src="njt-whatsapp.js"></script>  
   <link rel="stylesheet" href="njt-whatsapp.css">

3. Add the following code to your script:

   var widgetOption = {
     gdprStatus: "",
     accounts: [{
           "accountId": 1,
           "accountName": "Dennis",
           "avatar": "",
           "number": "[phone]",
           "title": "Support",
           "predefinedText": "Chat on WhatsApp [njwa_page_title] in page: [njwa_page_url]",
           "willBeBackText": "I will be back in [njwa_time_work]",
           "dayOffsText": "I will be back soon",
           "isAlwaysAvailable": "OFF",
           "daysOfWeekWorking": {
           "sunday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "monday": {
              "isWorkingOnDay": "ON",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "tuesday": {
              "isWorkingOnDay": "ON",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "wednesday": {
              "isWorkingOnDay": "ON",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "thursday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "friday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "saturday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           }
           }
        },
        {
           "accountId": 2,
           "accountName": "Tommy",
           "avatar": "",
           "number": "[phone]",
           "title": "Director",
           "predefinedText": "We order [njwa_page_title] and [njwa_page_url]. Give me an advice?",
           "willBeBackText": "I will be back in [njwa_time_work]",
           "dayOffsText": "I will be back soon",
           "isAlwaysAvailable": "ON",
           "daysOfWeekWorking": {
           "sunday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "monday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "tuesday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "wednesday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "thursday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "friday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           },
           "saturday": {
              "isWorkingOnDay": "OFF",
              "workHours": [{
                 "startTime": "08:00",
                 "endTime": "17:30"
              }]
           }
           }
        }
     ],
     options: {
        "display": {
           "showOnDesktop": "ON",
           "showOnMobile": "ON",
           "time_symbols": "h:m"
        },
        "styles": {
           "title": "Start a Conversation",
           "responseText": "The team typically replies in a <strong>few minutes</strong>.",
           "description": "Hi! Click one of our member below to chat on <strong>WhatsApp</strong>",
           "backgroundColor": "#2db742",
           "textColor": "#fff",
           "scrollHeight": "500",
           "isShowScroll": "OFF",
           "isShowResponseText": "OFF",
           "isShowPoweredBy": "ON",
           "btnLabel": "Need Help? <strong>Chat with us</strong>",
           "btnLabelWidth": "156",
           "btnPosition": "right",
           "btnLeftDistance": "30",
           "btnRightDistance": "30",
           "btnBottomDistance": "30",
           "isShowBtnLabel": "ON",
           "isShowGDPR": "OFF",
           "gdprContent": "Please accept our <a href=\"https://ninjateam.org/privacy-policy/\">privacy policy</a> first to start a conversation.",
           "widgetType": "expandable"
        },
        "analytics": {
           "enabledGoogle": "OFF",
           "enabledFacebook": "OFF",
           "enabledGoogleGA4": "OFF"
        },
     },
     timezone: "+07:00",
     defaultAvatar: `<svg width="48px" height="48px" class="nta-whatsapp-default-avatar" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
                       viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
                       <path style="fill:#EDEDED;" d="M0,512l35.31-128C12.359,344.276,0,300.138,0,254.234C0,114.759,114.759,0,255.117,0
                       S512,114.759,512,254.234S395.476,512,255.117,512c-44.138,0-86.51-14.124-124.469-35.31L0,512z"/>
                       <path style="fill:#55CD6C;" d="M137.71,430.786l7.945,4.414c32.662,20.303,70.621,32.662,110.345,32.662
                       c115.641,0,211.862-96.221,211.862-213.628S371.641,44.138,255.117,44.138S44.138,137.71,44.138,254.234
                       c0,40.607,11.476,80.331,32.662,113.876l5.297,7.945l-20.303,74.152L137.71,430.786z"/>
                       <path style="fill:#FEFEFE;" d="M187.145,135.945l-16.772-0.883c-5.297,0-10.593,1.766-14.124,5.297
                       c-7.945,7.062-21.186,20.303-24.717,37.959c-6.179,26.483,3.531,58.262,26.483,90.041s67.09,82.979,144.772,105.048
                       c24.717,7.062,44.138,2.648,60.028-7.062c12.359-7.945,20.303-20.303,22.952-33.545l2.648-12.359
                       c0.883-3.531-0.883-7.945-4.414-9.71l-55.614-25.6c-3.531-1.766-7.945-0.883-10.593,2.648l-22.069,28.248
                       c-1.766,1.766-4.414,2.648-7.062,1.766c-15.007-5.297-65.324-26.483-92.69-79.448c-0.883-2.648-0.883-5.297,0.883-7.062
                       l21.186-23.834c1.766-2.648,2.648-6.179,1.766-8.828l-25.6-57.379C193.324,138.593,190.676,135.945,187.145,135.945"/>
                    </svg>`,
     urlSettings: {
        "onDesktop": "api",
        "onMobile": "api",
        "openInNewTab": "ON"
     }
   }
   
   document.addEventListener("DOMContentLoaded", function() {
      njtWhatsApp.ready(function() {
         // #wa is the element we created in step 1.
         njtWhatsApp.createWidget(document.querySelector("#wa"), widgetOption);
      })
   })
   

Create Button

var buttonOption = {
   name: "Dennis",
   info: {
      number: "[phone]",
      title: "Sale Support",
      predefinedText: "Hello, I need help with [njwa_page_title] and [njwa_page_url] shortcodes to output the page's title and URL respectively.",
      willBeBackText: "I will be back in time [njwa_time_work]",
      dayOffsText: "I will be back soon",
      isAlwaysAvailable: "OFF",
      daysOfWeekWorking: {
         sunday: {
            isWorkingOnDay: "OFF",
            workHours: [
               {
                  startTime: "14:00",
                  endTime: "17:30",
               },
               {
                  startTime: "02:30",
                  endTime: "09:00",
               },
               {
                  startTime: "03:00",
                  endTime: "10:00",
               },
           ],
         },
         monday: {
            isWorkingOnDay: "ON",
            workHours: [
               {
                  startTime: "21:00",
                  endTime: "17:30",
               },
               {
                  startTime: "03:30",
                  endTime: "17:30",
               },
           ],
         },
         tuesday: {
            isWorkingOnDay: "OFF",
            workHours: [
               {
                  startTime: "14:00",
                  endTime: "17:30",
               },
            ],
         },
         wednesday: {
            isWorkingOnDay: "ON",
            workHours: [
               {
                  startTime: "15:00",
                  endTime: "17:30",
               },
            ],
         },
         thursday: {
            isWorkingOnDay: "ON",
            workHours: [
               {
                  startTime: "14:00",
                  endTime: "17:30",
               },
            ],
         },
         friday: {
            isWorkingOnDay: "ON",
            workHours: [
               {
                  startTime: "14:00",
                  endTime: "17:30",
               },
            ],
         },
         saturday: {
            isWorkingOnDay: "OFF",
            workHours: [
               {
                  startTime: "14:00",
                  endTime: "17:30",
               },
            ],
         },
      },
   },
     
   styles: {
      type: "square", // round | square
      backgroundColor: "#962e4a",
      textColor: "#eeee22",
      label: "Chat with me",
      width: 300,
      height: 64,
   },
   avatar: "https://wp.test/wp-content/uploads/2021/02/LkFrSynw-filebird-ninja.png",
   options: {
      showOnDesktop: "ON",
      showOnMobile: "ON",
      time_symbols: "h:m",
   },
   gdprStatus: "1",
   defaultAvatar: `<svg width="48px" height="48px" class="nta-whatsapp-default-avatar" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
                        viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
                        <path style="fill:#EDEDED;" d="M0,512l35.31-128C12.359,344.276,0,300.138,0,254.234C0,114.759,114.759,0,255.117,0
                        S512,114.759,512,254.234S395.476,512,255.117,512c-44.138,0-86.51-14.124-124.469-35.31L0,512z"/>
                        <path style="fill:#55CD6C;" d="M137.71,430.786l7.945,4.414c32.662,20.303,70.621,32.662,110.345,32.662
                        c115.641,0,211.862-96.221,211.862-213.628S371.641,44.138,255.117,44.138S44.138,137.71,44.138,254.234
                        c0,40.607,11.476,80.331,32.662,113.876l5.297,7.945l-20.303,74.152L137.71,430.786z"/>
                        <path style="fill:#FEFEFE;" d="M187.145,135.945l-16.772-0.883c-5.297,0-10.593,1.766-14.124,5.297
                        c-7.945,7.062-21.186,20.303-24.717,37.959c-6.179,26.483,3.531,58.262,26.483,90.041s67.09,82.979,144.772,105.048
                        c24.717,7.062,44.138,2.648,60.028-7.062c12.359-7.945,20.303-20.303,22.952-33.545l2.648-12.359
                        c0.883-3.531-0.883-7.945-4.414-9.71l-55.614-25.6c-3.531-1.766-7.945-0.883-10.593,2.648l-22.069,28.248
                        c-1.766,1.766-4.414,2.648-7.062,1.766c-15.007-5.297-65.324-26.483-92.69-79.448c-0.883-2.648-0.883-5.297,0.883-7.062
                        l21.186-23.834c1.766-2.648,2.648-6.179,1.766-8.828l-25.6-57.379C193.324,138.593,190.676,135.945,187.145,135.945"/>
                     </svg>`,
   timezone: "+07:00",
   i18n: {
      online: "Online",
      offline: "Offline",
   },
   options: {
      display: {
         showOnDesktop: "ON",
         showOnMobile: "ON",
         time_symbols: "h:m",
      },
      styles: {
         title: "Start a Conversation",
         responseText: "The team typically replies in a <strong>few minutes</strong>.",
         description: "Hi! Click one of our member below to chat on <strong>WhatsApp</strong>",
         backgroundColor: "#2db742",
         textColor: "#fff",
         scrollHeight: "500",
         isShowScroll: "OFF",
         isShowResponseText: "OFF",
         isShowPoweredBy: "ON",
         btnLabel: "Need Help? <strong>Chat with us</strong>",
         btnLabelWidth: "156",
         btnPosition: "right",
         btnLeftDistance: "30",
         btnRightDistance: "30",
         btnBottomDistance: "30",
         isShowBtnLabel: "ON",
         isShowGDPR: "OFF",
         gdprContent: 'Please accept our <a href="https://ninjateam.org/privacy-policy/">privacy policy</a> first to start a conversation.',
      },
      analytics: {
         enabledGoogle: "OFF",
         enabledFacebook: "OFF",
         enabledGoogleGA4: "OFF",
      },
   },
   urlSettings: {
      onDesktop: "api",
      onMobile: "api",
      openInNewTab: "ON",
   },
};

document.addEventListener("DOMContentLoaded", function () {
   njtWhatsApp.ready(function () {
      document.querySelectorAll(".nta_wa_button").forEach(function (element) {
      njtWhatsApp.createButton(element, buttonOption);
      });
   })
})