botpress-platform-webchat
Advanced tools
Official Webchat connector module for Botpress. This module allows you to embed your chatbot on any website and also allows you to serve it as a full-screen web app.
npm install botpress-platform-webchat
[TODO] More instructions coming.
Note on Views
You can talk to it and use it in different views (mobile, web, embedded), see section below to have the detail.
content.ymlwelcome:
- Hello, world!
- This is a message on Messenger!
- text: this works too!
typing: 2s
- |
This is a multi-line
message :).
content.ymlwelcome:
- text: Hello, world!
typing: 250ms
quick_replies:
- <QR_YES> Yes
- <QR_NO> No
We are still working on other type of messages to increase the power of this module. Botpress is a community effort, so Pull Requests are welcomed.
When your bot is running, you can have access to a mobile view at ${HOSTNAME}/lite/?m=platform-webchat&v=fullscreen (e.g http://localhost:3000/lite/?m=platform-webchat&v=fullscreen).
This URL is public (no authentication required) so you can share it we other people.
To embedded the web interface to a website, you simply need to add this script at the end of the <body> tag. Don't forget to set the hostname correctly to match the public hostname of your bot.
<script>
window.botpressSettings = {
hostname: "botpress.pagekite.me" // <<-- Change this to your bot hostname
};
</script>
<script>
!function(){function t(){var t=n.createElement("script");t.type="text/javascript",t.async=!0,t.src="https://"+a.hostname+"/api/botpress-platform-webchat/inject.js";var e=n.getElementsByTagName("script")[0];e.parentNode.insertBefore(t,e)}var e=window,a=e.botpressSettings,n=document;e.attachEvent?e.attachEvent("onload",t):e.addEventListener("load",t,!1)}();
</script>
A configuration file (botpress-platform-webchat.config.yml) has been created at the root of your bot when you installed the module. You can change these values to change the look and feel of the web chat.
# DEFAULT SETTINGS
botName: 'Bot' ## Name of your bot
botAvatarUrl: null ## Default avatar url of the image (e.g. 'https://avatars3.githubusercontent.com/u/1315508?v=4&s=400' )
botConvoTitle: 'Technical Support' ## Title of the first conversation with the bot
# POPUP CONVERSATION SETTINGS
welcomeMsgEnable: true
welcomeMsgDelay: 1000
welcomeMsgText: | ## Welcome message that shows at on pop-up (multi-lines)
Hey guys!
Curious about our offer?
This is the default message...
# COLOR SETTINGS
backgroundColor: '#ffffff' ## Color of the background
textColorOnBackground: '#666666' ## Color of the text on the background
foregroundColor: '#0176ff' ## Element background color (header, composer, button..)
textColorOnForeground: '#ffffff' ## Element text color (header, composer, button..)
Note
You need to restart your bot by running
bp startagain for new settings to be effective.
There's a Slack community where you are welcome to join us, ask any question and even help others.
Get an invite and join us now! 👉 https://slack.botpress.io
Licensed under AGPL-3.0
FAQs
An embeddable web chat for Botpress bots
The npm package botpress-platform-webchat receives a total of 10 weekly downloads. As such, botpress-platform-webchat popularity was classified as not popular.
We found that botpress-platform-webchat demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Socket's package search now displays weekly downloads for npm packages, helping developers quickly assess popularity and make more informed decisions.
Security News
A Stanford study reveals 9.5% of engineers contribute almost nothing, costing tech $90B annually, with remote work fueling the rise of "ghost engineers."
Research
Security News
Socket’s threat research team has detected six malicious npm packages typosquatting popular libraries to insert SSH backdoors.