Installation : JavaScript

Dans certains cas, vous pouvez vouloir créer les embeds dynamiquement. Comme les embeds Hyvor Talk sont des Web Components, vous pouvez facilement les créer avec JavaScript.

1. Charger le script

Commencez par charger le script qui enregistre le Web Component sur votre page.

function loadHyvorTalk() {
	// add embed script
	const script = document.createElement('script');
	script.src = 'https://talk.hyvor.com/embed/embed.js';
	script.type = 'module';
	document.head.appendChild(script);

	// create the element
}

Voici les scripts d'intégration :

2. Créer l'élément

Ensuite, créez le Web Component et ajoutez-le à un autre élément. Voici un exemple :

function loadHyvorTalk() {
	// add embed script
	// ...

	// create the element
	const comments = document.createElement('hyvor-talk-comments');
	comments.setAttribute('website-id', 'YOUR_WEBSITE_ID');
	comments.setAttribute('page-id', '');
	document.getElementById('comments-wrap').appendChild(comments);
}

Vous pouvez également écouter les événements de chaque Web Component et utiliser leurs API. Consultez la documentation de chaque embed pour plus d'informations.

TypeScript

Si vous utilisez TypeScript, vous pouvez utiliser la bibliothèque @hyvor/hyvor-talk-base pour créer le Web Component de manière typée. Cette bibliothèque fournit des fonctions utilitaires typées pour les embeds. C'est la bibliothèque de base que nous utilisons dans nos bibliothèques React, Vue et Svelte.

Notez que l'installation de cette bibliothèque n'intégrera pas directement les scripts d'intégration dans votre build. Elle chargera plutôt les scripts depuis les serveurs Hyvor Talk à l'exécution.

Hyvor Talk Logo