$_Huggy

$_Huggy is the object { HuggyChatConfig } of main settings of Huggy chat. This code is found in setting of the channel of Widget by the panel. Just copy the code referring for your channel and insert in the your page, preferably before closing of tag body (</body>) or before closing of tag head (</head>).

PropertyTypeDescriptionDefault
widget_idstringUnique ID of Huggy Chat. Is required for chat working and is present in installation of Huggy Chat that you copy the code available in channel's settings
companystringUnique ID of your Huggy account. Is required for chat working and is present in installation of Huggy Chat that you copy the code available in channel's settings
defaultCountrystringCountry IDD+1optional
namestringSets previously the contact nameoptional
phonestringSets previously the contact's phone that will start a chatoptional
emailstringSets previously the contact's email that will start a chatoptional
channelGreetingstringThis property is used in link of "Call me on Whatsapp" and "Call me on Telegram". The default is "Hi" and, with this property, can be changed for both services.Hioptional
afterLoadfunctionCallback event that executes at the end of widget loadingoptional
beforeLoadfunctionCallback event that executes before the load of widget.optional
mainColorstringSets the main color of Huggy Chatoptional
colorsobject[HuggyChatConfigColors]Object with color settings for Huggy Chatoptional
widget_id
string

Unique ID of Huggy Chat. Is required for chat working and is present in installation of Huggy Chat that you copy the code available in channel's settings

Default:


company
string

Unique ID of your Huggy account. Is required for chat working and is present in installation of Huggy Chat that you copy the code available in channel's settings

Default:


defaultCountry
string

Country IDD

Default: +1


name
string

Sets previously the contact name

Default:


phone
string

Sets previously the contact's phone that will start a chat

Default:


email
string

Sets previously the contact's email that will start a chat

Default:


channelGreeting
string

This property is used in link of "Call me on Whatsapp" and "Call me on Telegram". The default is "Hi" and, with this property, can be changed for both services.

Default: Hi


afterLoad
function

Callback event that executes at the end of widget loading

Default:


beforeLoad
function

Callback event that executes before the load of widget.

Default:


mainColor
string

Sets the main color of Huggy Chat

Default:


colors
object[HuggyChatConfigColors]

Object with color settings for Huggy Chat

Default:


$_Huggy.name

Sets previously the contact name that will start a chat







 





<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+1',
    widget_id: '0001',
    company: "0001",
    name: 'John Doe'
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11

$_Huggy.phone

Sets previously the contact's phone that will start a chat







 





<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+1',
    widget_id: '0001',
    company: "0001",
    phone: '1112345678'
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11

$_Huggy.email

Sets previously the contact's email that will start a chat







 





<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+1',
    widget_id: '0001',
    company: "0001",
    email: 'john@doe.com'
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11

$_Huggy.channelGreeting

This property is used in link of "Call me on Whatsapp" and "Call me on Telegram". The default is "Hi" and, with this property, can be changed for both services.







 





<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+1',
    widget_id: '0001',
    company: "0001",
    channelGreeting: 'I would like to ask a question'
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11

$_Huggy.afterLoad

Callback event that executes at the end of widget loading. Received a function:







 
 
 





<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+1',
    widget_id: '0001',
    company: "0001",
    afterLoad: function () {
      console.log('code executed after widget load')
    }
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13

$_Huggy.beforeLoad

Callback event that executes before the load of widget. Received a function:







 
 
 





<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+1',
    widget_id: '0001',
    company: "0001",
    beforeLoad: function () {
      console.log('code executed before widget load')
    }
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13

$_Huggy.defaultCountry

Is the country IDD. The default is '+1'.




 







<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {   
    defaultCountry: '+1', 
    widget_id: '0001',
    company: "0001",
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10

$_Huggy.mainColor

The mainColor property define the colors of the Huggy Chat.








 





<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+55',
    widget_id: '0001',
    company: "0001",
    defaultCountry: '+55',
    mainColor: "#d81adb"
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11
12

$_Huggy.colors

Object with { HuggyChatConfigColors } type with the color settings for Huggy Chat.









 





<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+55',
    widget_id: '0001',
    company: "0001",
    defaultCountry: '+55',
    mainColor: "#d81adb",
    colors: {}
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13

colors.textTitle

The textTitle property of the colors object sets the color of the Huggy Chat title.










 






<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+55',
    widget_id: '0001',
    company: "0001",
    defaultCountry: '+55',
    mainColor: "#d81adb",
    colors: {
      "textTitle": "#b4bec0",
    }
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

colors.textReceivedMessage

The textReceivedMessage property of the colors object sets the color of the messages received by Huggy Chat.











 






<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+55',
    widget_id: '0001',
    company: "0001",
    defaultCountry: '+55',
    mainColor: "#d81adb",
    colors: {
      "textTitle": "#b4bec0",
      "textReceivedMessage": "#000000",
    }
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

colors.textSendMessage

The textSendMessage property of the colors object sets the color of the messages sent by Huggy Chat.












 






<!-- Init code Huggy Chat  //-->
<script>
  var $_Huggy = {
    defaultCountry: '+55',
    widget_id: '0001',
    company: "0001",
    defaultCountry: '+55',
    mainColor: "#d81adb",
    colors: {
      "textTitle": "#b4bec0",
      "textReceivedMessage": "#6b7c80",
      "textSendMessage": "#000000"
    }
  };

  // ...
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

huggyData

Object with { HuggyChatData } type (shape) apart from the setting ($_Huggy) that contains a data structure. Must be declared before Huggy Chat initialization and must be available inside window, acessible as window.huggyData

⚠️ This object must be declared before of boot of Huggy chat.



 











<!-- Init code Huggy Chat  //-->
<script>
  var huggyData = {};

  var $_Huggy = {
    defaultCountry: '+1',
    widget_id: '0001',
    company: "0001"
  };
  
  (function(i,s,o,g,r,a,m){ i[r]={context:{id:'8551dbde3f168db249381597eea81c71'}};a=o;o=s.createElement(o); o.async=1;o.src=g;m=s.getElementsByTagName(a)[0];m.parentNode.insertBefore(o,m); })(window,document,'script','https://js.huggy.chat/widget.min.js?v=8.0.0','pwz');
</script>
<!-- End code Huggy Chat  //-->
1
2
3
4
5
6
7
8
9
10
11
12
13

huggyData.variables

The variables property is an array that must receives objects { HuggyChatDataVariable } with 2 properties key and value. This resource can be utilized to interact with variables inside flow.



 
 
 
 
 
 



<script>
  var huggyData = {
    variables: [
      {
        key: 'clientid',
        value: 104
      }
    ]
  };
</script>
1
2
3
4
5
6
7
8
9
10

huggyData.userIdentifier

Sets a unique identifier to user. This property is used in the Huggy Chat authentication process and must always be accompanied by the userHash property.



 




<script>
  var huggyData = {
    userIdentifier: 'user@company.com',
    userHash: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJqdGkiOiJ1c2VyMUBjb21wYW55LmNvbSJ9.upuQ_qWcSFWdzIAGjEfSi-v_RvWC-bicTLNyEePPOhY'
  }
</script>
1
2
3
4
5
6

huggyData.userHash

Sets user authentication token (in JWT standard). This property is used in Huggy Chat authentication process and must always be accompanied by the userIdentifier property.




 



<script>
  var huggyData = {
    userIdentifier: 'user@company.com',
    userHash: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJqdGkiOiJ1c2VyMUBjb21wYW55LmNvbSJ9.upuQ_qWcSFWdzIAGjEfSi-v_RvWC-bicTLNyEePPOhY'
  }
</script>
1
2
3
4
5
6

Read about the authentication

Types