Sends a message to the chatbot immediately. The chat widget will open automatically if it’s closed.
Copy
Ask AI
window.$sitegpt.push(['do', 'message:send', 'What are your pricing plans?']);
Example: Send message when user clicks a pricing button
Copy
Ask AI
document.getElementById('pricing-button').addEventListener('click', function() { window.$sitegpt.push(['do', 'message:send', 'What are your pricing plans?']);});
Example: Complete flow - open chat and send message
Copy
Ask AI
window.$sitegpt.push(['open']);setTimeout(() => { window.$sitegpt.push(['do', 'message:send', 'I need help with my account']);}, 100);
Prefills the message input field with text. Users can edit the message before sending. The input field will be focused automatically.
Copy
Ask AI
window.$sitegpt.push(['set', 'message:text', "Hi! I'd like to get help with..."]);
Example: Prefill input when user clicks a help button
Copy
Ask AI
document.getElementById('help-button').addEventListener('click', function() { window.$sitegpt.push(['set', 'message:text', "Hi! I'd like to get help with..."]);});
Example: Open chat and prefill input
Copy
Ask AI
window.$sitegpt.push(['open']);setTimeout(() => { window.$sitegpt.push(['set', 'message:text', 'I have a question about billing']);}, 100);
Use ['do', 'message:send', ...] when you want to send a message automatically without user interaction. Use ['set', 'message:text', ...] when you want to suggest a message but let the user edit it before sending.
Provide additional information to your SiteGPT bot for more relevant and contextual conversations, such as the current page the user is on.
Copy
Ask AI
window.$sitegpt.push(['set', 'context', [ 'You are an experienced sales executive. You need to guide the user to book a demo call.', 'Current Page: Pricing Page \n Current Page URL: https://sitegpt.ai/pricing']]);
Example: Provide page-specific context
Copy
Ask AI
window.$sitegpt.push(['set', 'context', [ 'You are helping a premium customer.', 'Current page: ' + document.title]]);
const crypto = require('crypto');// Your API key from sitegpt.ai/billing (keep it private!)const apiKey = '6338d1ac-9afc-4a7c-8812-ba9e3f8c48eb';// Sign an email using HMAC-SHA256function signEmail(email) { return crypto.createHmac('sha256', apiKey).update(email).digest('hex');}// Generate signature for your userconst signature = signEmail('user@example.com');console.log('Signature:', signature);
Security notes:
Use HMAC-SHA256 algorithm only
Generate signatures on your backend server
Never expose your API key in frontend code
Each signature is unique to the email and your API key
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.
--chat-color - Primary brand color (used for bubble, buttons, etc.)
--chat-text-color - Text color for elements using the brand color
--chat-font-size - Base font size for the chat interface
The widget uses Tailwind CSS internally. You can target specific elements with custom CSS, but the available CSS variables are limited to those listed above.
If your chatbot doesn’t appear, try these solutions:
Check the script tag
Ensure the script is added before </body> and the chatbot ID is correct.Check browser console
Look for JavaScript errors that might prevent loading.Verify chatbot is published
Ensure your chatbot is published in the dashboard.Test in incognito mode
Rule out browser extensions or cached files.
Methods not working
If SDK methods aren’t working, verify these items:
Wait for SDK to load
Ensure the SDK is fully loaded before calling methods.Check syntax
Verify you’re using the correct method syntax.Review console errors
Check for JavaScript errors in the browser console.
Styling issues
If custom styles aren’t applying, try these fixes:
Check CSS specificity
Your styles may need !important to override defaults.Verify CSS syntax
Ensure your CSS is valid.Clear cache
Clear browser cache and reload the page.