Quick start

Setting up the Chat widget is very simple and the standard integration should only take a few lines of code.

1. Visit https://cal.assembledhq.com/settings/chat?selectedTab=setup
2. Copy the script tag under Installation on the page to your HTML header (make sure it’s available on whatever page you’d like the chat widget to appear). It will look like this:

<script
  src="https://cal.assembledhq.com/static/js/public-chat.js"
  data-company-id="YOUR_COMPANY_ID"
></script>

Installing chat for Zendesk Helpcenter

If you're hosting your support site on Zendesk Guide, you can very quickly add Assist for Chat. Here are the steps you can take:

1. Go to the administrative portal for your Zendesk Guide settings https://[YOUR ZENDESK DOMAIN].zendesk.com/knowledge
2. Next, find the "Customize design" icon on the navigation bar (the 4th icon from the top)
3. Select the theme you'd like to edit (usually the theme that is live) and click "Customize"
4. Once you're in the theme, click on "Edit code" in the bottom right corner of the screen
   • If you can't find the "Edit code" button, you may need to upgrade to Guide Professional or Guide Enterprise (see Zendesk's help center documentation here).
5. Go the "Templates > document_head.hbs" and add your Assist for Chat script tag into the document
6. Click "Publish" to save the changes and enable Chat for your Help center

User authentication

User authentication enables you to link chat interactions to user accounts in your application and enhance the chat experience based on your user data. When authenticated, you can:

• Track user conversations in the Assembled admin dashboard
• Provide personalized responses based on user attributes (e.g. different types of responses from VIP users vs free users)
• Maintain conversation context across sessions

User data interface

JWT token requirement

The JWT token must contain a map of claims in the user data interface. For example, here's the simplest allowable JWT claim:

{
  "user_id": "CURRENT_USER_ID"
}

To generate the token:

1. Ask your Assembled Assist contact for a JWT secret from Assembled
2. Create a JWT token on your server using this secret
3. Send the token to your frontend for authentication

Example token generation (Node.js):

const jwt = require('jsonwebtoken');
const secret = 'YOUR_JWT_SECRET'; // From Assembled dashboard

const token = jwt.sign(
  { 
     user_id: 'user_123',
     email: 'user@example.com', 
     name: 'John Doe', 
     metadata: { 
       plan: 'premium', 
       company: 'Acme Inc' 
     }
  },
  secret,
);

Authentication

To authenticate a user, generate a JWT token from your server and pass this to your frontend so that you can securely identify a user:

await window.assembled.authenticateUser('YOUR_JWT_TOKEN');

Setting user data without authentication

You can also pass user data without signing and authenticating the validity of the data. To set unauthenticated user information, you can use the setUserData method:

await window.assembled.setUserData({
  user_id: "usr_1234",
  name: 'John Smith',
  metadata: {
    plan: 'enterprise'
  }
});

Technical requirements

• Modern browser support (IE11+)
• JavaScript enabled

Troubleshooting

Common issues and solutions:

1. Widget not appearing:
   • Verify company ID is correct
   • Check console for error messages
   • Ensure script is loaded properly
2. Authentication failures:
   • Verify JWT token is valid
   • Check token expiration
   • Ensure proper user data format
3. Style issues:
   • Clear browser cache
   • Check for CSS conflicts
   • Verify custom style parameters

Support

For additional support, contact your Assist implementation manager on Slack or the Assembled support team (support@assembledhq.com).