Stella Platform Documentation

Stella Platform Documentation

  • Docs
  • Procedures
  • Reference
  • FAQ
  • Bot API
  • API
  • Languages iconEnglish
    • 中文

›Channels

Overview

  • Documentation Guide

Get Started

  • Introduction
  • Recent Updates
  • Best Practices
  • Chatbot Template

Bot Builder

  • Workspace
  • Node
  • Attachment ID

Node Inspector

  • Tree ID & Composite ID
  • Basic Information
  • Triggers
  • Responses
  • Actions
  • Redirect
  • Member Tagging
  • Analytics
  • NLP
  • Advance

Facebook

  • Message Types
  • Button Types
  • Persistent Menu
  • Access Token
  • One-Time Notification
  • N-Time Notification (Beta)

Instagram

  • Message Types

WhatsApp

  • Overview
  • Setup Procedure
  • Message Types

Web Chat

  • Overview
  • Message Types
  • Button Types

WeChat

  • Message Types

Slack

  • Message Types

Telegram

  • Message Types

Integrations

  • Dialogflow
  • Stripe
  • LUIS
  • Custom Inbox Integration

Data Source

  • Data Source

Media Library

  • Media Library

Channels

  • Overview
  • Webhooks
  • Channel-wide Metadata
  • Business Availability
  • Facebook
  • Instagram
  • Web Chat
  • WhatsApp
  • WeChat
  • Slack (Public App)
  • Slack (Custom App)
  • Teamwork
  • Zendesk
  • Custom Platform

Analytics

  • Members
  • Dashboard
  • PSID

Settings

  • Overview
  • Locale
  • Pairing Channels
  • Role-based Access Control
  • Access Token
  • Audit Trail

Push Panel

  • Push Content
  • Audience
  • Analytics

Log

  • Log

Web Chat Deployment

Connecting Web Chat Channel

Web chat channel
  1. Select "Channels" at the top menu bar.
  2. Click "+New Channel".
  3. Name your new channel and select Web Chat as your deployment platform.

Basic Settings

Profile Picture & Web Chat Icon Picture

Set web chat icons
PropertyDescriptionPlacement
Profile PictureThe logo displayed next to the messaging bubbles
Web Chat Icon PictureThe logo displayed at the upper layer and you can click it to open up the chatroom window
  1. Upload a profile picture and web chat icon picture for your chatbot. You can directly paste the image URL or upload to media library.

Theme Color

Set theme color
  1. Select the theme color you want to display on your chatbot. You may select from the default theme colors or use the color picker to customize your own favourite color.

Language

Language settings
  1. Set up all the languages you want to display on your web chat. Click "+Add Language" to add additional display languages.
  2. Toggle on the default button into green for your default language.

Set display text for different languages
PropertyDescription
Bot NameThe name of the chat room
Language TextThe display text of language settings
Greeting Button TextThe display text of the get started button
  1. Set up your Bot Name, Language Text and Greeting Button Text under different languages.

Setup Persistent Menu

Set up persistent menu
PropertyDescription
Button TypeCan set to "Payload", "Nested" or "URL"; unlimited number of buttons can be set
PayloadSpecifies the menu item is a postback, see Web Chat Button Types
URLSpecifies the menu item opens a website in a new tab, see Web Chat Button Types
NestedSpecifies the menu item opens the next menu layer; supports unlimited menu layer
  1. Set up your persistent menu with the corresponding button type.

Adding Trees & Global Nodes

  1. Add the specific trees and global nodes that you would like to include in the web chat channel. You can add multiple trees and global nodes into one channel.

Add trees and global nodes in the channel

Web Chat UI

  1. Upon completion of setting up your web chat chatbot, you can test it with the test link in Platform.

Web chat chatbot link
  1. In the Web Chat chatbot, by clicking "Settings" at top right, users are able to switch between different languages and font sizes.

Web Chat Settings Button
  1. If you have set up more than one langauges for web chat, users can switch languages in the dropdown.

Langauge Switch
  1. Users can also switch to different font size.

Font Size
  1. If you have set up the persistent menu, you are able to open it at the bottom left.

Persistent Menu

Embedding Script onto Website

In Web Chat Overview, you have learnt that you would need to embed the web chat script onto your website to properly display the plugin. You will be able to find the script in channels in the next update.

← InstagramWhatsApp →
  • Connecting Web Chat Channel
  • Basic Settings
    • Profile Picture & Web Chat Icon Picture
    • Theme Color
    • Language
  • Setup Persistent Menu
  • Adding Trees & Global Nodes
  • Web Chat UI
  • Embedding Script onto Website
Stella Platform Documentation
Docs
Get StartedBot API ReferenceAPI ReferenceStandard Procedures
Community
FAQUser ShowcaseChat with Us
Copyright © 2023 Sanuker Inc. Limited