Documentation du SDK JavaScript des commentaires CrossTalk
Cette documentation vous aide à ajouter des commentaires à votre page web avec le SDK JavaScript de CrossTalk.
Importer le SDK
Ajoutez la balise script ci-dessous dans votre fichier HTML. Vous pouvez l'ajouter dans la section
<head> ou <body> de votre fichier HTML.
<script src="https://unpkg.com/crosstalk-comments-js"></script>Ajouter la div CrossTalk à l'endroit où vous souhaitez afficher les commentaires
Vous pouvez ajouter du style et des classes à cette div pour personnaliser son positionnement et ses marges dans votre page. Le contenu intérieur ne sera pas affecté par votre CSS.
<div data-crosstalk-comments data-wp="votre-nom-de-propriete-web" data-page-id="pageID" data-url="URL" data-theme="light" data-reactions="false"></div>
Inscrivez-vous pour un
compte CrossTalk
afin d'obtenir votre nom de propriété web unique et commencez à interagir avec votre audience
via les commentaires !
Liste des paramètres pour les commentaires CrossTalk :
| Nom de la variable | Définition | Valeurs attendues |
|---|---|---|
data-wp |
Votre nom de propriété web unique. Vous pouvez créer des propriétés web depuis le Tableau de bord. | Exemple : 'crosstalkDemo'. Valeur de type chaîne attendue. |
data-page-id |
Un PageID qui identifie de manière unique une page dans votre propriété web. Si vous avez un système
de CMS, le slug d'un article serait un bon PageID.
Si vous intégrez CrossTalk dans votre application, partager le PageID garantira que les mêmes commentaires se chargent si la même page est ouverte sur votre site Web ou votre application. Envoyez soit page-id soit url. Si les deux sont envoyés,
page-id a la priorité.
|
Exemple : 'some-Slug-123'. Valeur de type chaîne attendue. |
data-url |
Si vous ne gérez pas de PageIDs, envoyer l'URL canonique fonctionne également. Cela
chargera dynamiquement les commentaires en fonction de l'URL du site web. Envoyez soit page-id soit url. Si les deux sont envoyés,
page-id a la priorité.
|
`${window.location.origin}${window.location.pathname}`
|
data-theme |
Indique si le widget doit être chargé en mode clair ou sombre. Si votre site supporte les thèmes dynamiques, passez cette variable au widget pour qu'il s'intègre parfaitement. |
Soit light soit dark. Valeur de type chaîne attendue.
|
data-reactions |
Indique si les réactions par image doivent être activées au-dessus des commentaires. |
Soit true soit false. Valeur booléenne attendue.
|
Utilisez la propriété web exemple
crosstalkDemo pour tester le widget immédiatement.
Ajoutez le code ci-dessous à votre page web pour des commentaires CrossTalk fonctionnels :
<script src="https://unpkg.com/crosstalk-comments-js"></script><div data-crosstalk-comments data-wp="crosstalkDemo" data-page-id="test" data-theme="light"></div>