Versions Compared

Old Version 29

changes.mady.by.user Derya Özdemir

Saved on

compared with

New Version 30

changes.mady.by.user Derya Özdemir

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Panel
panelIconIdatlassian-info
panelIcon:info:
bgColor#F4F5F7

This page is about Chat for JSM Cloud. Using Server or Data Center? Click here.

You can customize the Chat Button and Chat Widget’s appearance on the Jira Customer Portal Live Chat in the Appearance section. To access the screen, open Project Settings, and from the sidebar, click Chat Settings > Jira Customer Portal Live Chat Appearance.

Image Removed

How to Customize the Chat Widget

1. Change the Chat Widget accent color

2. Change the Chat Widget display mode

How to Customize the Chat Button

3. Change the Chat Button's position

4. Change the Chat Button style

5. Change the Chat Button text

AnchorHow-to-Customize-the-Chat-WidgetHow-to-Customize-the-Chat-WidgetHow to Customize the Chat Widget on Jira Customer Portal

Contents

Table of Contents
minLevel2
maxLevel3
outlinefalse
typelist
printablefalse

Color and messages

To change the display appearance of the Chat Widget on your Jira Customer Portal and website, you have two options:

AnchorChange-the-Chat-Widget-accent-colorChange-the-Chat-Widget-accent-colorScreen Shot 2024-02-16 at 12.17.39.pngImage Added

1.

Change the Chat Widget accent color on Jira Customer Portal

Widget Color

Using the interactive color picker, you can select a color for the Chat Widget.

Image Removed
Image Removed
AnchorChange-the-Chat-Widget-display-modeChange-the-Chat-Widget-display-mode2. Change the Chat Widget display mode on Jira Customer Portal

The Chat Widget can be displayed as a popup or inline.

Image Removed
Image Removed
AnchorHow-to-Customize-the-Chat-Button-on-Jira-Customer-PortalHow-to-Customize-the-Chat-Button-on-Jira-Customer-PortalHow to Customize the Chat Button on
Screen Shot 2024-02-16 at 16.45.04.pngImage Added
Screen Shot 2024-02-16 at 16.46.36.pngImage Added

2. Header & Greeting message

The changes made here apply to both the Jira Customer Portal and external websites.

Header Message: This is the message that’s displayed at the top of the Chat Widget.

d080b8d1-2131-460d-85a0-99c0b6ba7323.pngImage Added

Greeting Message: This is the message that’s displayed before the customer starts the conversation. If you don’t want to have a Greeting message, uncheck the box next to Show a greeting message before customer starts the conversation.

2587ca8c-5e9b-4fab-94d8-a9f803fb186d.pngImage Added

Jira Customer Portal

To change the display appearance of the Chat Button, you have three options:

AnchorChange-the-positionChange-the-position3. Change the Chat Button’s Screen Shot 2024-02-16 at 12.17.19.pngImage Added

1. Button position

The Chat Button can only be placed into the page content in either a Footer or Header position. Due to Jira Customer Portal limitations, it’s not possible to have a floating button.

Image RemovedImage Added
Image Removed

AnchorChange-the-Chat-Button-styleChange-the-Chat-Button-style4. Change the Chat
Image Added

2. Widget display mode

The Chat Widget can be displayed as a popup or inline.

Image Added
Image Added

3. Button style

Here, you can select one of the built-in styles ("Classic" and "Subtle"), or you can define your own style of the button, setting the text and background color.

Note that the “Custom” button style does not display the Chat icon.

Classic

Image Removed

Subtle

Image Removed

Custom

Image Removed AnchorChange-the-Chat-Button-textChange-the-Chat-Button-text5. Change the Chat

4. Button text

By default, the button text is “Chat with support”. You can customize it on the Translate and Customize administration page. Here’s how:

  1. From the navigation bar, click Apps > Manage Your Apps.

  2. Locate CHAT in the sidebar, and click Translate and Customize.

  3. Click the search bar and type Chat with support.

  4. Find the text you want to translate and click the arrow icon to reveal the text box.

    Image Removed

  5. Write the customized text, and click Change.

That’s it! Check the customer portal to see the updated versionTo learn how, refer to the related documentation.

Note

Once you’ve made your changes in the Jira Customer Portal Live Chat section, don’t forget to click Save!

🚀 Next Steps

Now, let's continue customizing the Chat Widget:

Panel
panelIconId1f5e8
panelIcon:speech_left:
panelIconText🗨️
bgColor#F4F5F7

Customize Chat Widget Texts