sundayit/chatframe

Sunday IT's Chat frame package

Maintainers

Details

github.com/sunday-ltd/chatframe

Homepage

Source

Issues

Installs: 3

Dependents: 0

Suggesters: 0

Security: 0

Stars: 0

Watchers: 2

Forks: 0

Open Issues: 0

Language:CSS

1.0.1 2019-09-21 17:29 UTC

Requires

Requires (Dev)

MIT 887f4bb69bd225f3cbcf11e7145a0a62fc55a599

laravelchatbotBotmanchatframe

This package is auto-updated.

Last update: 2024-10-22 05:27:34 UTC

README

Sunday Chatframe

This package builds upon Sunday's fork of the Botman web-widget:

Usage - Backend Blade

1. Install this package, if you don't have it yet to composer:

$ composer require sundayit/chatframe

2. Run command (Optional)

If you want to locally host the chatframe's JS and CSS files instead of using the CDN, run the following command

$ php artisan vendor:publish --provider="SundayIT\chatframe\chatframeServiceProvider" --force

Which will place the necessary JS and CSS files. In this case, open packages/sundayit/chatframe/views/chat/chatframe.blade.php and uncommment the local resources, and remove the CDN links.

Usage - Frontend widget

1. Link the frontend widget

This widget loads the chat bubble to the bottom right corner and injects the iframe Use our CDN:

<script src="https://cdn.jsdelivr.net/gh/molbal/web-widget@1.0/build/js/widget.js" integrity="sha256-myGUOuEeTzqiz4ltlVns6LXOWUcFq1Rr+Ie9641fQYI=" crossorigin="anonymous"></script>

or download from the latest release: https://github.com/molbal/web-widget/releases and either compile it yourself (see project readme) or take /build/js/widget.js

2. Link CSS for the styles

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/molbal/web-widget@1.0/build/assets/css/widget.min.css">

3. Set up the settings BEFORE the frontend widget.:

<script type="text/javascript">
    var botmanWidget = {
        chatServer: 'https://php-uk-conference-2018.marcelpociot.de/botman',
        frameEndpoint: '/chat-endpoint',
        bubbleAvatarUrl: "https://img.icons8.com/color/96/000000/technical-support.png",
        title: 'Chatbot',
        
        /* Below Sunday development */
        headerTextColor: '#fff',
        headerTextFontFamily: "Barlow Semi Condensed",
        headerTextFontWeight: 700,
        mainColor: '#f37820',
        headerIconBorderRadius: '0',
        headerIconDisplayed: true,
        headerIconSize: '80px'
    }
</script>

Example:

https://gist.github.com/molbal/4397765979cccf8339f2c809851a36ff

Change log

Please see the changelog for more information on what has changed recently.

Security

If you discover any security related issues, please email author email instead of using the issue tracker: molnar.balint@mdy.hu

Credits