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

  • リリースバージョン: Australia
  • 更新日 2026年03月12日
  • 所要時間：5分

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

    始める前に

    必要なロール：admin

    このタスクについて

    重要:
    ワークスペースの空ステータスの画像をカスタマイズできますが、 コア UIでのカスタマイズはサポートされていません。

    手順

    1. 移動先 すべて > Now Experience フレームワーク > テーマ > UX テーマ.
    2. [UX テーマ] テーブルからテーマを選択します。
      選択したテーマの UX テーマレコードが表示されます。
    3. [ Compositional App Theme ] タブから [ 画像] レコードを選択します。
    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 を参照してください。

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