ibm-watson - Watson Virtual Agent の背景色を変更する

Question

Watson Virtual Agent を使用してボットを作成し、Web サイトに埋め込みました。サイトの他の色と一致するように、チャット ウィンドウの背景色を変更できますか?

Answer 1

ブランドに合わせてチャット ウィジェットの色を変更できます。

実際、チャット ウィジェットで使用されるすべての色は構成可能です。

独自の色を選択するconfigには、関数に渡すオブジェクトの一部として独自の色を指定できますIBMChat.init。

以下の例にはデフォルトの色が含まれていますが、必要に応じて 16 進数コードを置き換えてください。

 var config = {};
 //set your other config params

config.styles = {
    background: '#3d3d3d',
    //the main background color
    accentBackground: '#AF6EE8',
    /*the background for "accent" elements.
    These are the attention grabbing elements like a selected button,
    or a loading spinner*/
    accentText: '#ffffff',
    //the text color for the accentBackground
    text: '#ffffff',
    //default text color
    link: '#ffffff',
    /*default link color... this should be a color that works both
    with the "background" color and the "secondaryBackground" color.*/
    secondaryBackground: '#464646',
    /*this is the background for elements that get some emphasis,
    but not as much as "accent" elements. e.g. An unselected button
    or a container box for a widget.*/
    secondaryText: '#f7f7f7',
    inputBackground: '#464646',
    //background color for your form elements, including the main chat input
    inputText: '#f7f7f7'
}

IBMChat.init(config);