テーマに合わせてテーマ可能な空ステータスの画像をカスタマイズ

テーマの画像レコードを使用して、 ネクストエクスペリエンス テーマと テーマビルダー テーマのデフォルトのテーマ可能な空ステータスの画像をカスタマイズします。

始める前に

必要なロール：admin

手順

1. 次のように移動する。 All (すべて) > Now Experience フレームワーク > テーマ > UX テーマ.
2. UX テーマテーブルからテーマを選択します。
   選択したテーマの UX テーマレコードが表示されます。
3. [作成アプリのテーマ] タブから、画像レコードを選択します。
4. 画像スタイルレコードから、次の空ステータスの画像テーマフックを [スタイル ] フィールドに入力します。

   {
       "properties": {
           "--now-illustration--add-attachment-sm--url": "",
           "--now-illustration--add-attachment-md--url": "",
           "--now-illustration--add-attachment-lg--url": "",
           "--now-illustration--add-data-sm--url": "",
           "--now-illustration--add-data-md--url": "",
           "--now-illustration--add-data-lg--url": "",
           "--now-illustration--completed-tasks-sm--url": "",
           "--now-illustration--completed-tasks-md--url": "",
           "--now-illustration--completed-tasks-lg--url": "",
           "--now-illustration--error-sm--url": "",
           "--now-illustration--error-md--url": "",
           "--now-illustration--error-lg--url": "",
           "--now-illustration--first-time-user-sm--url": "",
           "--now-illustration--first-time-user-md--url": ""
           "--now-illustration--first-time-user-lg--url": "",
           "--now-illustration--interrupted-sm--url": "",
           "--now-illustration--interrupted-md--url": "",
           "--now-illustration--interrupted-lg--url": "",
           "--now-illustration--no-data-sm--url": "",
           "--now-illustration--no-data-md--url": "",
           "--now-illustration--no-data-lg--url": "",
           "--now-illustration--no-search-results-sm--url": "",
           "--now-illustration--no-search-results-md--url": "",
           "--now-illustration--no-search-results-lg--url": "",
           "--now-illustration--offline-sm--url": "",
           "--now-illustration--offline-md--url": "",
           "--now-illustration--offline-lg--url": "",
           "--now-illustration--permissions-sm--url": "",
           "--now-illustration--permissions-md--url": "",
           "--now-illustration--permissions-lg--url": "",
           "--now-illustration--unconfigured-sm--url": "",
           "--now-illustration--unconfigured-md--url": "",
           "--now-illustration--unconfigured-lg--url": "",
           "--now-illustration--no-activities-sm--url": "",
           "--now-illustration--no-activities-md--url": "",
           "--now-illustration--no-activities-lg--url": "",
       }
   }

5. 次のいずれかの方法でカスタム画像を追加します。
   • UX スタイルアセットリストに画像を追加します。
     1. UX スタイル資産 タブで、新規 を選択します。
     2. 資産アイテムの横にあるルックアップアイコン (
     3. [UX テーマ資産] リストで、[ 新規] を選択します。
     4. [添付ファイルを管理] アイコン ( ) を選択して、画像を追加します。
     5. 画像アセットがアップロードされたら、[添付ファイル] ウィンドウを閉じます。
        注:

        画像が SVG 形式であることを確認します。
     6. [ 名前 ] フィールドに資産のファイル名を入力し、[ 送信] を選択します。資産が [UX スタイル資産] リストに追加されます。
     7. [UX スタイル資産] リストから資産を選択して長押し (または右クリック) し、[ sys_idのコピー] を選択します。
     8. 「/uxta/ENTERYOURSYSID.assetx」の形式で [スタイル] フィールドにsys_idを入力します
   • カスタム画像を画像 [db_images_list.do] テーブルに追加します。
     注:

     画像が SVG 形式であることを確認します。
     1. 詳細な手順については、「1 つ以上の画像をアップロード」を参照してください。
     2. 画像スタイルレコードから、「 /FILENAME.svg」の形式で画像ファイル名を [スタイル] フィールドに入力します。
6. [Update (更新)] を選択します。
   カスタム画像がテーマに表示されます。
7. オプション: テーマに関連付けられた UX スタイルカラーレコードを使用して空ステータスの画像の色をカスタマイズし、デフォルトのテーマフックを上書きします。

   UX スタイルのカラーレコードの編集に関するステップバイステップのチュートリアルについては、ServiceNow コミュニティの ネクストエクスペリエンスワークショップ の演習 3、アクティビティ 2、3 を参照してください。

   注:

   デフォルトのテーマフックを使用することをお勧めします。