Chatty is a jQuery add-on that creates a chatbot-like experience from a json question format. Live Demo

Add the style and javascript files to your html markup. All source files from releases are freely available on jsdelivr

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/WiFuchs/[email protected]/chat-style.css">
<script src="https://cdn.jsdelivr.net/gh/WiFuchs/[email protected]/chatModule.js" type="text/javascript"></script>

var tags = [
    {
        type: "input",
        tag: "text",
        "chat-msg": "Hello, World! What is your name?",
        name: "name",
        placeholder: "Snazzy McChatbot"
    },
    {
        type: "msg",
        "chat-msg": "Nice to meet you, {{name}}! Welcome to Chatty"
    }
];

$(document).ready(function () {
    Chat.start($('#chat-context'), tags);
});

Chatty relies on the following:

• Velocity.js
• jQuery
• FontAwesome (only for submit arrow - could override in stylesheet to use any other library or icon)

Full documentation lives in the repo wiki. Check it out!

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.