CrossTalk AI Summary JavaScript Documentation
This documentation helps you add AI Summary to your webpage with CrossTalk's JavaScript SDK.
Import the SDK
Add the below script tag to your HTML file. You can add this either in the
<head> or <body> section of your HTML file.
<script src="https://unpkg.com/crosstalk-comments-js"></script>Add the CrossTalk div where you want to display the AI Summary
You can add style and class to this div to customise its positioning, margins within your webpage. The inner content won't be affected by your CSS
<div data-crosstalk-ai-summary data-wp="your-webproperty-name" data-url="URL" data-theme="light"></div>
Sign up for your
CrossTalk
account
to get your unique WebProperty Name to customise which AI Summary options are displayed
List of params for CrossTalk Comments:
| Variable Name | Definition | Expected Values |
|---|---|---|
data-wp |
Your unique WebProperty Name. You can create Web Properties from the Dashboard | Example: 'crosstalkDemo'. String value expected |
data-url |
This is your web page's URL that will be sent to the AI provider to summarise for the user. Send a full URL that's easily accessible to AI |
`${window.location.origin}${window.location.pathname}`
|
data-theme |
Whether to load the widget in Light mode or Dark. If your website supports dynamic themes, pass this variable onto the widget so it blends right in |
Either light or dark. String value expected
|
Use the sample web property
crosstalkDemo to test the widget right away.
Add the below code to your webpage for working CrossTalk Comments:
<script src="https://unpkg.com/crosstalk-comments-js"></script><div data-crosstalk-ai-comments data-wp="crosstalkDemo" data-url="https://japantoday.com/category/sports/sumo-hit-with-fresh-bullying-scandal" data-theme="light"></div>