Live web Chatwoot

If you want to offer a communication channel for users. We propose this simple and powerful solution.

Chatwoot is live chat software. It’s open source and has a great community. You can access the code here.

You need a Chatwoot server, you have differents options. If you are interested in self-hosted follow this guide.

Here you will not find a chatwoot manual, only a few steps to embed your widget code.

The Widget appears at the login script, main page and startup screens:

Once you have the widget you have to paste it in a js file, and add a config to Ravada.

Create a JS widget

Copy your code in the file: /usr/share/ravada/public/js/custom/chatwoot_widget.js. Do not copy the <script> tags, only the javascript code. Set your chatwoot server at the second line.

      (function(d,t) {
        var BASE_URL = "https://chatwoot.server.example.org";
              var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
              g.src= BASE_URL + "/packs/js/sdk.js";
              s.parentNode.insertBefore(g,s);
              g.onload=function(){
                window.chatwootSettings = {
                  locale: 'ca',
                  type: 'expanded_bubble',
                   launcherTitle: 'Some message',
                   showPopoutButton: true
                 }
                 window.chatwootSDK.run({
                   websiteToken: 'xxxxxxxxx4Yh7RkXPtt1',
                   baseUrl: BASE_URL
                 })
               }
       })(document,"script");

Configuration

Add the widget path in the frontend settings. Go to Admin Tools , Settings You also need to allow third party content inside HTML, set the server address in the Content Security Policy.

Content Security Policy

If you want to fine-tune the Content Security Policy, check the Advanced CSP to display more options.

Apply

There is no need to restart the server. It is applied right after saving.

Check headers

Use curl to check the content security policy headers

curl --head https://server.example.org