How to display the chat widget icon and chat window on the left side using HTML code with the Chat for JSM application

To make the Chat widget icon to be displayed at the bottom left of the screen instead of the bottom right, you will need to apply the following HTML code. 

Step-by-step guide

Chat widget icon on the external web page

  1. Include the HTML below on your external web page.

<style> chat-widget::part(wrapper) {right: unset; left: 30px;} </style> <style> chat-widget::part(wrapper) {right: unset; left: 30px;align-items: flex-start;} </style>
  1. Example of complete code:

<html>
<body>
<script src="https://chat-api.spartez-software.com/chat-widget.js" defer></script><chat-widget jira-id="8ad73648-24b8-3d3c-bf91-f75ff508305b"service-desk-id="15"></chat-widget>
<style> chat-widget::part(wrapper) {right: unset; left: 30px;} </style>
<style> chat-widget::part(wrapper) {right: unset; left: 30px;align-items: flex-start;} </style>
</body>
</html>

  1. After adding the above HTML code, you can see the widget on the left side, as shown in the screenshot below.

    2024-04-16_12-25-27.png