Legacy Dev Forum Posts

 View Only

Sign Up

Back to discussions
Expand all | Collapse all

Chat Widget Label color change

  • 1.  Chat Widget Label color change

    Posted 06-05-2025 19:22

    mahesh_pillai | 2021-10-12 03:14:08 UTC | #1

    Hi,

    I am using version 2 chat widget and I want to change the label color in the form. e.g. First Name, Last Name, Email etc. Currently for some reason using the dark theme is displaying the label color in black instead of white. How do i change that to white? Below is the widget code that I am using.

    <script src="https://apps.mypurecloud.ie/widgets/9.0/cxbus.min.js" onload="javascript:CXBus.configure({debug:false,pluginsPath:'https://apps.mypurecloud.ie/widgets/9.0/plugins/'}); CXBus.loadPlugin('widgets-core');"></script>

    <script>

    window.genesys = { "widgets": { main: { theme:"light", lang: "vietnam", i18n: "https://jsonkeeper.com/b/1X68" }, "webchat": { "transport": { "type": "purecloud-v2-sockets", "dataURL": "https://api.mypurecloud.ie", "deploymentKey": "519e6191-dd9d-400d-948f-e478b8fc987e", "orgGuid": "69ad5769-f309-4c7d-9998-c1b03dbd34af", "interactionData": { "routing": { "targetType": "QUEUE", "targetAddress": "InnoHub CustomerBAllOtherChat", "priority": 2 } } }, "userData": { "addressStreet": "", "addressCity": "", "addressPostalCode": "", "addressState": "", "phoneNumber": "", "customField1Label": "", "customField1": "", "customField2Label": "", "customField2": "", "customField3Label": "", "customField3": "" } } } };

    function getAdvancedConfig() { return { "form": { "autoSubmit": false, "firstname": "test", "lastname": "", "email": "", "subject": "" }, "formJSON": { "wrapper": "<table></table>", "inputs": [ { "id": "cxwebchatformfirstname", "name": "firstname", "maxlength": "100", "label": "First Name" }, { "id": "cxwebchatformlastname", "name": "lastname", "maxlength": "100", "placeholder": "Required", "label": "Last Name" }, { "id": "cxwebchatformemail", "color":"#FFFFFF", "name": "email", "maxlength": "100", "placeholder": "Optional", "label": "Email" }, { "id": "cxwebchatformsubject", "name": "subject", "maxlength": "100", "placeholder": "Optional", "label": "Subject" }, { "id":"cxwebchatform_enquirytype", "name":"language", "type":"select", "label":"Language", "options":[

    { "text":"English", "value":"en", "selected":true }, { "text":"Cantonese (Chinese Traditional)", "value":"zh-TW" }, { "text":"Chinese Simplified", "value":"zh-CN" }, { "text":"Japanese", "value":"ja" }, { "text":"French", "value":"fr" } ] } ] } }; }

    const customPlugin = CXBus.registerPlugin('Custom'); </script>

    <button type="button" id="chat-button" onclick="customPlugin.command('WebChat.open', getAdvancedConfig());">Start Chat</button>

    Regards, Mahesh

    tim.smith | 2021-10-12 14:33:19 UTC | #2

    Hello, you can find information about creating custom themes for web chat v2 here: https://all.docs.genesys.com/WID/Current/Developer/GWCCustomize.

    Jerome.Saint-Marc | 2021-10-19 17:05:08 UTC | #3

    Hello,

    The normal color for label with dark theme is white. You probably have some style/css in the page containing your widget, which is interfering with the widgets style. I mean something in your web page that sets label color to black (and which takes precedence on/overrides the widgets theme).

    Regards,

    system | 2021-11-19 17:05:42 UTC | #4

    This topic was automatically closed 31 days after the last reply. New replies are no longer allowed.

    This post was migrated from the old Developer Forum.

    ref: 12327



Related Content