The $sitegpt object allows you to interact with and control the SiteGPT chatbot widget embedded on your website. You can use it to customize appearance, provide context, manage user sessions, and control the widget’s visibility. Commands are sent using the push method: window.$sitegpt.push([command, ...args]).

​
Customize Widget Appearance

​
Add custom CSS

  • Description: Apply your own CSS to the chatbot widget and style it according to your branding.
  • Syntax: window.$sitegpt.push(["set", "css", "css_string"])
// Example: Setting the primary color of chatbot widget to green.
window.$sitegpt.push(['set', 'css', ':root { --chat-color: green; }'])

// Example: Changing the font family
window.$sitegpt.push([
  'set',
  'css',
  'body { font-family: "Your Custom Font", sans-serif; }',
])

​
Enhance Chatbot Context

​
Give extra context

  • Description: Provide additional information to your SiteGPT bot for more relevant and contextual conversations, such as the current page the user is on.
  • Syntax: window.$sitegpt.push(["set", "context", ["prompt_prefix_string", "prompt_suffix_string"]])
// Example: Giving the current page URL and a system prompt prefix
window.$sitegpt.push([
  'set',
  'context',
  [
    'You are an experienced sales executive. You need to guide the user to book a demo call.', // Prefix
    'Current Page: Pricing Page \n Current Page URL: https://sitegpt.ai/pricing', // Suffix
  ],
])

​
Manage User Sessions

​
Automatically log the user in

  • Description: Automatically log the user into the chatbot widget using their verified email address, eliminating the need for manual entry. This requires generating a secure signature on your backend.
  • Syntax: window.$sitegpt.push(["set", "user:email", ["email_string", "email_signature_string"]])
// Example: Automatically logging in the user with email user@company.com.
// The signature must be generated on your backend.
window.$sitegpt.push([
  'set',
  'user:email',
  [
    'user@company.com',
    'cd7cc422ea97c82d844b2373fdcd6259c9ee6e135af65ab6fe6ca85e3f07abb1', // Example signature
  ],
])
To generate the signature, you can use the following Node.js example: 
const crypto = require('crypto')

// Put your API key here (keep it private!)
// Note: The one below is an example. Find yours on sitegpt.ai/billing page.
const apiKey = '6338d1ac-9afc-4a7c-8812-ba9e3f8c48eb'

// This method signs an email using your API Key
function signEmail(email) {
  return crypto.createHmac('sha256', apiKey).update(email).digest('hex')
}

// Sign your user's email (sourced from your authenticated user session)
// const userEmail = getUserEmailFromSession(); // Your logic here
// const signature = signEmail(userEmail);

// Example signing:
var exampleSignature = signEmail('user@company.com')
console.log('Signature is:', exampleSignature)
Make sure you generate signatures with the HMAC-SHA256 algorithm.
Any other HMAC digest is not accepted and will be refused by the SiteGPT chatbot.

​
Security of User Verification

User Verification uses the HMAC-SHA256 signature algorithm, a standard and secure method for authenticating data. When setting a user email via the $sitegpt object, you must provide the signature computed on your backend. This signature uses your secret API key, known only to you and SiteGPT. Because only you and SiteGPT can generate valid signatures for a given email, an attacker without your API key cannot impersonate users.
Never generate signatures directly in your front-end code.
Doing so would expose your API key in the browser, allowing anyone to impersonate your users.
Always generate signatures on your backend server and never leak your API key.

​
Control Widget Visibility

You can programmatically control the chat widget’s visibility, which is especially useful if you have hidden the default chat bubble (hideBubble=true in the embed script) and want to trigger the chat from your own UI elements (like a button).

​
Open the chat widget

  • Description: Programmatically opens the chat widget window.
  • Syntax: window.$sitegpt.push(["open"])
// Example: Open the chat when a user clicks a custom button
document
  .getElementById('my-custom-chat-button')
  .addEventListener('click', function () {
    window.$sitegpt.push(['open'])
  })

​
Close the chat widget

  • Description: Programmatically closes the chat widget window.
  • Syntax: window.$sitegpt.push(["close"])
// Example: Close the chat from another element
document
  .getElementById('close-chat-link')
  .addEventListener('click', function () {
    window.$sitegpt.push(['close'])
  })

​
Toggle the chat widget

  • Description: Programmatically opens the chat widget if it’s closed, and closes it if it’s open.
  • Syntax: window.$sitegpt.push(["toggle"])
// Example: Use a single button to open or close the chat
document
  .getElementById('toggle-chat-button')
  .addEventListener('click', function () {
    window.$sitegpt.push(['toggle'])
  })