拡張チャットが有効になっている場合にチャットに使用するアイコン画像の変更 Issue <!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: var(--now-color--text-primary, #000000); } span { font-size: 12pt; font-family: Lato; color: var(--now-color--text-primary, #000000); } h2 { font-size: 24pt; font-family: Lato; color: var(--now-color--text-primary, black); } h3 { font-size: 18pt; font-family: Lato; color: var(--now-color--text-primary, black); } h4 { font-size: 14pt; font-family: Lato; color: var(--now-color--text-primary, black); } a { font-size: 12pt; font-family: Lato; color: var(--now-color--link-primary, #00718F); } a:hover { font-size: 12pt; color: var(--now-color--link-primary, #024F69); } a:target { font-size: 12pt; color: var(--now-color--link-primary, #032D42); } a:visited { font-size: 12pt; color: var(--now-color--link-primary, #00718f); } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } 拡張チャットを有効にした状態で、AI スパークルチャットアイコンを変更するにはどうすればよいですか? Release<!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: var(--now-color--text-primary, #000000); } span { font-size: 12pt; font-family: Lato; color: var(--now-color--text-primary, #000000); } h2 { font-size: 24pt; font-family: Lato; color: var(--now-color--text-primary, black); } h3 { font-size: 18pt; font-family: Lato; color: var(--now-color--text-primary, black); } h4 { font-size: 14pt; font-family: Lato; color: var(--now-color--text-primary, black); } a { font-size: 12pt; font-family: Lato; color: var(--now-color--link-primary, #00718F); } a:hover { font-size: 12pt; color: var(--now-color--link-primary, #024F69); } a:target { font-size: 12pt; color: var(--now-color--link-primary, #032D42); } a:visited { font-size: 12pt; color: var(--now-color--link-primary, #00718f); } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } すべて Cause<!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: var(--now-color--text-primary, #000000); } span { font-size: 12pt; font-family: Lato; color: var(--now-color--text-primary, #000000); } h2 { font-size: 24pt; font-family: Lato; color: var(--now-color--text-primary, black); } h3 { font-size: 18pt; font-family: Lato; color: var(--now-color--text-primary, black); } h4 { font-size: 14pt; font-family: Lato; color: var(--now-color--text-primary, black); } a { font-size: 12pt; font-family: Lato; color: var(--now-color--link-primary, #00718F); } a:hover { font-size: 12pt; color: var(--now-color--link-primary, #024F69); } a:target { font-size: 12pt; color: var(--now-color--link-primary, #032D42); } a:visited { font-size: 12pt; color: var(--now-color--link-primary, #00718f); } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } 1.拡張チャットには、デフォルトの「ai-sparkle-fill」アイコンを変更するためのすぐに利用可能な (OOB) オプションがありません。 Resolution<!-- /*NS Branding Styles*/ --> .ns-kb-css-body-editor-container { p { font-size: 12pt; font-family: Lato; color: var(--now-color--text-primary, #000000); } span { font-size: 12pt; font-family: Lato; color: var(--now-color--text-primary, #000000); } h2 { font-size: 24pt; font-family: Lato; color: var(--now-color--text-primary, black); } h3 { font-size: 18pt; font-family: Lato; color: var(--now-color--text-primary, black); } h4 { font-size: 14pt; font-family: Lato; color: var(--now-color--text-primary, black); } a { font-size: 12pt; font-family: Lato; color: var(--now-color--link-primary, #00718F); } a:hover { font-size: 12pt; color: var(--now-color--link-primary, #024F69); } a:target { font-size: 12pt; color: var(--now-color--link-primary, #032D42); } a:visited { font-size: 12pt; color: var(--now-color--link-primary, #00718f); } ul { font-size: 12pt; font-family: Lato; } li { font-size: 12pt; font-family: Lato; } img { display: ; max-width: ; width: ; height: ; } } 解決手順拡張チャットには、デフォルトの「ai-sparkle-fill」アイコンを変更するためのすぐに利用可能な (OOB) オプションがありません。拡張チャットのデフォルトのスタイリングでは、アイコンの表示とカスタマイズが制限されます。特定のテーマを使用すると、アイコンを適切に表示するために必要な CSS 変数がない場合があります。CSS を使用したカスタムアイコン置換1.カスタムアイコンをアップロード:[システム UI] > [画像] に移動し、目的のアイコンを「db_image」テーブルにアップロードします。互換性のために、画像が SVG 形式であることを確認してください。2.ポータルテーマの変更:ポータルのテーマ設定に移動します。CSS 変数「$now-sp-nass-FAB-icon」を [CSS] セクションに追加します。3.変更の実装:ポータルのテーマ設定内でこれらの変更を適用して、新しいアイコンがデフォルトに置き換わるようにします。4.欠落している CSS 変数への対処:「Stock」などのテーマを使用する場合は、次の CSS 変数が追加されていることを確認してください。詳細については、次の項目を参照してください。=> 拡張チャットの AI スパークルチャットアイコンの置き換え [仮想エージェントの Now Assist]アイコンのサイズを更新するには、次の手順を実行します。- 「Now Assist ダイアログ」ウィジェットに移動し、次のコードを追加してクライアントコントローラーをカスタマイズします。 function adjustFABSize(newScaleSize) { function deepSearchElement(selector, root) { root = root || document.body; var queue = [root]; while (queue.length > 0) { var top = queue.shift(); var ele = top.querySelector(selector); if (ele) return ele; var topShadow = top.shadowRoot; if (topShadow) queue.push(topShadow); var allSearched = top.querySelectorAll('*'); for (var i = 0; i < allSearched.length; i++) { if (allSearched[i].shadowRoot) { queue.push(allSearched[i].shadowRoot); } } } return null; } function waitForChild(parentEl, selector, callback, interval, timeout) { var elapsed = 0; var poll = setInterval(function () { try { var child = deepSearchElement(selector, parentEl); if (child) { clearInterval(poll); callback(child); } else if (timeout && (elapsed += interval) >= timeout) { clearInterval(poll); } } catch (e) { console.log("Issue in searching for the element"); } }, interval); } var insertStylesIntoElement = function (elm) { if (!elm || !elm.shadowRoot) return; var style = document.createElement('style'); style.type = 'text/css'; style.textContent = ':host{--now-icon--scale-size: ' + newScaleSize + ';}'; elm.shadowRoot.appendChild(style); } waitForChild($element[0], "sn-nass-sp-sparkle-icon", insertStylesIntoElement, 100, 10000); } // Adjust the value being passed according to the customer's need. adjustFABSize(2); アイコンサイズに関する注意:1.これは、カスタムイメージがテーマ変数 ($now-sp-nass-FAB-icon) を使用して既に構成されている場合にのみ機能します2.scaleSize に渡される値は、必要に応じて調整できます。