Aller au contenu principal
Développement Web

N-Bed - Widget Chatbot Intégrable pour n8n

Widget chatbot React intégrable sur n'importe quel site (Shadow DOM, aucune dépendance), 100% configurable et connecté à n8n via webhook. Compatible toutes stacks.

Voir les autres projets
William AklamavoRéalisé parWilliam Aklamavo · Expert automatisation & apps
N-Bed - Widget Chatbot Intégrable pour n8n
Capture d'écran du projet N-Bed - Widget Chatbot Intégrable pour n8n — Développement Web

À propos de ce projet

N-Bed est un widget chatbot React entièrement configurable qui peut être intégré sur n'importe quel site web, quelle que soit la stack utilisée (PHP, Symfony, React, Vue, WordPress, etc.).

Caractéristiques principales

  • ✅ Isolation CSS complète : Shadow DOM pour éviter tout conflit avec les styles de votre site
  • ✅ Standalone : React inclus, aucune dépendance externe requise
  • ✅ 100% Configurable : Textes, couleurs, icônes, emojis, animations, positionnement
  • ✅ Compatible toutes stacks : Fonctionne sur n'importe quel site web
  • ✅ Responsive : Parfaitement adapté mobile, tablette et desktop
  • ✅ Animations personnalisables : Saut, zigzag, ou aucune animation

Modes d'intégration

N-Bed supporte 3 modes d'intégration selon vos besoins :

Mode 1 : Attributs data-* (Simple)

Idéal pour une configuration basique et une intégration rapide. Compatible avec tous les CMS (WordPress, Drupal, etc.).

Mode 2 : Objet JavaScript (Avancé)

Configuration complète et flexible avec accès à toutes les options pour des configurations complexes.

Mode 3 : Mix (Recommandé)

Combine les attributs data-* (valeurs de base) avec l'objet JavaScript (valeurs avancées) pour une flexibilité maximale.

Configuration avancée

Le widget permet de personnaliser :

  • Textes : Titre, messages de bienvenue, placeholders, boutons
  • Couleurs : Palette complète (primaire, secondaire, arrière-plan, texte)
  • Positionnement : 4 positions possibles (bottom-right, bottom-left, top-right, top-left)
  • Animations : Type d'animation du launcher, animations d'ouverture/fermeture
  • Comportements : Auto-ouverture, persistance de conversation, scroll automatique
  • Fonctionnalités : Réactions, Markdown, pièces jointes, timestamps
  • CSS personnalisé : Injection de styles personnalisés pour une personnalisation totale

API et intégration n8n

Le widget communique avec n8n via webhook, supportant :

  • Réponses JSON simples
  • Streaming SSE (Server-Sent Events)
  • Streaming NDJSON
  • Streaming Plain Text
  • Gestion des fichiers attachés (base64)

Documentation complète

Une documentation exhaustive est disponible sur la landing page du projet, incluant :

  • Guide d'installation (CDN ou local)
  • Exemples d'utilisation pour différentes stacks
  • Référence API complète
  • Personnalisation avancée
  • Dépannage et support

Résultat

Un widget chatbot production-ready, entièrement isolé et configurable, permettant d'ajouter un assistant conversationnel à n'importe quel site web en quelques minutes. La solution est entièrement documentée et accessible sur https://n-bed.bovo-digital.tech/


Vous voulez ajouter un chatbot à votre site ou SaaS ? Découvrez notre service de développement web →

Réalisé par William Merveille Aklamavo — Expert Développement Web chez BOVO Digital · Voir aussi : Chatbot WhatsApp n8n + Gemini — Support Auto · Tontineo App Flutter — Tontine Numérique

Projets similaires

Explorez d'autres réalisations dans la même catégorie.

Articles connexes du blog

Approfondissez le sujet avec nos guides et tutoriels.