Welcome to the Genesys
DX Support Center

Chat buttons are entry points that visitors use to engage with you. They can be customized to meet the needs of each area of your site.

Now you?ll create your first chat button and generate a very important snippet of HTML code. You?ll use the HTML code on your site to deploy chat; don?t worry if you aren?t ready for that step yet ? you can also preview test chats from within the Bold360 Admin Center.

Note: This article is part of a Quick Start Guide to help you implement your Bold360 environment from scratch.

To see the below steps in action, view our tutorial:

1. In the Web Admin Center, go to Channels > Chat > Chat Buttons (Floating).
2. Click My Chat Button to edit.
3. From the Chat Window drop-down, select My Chat Window that you have previously set up.

   

4. If you have one department, select it under Department. This will route any chats that come in through this button to agents within that department.
   Note: If you have multiple departments, you can find more information on your routing options in Route chats to your agents.
5. We recommend using your own custom image for the button itself. To do so, select Custom for Image Source. This custom image should be hosted on a URL, so that you can point to the button in Available Chat URL.
6. We also recommend using another custom image for an unavailable button. To move forward with this recommended approach, select Show Unavailable button under When Unavailable. This custom image should also be hosted on a URL, so that you can point to the Unavailable button within Unavailable Chat URL.
7. Once you have completed all the steps outlined, you are ready to generate the HTML to place on your website. To do so, on the left side of the page, go to the HTML tab.
   1. Under Website, select My Website.
   2. Under Auto-Invite Ruleset, select My Invite Ruleset .
   3. Click Generate HTML.

      You may be prompted to save your changes.

   4. Once HTML is generated, click Copy to clipboard.
   5. Paste this code into your favorite text editor such as Notepad. We do not recommend pasting code into Microsoft Word as it can break the code with styling or line breaks. Our best practice recommendation is to deploy this code to a staging site first. From there, review the widget and make any changes you want. Upon doing so, regenerate the code and then send it to your web developer to be added to all pages on your live website! Note that any test data will appear in reporting.
      Note: If you don?t have a custom button image, you can use our default image by keeping Image Source set to Predefined options.