There are 3 ways to use Applozic web chat plugin.
Please choose 1 approach out of the following:

Pre-built customizable web chat UI

You will get a small code snippet to copy paste into your website. Within 2 mins, you can have a ready to use chat widget with UI and all features available up and running.

This section will guide you in installing our pre-built web chat UI.

NOTE : Use local web server to view HTML files as real-time update will not work if you directly open the HTML file in the browser.

Adding sidebox chat UI plugin to your website

The steps below will guide you in adding the sidebox chat plugin to your website:

Add the plugin script mentioned below into your javascript code. Applozic installation script must be called on every page where the chat widget is required.

For a single page application, call the script on user login or register events.

<script type="text/javascript">
   (function(d, m){var s, h;       
   s = document.createElement("script");
   s.type = "text/javascript";
   s.async=true;
   s.src="https://apps.applozic.com/sidebox.app";
   h=document.getElementsByTagName('head')[0];
   h.appendChild(s);
   window.applozic=m;
   m.init=function(t){m._globals=t;}})(document, window.applozic || {});
</script>

For rest pages, add below script before the closing of '</body>' into your web page

Open source javascript chat widget

Download the source code of the Applozic javascript plugin from Github
Refer to the code sample available in
https://github.com/AppLozic/Applozic-Web-Plugin/tree/master/public/plugin/sample

Project is in node js.

Execute the following in the commands to run the sample:

npm install

node app.js

Open http://localhost:2299 in the browser to see the sample.

There are 2 UI designs:

• Full view
• Sidebox

Adding sidebox chat UI plugin to your website

The steps below will guide you in adding the sidebox chat plugin to your website:

Open sidebox.html

Copy the scripts and HTML code to your web page in the same order as done in sidebox.html

For any feature and design modification, the following 2 files can be modified:

CSS applozic.sidebox.css

JS applozic.sidebox.js

Adding fullview chat UI plugin to your website

The steps below will guide you in adding the fullview chat plugin to your website:

Open fullview.html

Copy the scripts and HTML code to your web page in the same order as done in fullview.html

For any feature and design modification, following 2 files can be modified:

CSS applozic.fullview.css

JS applozic.fullview.js

Modify the source code as per your design and requirements.
Important file references:
HTML Template
CSS
JS

Build your UI from scratch

This is a core library without any UI components.
Add the following script reference in your html page:

<script type="text/javascript" src="https://cdn.applozic.com/applozic/applozic.chat-5.7.1.min.js"></script>

Refer to "Build your UI from scratch" section in the next steps for using the core library without UI components.