サービスポータル の AI 検索 用のテーマを上書きする CSS インクルードを作成

会社のブランディングに合わせて、サービスポータルAI 検索テーマを上書きします。

始める前に

必要なロール：sp_admin または admin

このタスクについて

サービスポータル のAI 検索のスタイリング機能の例として、この手順では検索フィルターの周囲の境界線を削除し、。追加の CSS 変数を使用して、他のいくつかの機能をスタイル設定できます。これらの変数の詳細については、「 サービスポータル の AI 検索 のテーマ作成」を参照してください。

検索フィルター:検索フィルターの周囲の境界線を削除します。

手順

1. スタイルシートレコードを作成します。
   1. フィルターナビゲーターに「sp_css.do 」と入力します。
   2. フォームのフィールドに入力します。

      表 : 1. スタイルシートフォーム

      フィールド	説明
      名前	スタイルシートの一意の名前。たとえば、sp_ais.css。
      CSS	CSS コードのフィールド。このコードを入力し、変数をカスタマイズします。 検索フィルターパネルの境界線を削除するには、このコードを貼り付けて必要に応じてカスタマイズします。 sn-search-facets { --now-color--divider-tertiary: 0px !important; }
      アプリケーション	このスタイルシートに適用されるアプリケーション 。グローバルとは、スタイルシートがすべてのアプリケーションに適用されることを意味します。

   3. [送信] を選択します。
2. CSS インクルードレコードを作成します。
   1. フィルターナビゲーターに「sp_css_include.do 」と入力します。
   2. フォームのフィールドに入力します。

      表 : 2. CSS インクルードフォーム

      フィールド	説明
      名前	CSS インクルードレコードの一意の名前。
      ソース	CSS インクルードのソース。スタイルシートを選択します。
      スタイル シート	この CSS インクルードフォームに組み込むスタイルシート。ステップ 1 で作成したスタイルシートを選択します。
      アプリケーション	この CSS インクルードレコードが適用されるアプリケーション。グローバルとは、CSS インクルードがすべてのアプリケーションに適用されることを意味します。
      遅延ロード	CSS インクルードを非同期にロードしてページのロード時間を短縮するオプション。このオプションはテーマのすべての CSS インクルードに対して同じ値に設定する必要があります。テーマに関連付けられた一部の CSS インクルードに対してのみ非同期ロードを有効にすることはお勧めしません。 注: スタイル設定されていないコンテンツが点滅しているポータルで [遅延ロード] を有効にすることはお勧めしません。 [遅延ロード] が有効になっている CSS インクルードは、テーマレコードの [遅延ロード CSS インクルード] 関連リストに一覧表示されます。

3. CSS 上書きをスタイルシートフォームに入力し、UI に適用されるテーマを上書きします。
   1. フィルターナビゲーターに「m2m_sp_theme_css_include」と入力します。
   2. フォームのフィールドに入力します。

      表 : 3. スタイルシートフォーム

      フィールド	説明
      順番	他のスタイルシートに対してこのスタイルシートの組み込みを優先する整数。数字が小さいほど、リスト内の順序が高くなります。一般的には、これらの数字を 100、200、300、400 などのように数百にし、将来既存のアイコンの間に新しいアイコンを配置できるようにします。
      CSS インクルード	前の手順で作成した上書きを含む CSS インクルード。
      アプリケーション	このスタイルシートに適用されるアプリケーション 。グローバルとは、スタイルシートがすべてのアプリケーションに適用されることを意味します。
      テーマ	上書きする UI に適用されるテーマ。

   3. [送信] を選択します。

タスクの結果

検索フィルターの周囲の境界線が削除され。

• サービスポータル の AI 検索 のテーマ作成
  関連する CSS 変数を更新することで、サービスポータル の AI 検索 エクスペリエンスの外観と操作感をカスタマイズできます。