page-support-bot

page.support web client reference implementation

Usage no npm install needed!

<script type="module">
  import pageSupportBot from 'https://cdn.skypack.dev/page-support-bot';
</script>

README

Why page.support?

Page.support is a solution for automating customer support. Page.support lets you quickly create chatbots and workflow-enabled websites without writing code. It does this by emulating the primitives that underly human conversation, reducing the amount of work required to design conversations. Rapid iteration based on customer feedback is essential to the adoption of automation, making a no-code solution important - particularly if the support team does not have dedicated software developers. The Page.support publisher lets you define the user interaction by writing markdown with some additional annotations to define the workflow. For more on why page.support was built and the benefits for customers support see our [manifesto](link to github pages or the ghost site)

The Bot client software in this repository and the interface between the client and publisher is MIT licensed open source, providing use case flexibility and reducing dependence on a single vendor. The open source botConfig interface between publisher and client lets an ecosystem of SaaS providers, developers and users interoperate.

Since the page.support bot runs in the user's browser, you can create experiences with a high degree of responsiveness, availability, privacy and security that don't depend on a third party chatbot server. If needed, user data can be read/written to servers you select to save user replies or personalize the experience. However the Bot's basic functionality - dialog, questions, and taking user replies - doesn't need a server to run. This lets you design experiences that protect user privacy and meet regulatory requirements by minimizing data that goes back to servers, particularly third party servers.

Page.Support Bot and Publisher Interface Repository

This repository contains the open source Bot client component to embed in your website. The Bot client is a javascript component that drives the end user experience. It runs in the user's browser without any server side connection required after the initial page load. Its behavior is customized by a botConfig.js file that is generated by a publisher like the one at publisher.page.support. The configuration file enables the behaviors described in the tutorial The src/interface directory in this repository contains the botConfig JSON template that defines the interface between Page.Support publishers and all Bot clients such as this one. This bot client includes basic color and font customization. If you need more customization, fork this repository and customize the Bot client to add functionality or change its look and feel. If your enhancements are generally useful we appreciate your contributions via pull requests. As long as your Bot clients maintain compatibility with the botConfig definition, your customized/forked client can be used with any Page.Support compliant publisher.

If your bot requires reading or writing data from a server, e.g. for authentication, personalization, or saving user replies, see the Server Integration section below.

Adding Bot to your website

There are several ways to integrate Bot into your website. In all cases, Bot needs three files to function and potentially other files like images:

  • The Bot javascript component in this repository. You can fork this repo or install the component with npm install page-support-bot
  • A configuration file that defines the bot's behavior. This file will be produced by a publisher like the one at publisher.page.support. Click the download button to get a ES6 module version of the file. In the future this will be loaded from publisher.page.support so the behavior of your bot doesn't require pushing a code release.
  • A page-support-bot-bundle.css file.
  • If you botConfig includes references to images, you'll need to host them on an server at whatever URLs you used in your markdown.

Add Bot to your javascript build pipeline

If your already have a build pipeline for your js code, you can add Bot as a dependency via npm, import it into your javascript application, then build and deploy it with the rest of your site. You will also need to add static assets your Bot uses to an asset server you maintain.

npm install page-support-bot

Now add it to your package.json under "dependencies"

"page-support-bot": "1.0.0"

Import into your javascript application

// The Bot client code, installed from npm
import Bot from "page-support-bot"; 

// Your Bot's configuration file that defines its behavior. Download it from  
// publisher.page.support and save to your application's repository if you want 
// it under version control (encouraged), or load from static file server if not. 
import botConfig from "/your-path/to/page.support.botconfig.js"

Bot imports the stylesheet it needs from the node_modules directory it was installed into: page-support-bot/dist/page-support-bot-bundle.css. That css file is imported via an @import command in the