Інтеграція онлайн-чата (Jivo) на веб-сайт
JivoSite — популярний російський онлайн-чат для веб-сайтів. Підтримує чат, дзвінки, email, соцмережі в одному вікні для операторів. Установка займає хвилини — вставити скрипт та налаштувати віджет.
Базова установка
<!-- Вставити перед </body> або в <head> з async -->
<script src="//code.jivosite.com/widget/{WIDGET_ID}" async></script>
Для React/Next.js:
// components/JivoChat.tsx
useEffect(() => {
const script = document.createElement('script');
script.src = `//code.jivosite.com/widget/${process.env.NEXT_PUBLIC_JIVO_ID}`;
script.async = true;
document.body.appendChild(script);
return () => document.body.removeChild(script);
}, []);
Передача даних про користувача
// Ідентифікація авторизованого користувача
window.jivo_api?.setContactInfo({
name: user.name,
email: user.email,
phone: user.phone,
description: `ID: ${user.id}, замовлень: ${user.orders_count}`
});
// Кастомні дані (відображаються оператору)
window.jivo_api?.setCustomData([
{title: 'Корзина', content: `${cartTotal} ₽`},
{title: 'Тариф', content: user.plan}
]);
Callback API для інтеграції
Jivo надає JS API для програмного керування чатом:
function jivo_onMessageSent(message) {
// Користувач відправив повідомлення — можна логувати
analytics.track('chat_message_sent');
}
function jivo_onOpen() {
// Віджет відкрито
analytics.track('chat_opened');
}
Тривалість установки: кілька годин, включаючи налаштування передачі даних користувача.