# スタイリング シート

シートのスタイルをカスタマイズしたり、タイトルと説明を変更したり、シートがアプリケーションに表示される条件を追加したり、シート サムネイルを追加したりすることができます。

## シートのタイトルと説明の変更

シートのタイトルと説明は、いつでも変更できます。固定のシートのタイトルを使用することも、数式に基づく動的なシートのタイトルを使用することもできます。

次の手順を実行します。

1. アプリケーション概要から、the アプリ オブジェクト icon をクリックしてシートを表示します。
2. 次のいずれかを実行します。
   * グリッド ビュー the グリッド ビュー icon の場合は、シート タイトルを選択し、the [編集] icon をクリックします。
   * リスト ビュー the リスト ビュー icon の場合は、the [編集] icon をクリックします。
3. [タイトル] と [説明] を編集します。
4. テキスト エリアの外側をクリックします。

変更内容を保存します。

ヒント メモシートのタイトルと説明は、シートのプロパティ パネルで変更することもできます。

### 動的なシートのタイトルの使用

シート プロパティ パネルの [タイトルの数式] プロパティで、数式に基づいて動的なシートのタイトルを設定できます。有効なチャートの数式を使用することができます。詳細については、「[ビジュアライゼーションにおける数式の使用](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Sense_Hub/ChartFunctions/use-expressions-in-visualizations.htm)」を参照してください。

動的なシートのタイトルを設定する場合、固定のタイトル ([タイトル]) は使用されません。

[式を使用した動的なシートのタイトルの作成](https://share.vidyard.com/watch/5uRpbAWBn8RRWqoo4G4ndh)

## ツール バー、シート ヘッダー、アプリケーションのナビゲーション バー オプションを非表示にする

アプリケーションのツール バーとシート ヘッダーを非表示にできます。非表示にすると、権限に関係なく、これらの領域はどのユーザーに対してもどのシートにも表示されません。アプリケーションで編集可能権限を持つユーザーは、これらの要素をオン/オフに切り替えることができます。アプリケーションのナビゲーション バー、ツール バー、シート ヘッダーの個々の要素を非表示にすることもできます。

### ツール バー

ツールバーは、次のボタンを含むシートの上に領域にあります。

* アセット

* シート

* ブックマーク

* Insight Advisor

* スマート検索 (the スマート検索 icon)

* 選択ボタン:

  * [1 段階戻る] 選択 (the 1 段階戻る icon)

  * [1 段階進む] 選択 (the 1 段階進む icon)

  * 選択をすべてクリアする (the 選択をすべてクリア icon)

* 選択ツール (the 選択ツール icon)

* シートの編集

必要に応じて、 [アセット]、 [シート]、 [ブックマーク] のボタンをツール バーから非表示にすることができます。[アセット] を削除すると、 [シート] と [ブックマーク] はアセット パネルなしで表示されます。

次の手順を実行します。

1. アプリケーション ナビゲーション バーで the 詳細 icon をクリックし、the 設定 icon [] をクリックします。

2. メニューで [UI 設定] タブに切り替えます。

3. 

   次のいずれかを実行します。

   * ツール バーを非表示にするには、 [ツール バー] をオフにします。
   * [アセット] を非表示にするには、 [ツール バー] で [アセット] を選択します。
   * [シート] を非表示にするには、 [ツール バー] で [シート] を選択します。
   * [ブックマーク] を非表示にするには、 [ツール バー] で [ブックマーク] を選択します。

4. [完了] をクリックします。

### シート ヘッダー

シートヘッダーとは、シート上の領域で、シートタイトル、タイトル画像、シートナビゲーション矢印が含まれます。

シート ヘッダーを非表示にすると、ナビゲーション矢印はツール バーに移動します。

必要に応じて、シート タイトルを非表示にできます。

次の手順を実行します。

1. アプリケーション ナビゲーション バーで the 詳細 icon をクリックし、the 設定 icon [] をクリックします。

2. メニューで [UI 設定] タブに切り替えます。

3. 

   次のいずれかを実行します。

   * シート ヘッダーを非表示にするには、 [シート ヘッダー] をオフにします。
   * シート タイトルを非表示にするには、 [シート ヘッダー] で [シート タイトル] を選択します。

4. [完了] をクリックします。

### アプリケーションのナビゲーション バー

必要に応じて、アプリケーションのナビゲーション バーで次のオプションを非表示にできます。

* ロゴ

* ナビゲーション

* Insight Advisor に質問

* リソース センター

* 通知

* プロファイル

次の手順を実行します。

1. アプリケーション ナビゲーション バーで the 詳細 icon をクリックし、the 設定 icon [] をクリックします。

2. メニューで [UI 設定] タブに切り替えます。

3. [アプリのナビゲーション バー]で、アプリケーションのナビゲーション バーで非表示にするオプションを選択します。

4. [完了] をクリックします。

### アプリケーションのインターフェイス要素を非表示にするタイミング

#### 長所

ツールバーやシート ヘッダーを隠すことで、チャートやフィルター パネルなどのスペースが確保できます。

シートヘッダーをオフにすると、シートのダウンロードや共有、サブスクリプションの送信、Qlik Automate レポートの作成時に、この領域が表示されなくなります。これは、シートを使って PowerPoint プレゼンテーションやダッシュボードを作成する場合に便利です。

ツールバーを削除すると、他のユーザーが簡単にアクセスできる機能を、アプリケーション開発者によるコントロールが向上します。たとえば、[シートの編集] ボタンを非表示すると、他のアプリケーション開発者がアプリを編集しにくくなります。

#### 短所

ツールバーを非表示にしても、ブックマーク、メモ、Insight Advisor、シート編集などの機能は完全に削除されません。たとえば、ブックマークはこれまで通りアプリケーションの概要で確認することができます。しかし、アプリケーション消費者は、これらの機能が使えなくなったと思うかもしれません。

ツールバーとシート ヘッダーを非表示にすると、シート間をナビゲーションする唯一の方法はキーボード ショートカットかボタン オブジェクトです。詳しくは「[アプリのキーボード ナビゲーションとショートカット](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Sense_Hub/UserInterface/keyboard-navigation-and-shortcuts.htm)」と「[ボタンの作成](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Sense_Hub/Visualizations/Button/create-buttons.htm)」を参照してください。

選択領域が非表示になっている場合、ユーザーは選択がアプリケーションに適用されていることに気づかない可能性があります。シートにフィルター パネルを追加したり、個々のチャートにフィルターを追加したりする必要がある場合があります。詳細については、「[フィルター パネルの作成](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Sense_Hub/Visualizations/FilterPane/create-filter-panes.htm)」および「[ビジュアライゼーションにフィルターを適用する](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Sense_Hub/Sheets/visualization-filters.htm)」を参照してください。

### 例

ツールバーとシート ヘッダーが表示されたシート。ツールバーには、メモ、Insight Advisor、現在の選択などが表示されます。シート ヘッダーには、シート タイトル、タイトル画像、シート ナビゲーション矢印が含まれます。

ツールバーとシート ヘッダーが表示されたシート。ツールバーには、メモ、Insight Advisor、現在の選択などが表示されます。シート ヘッダーには、シート タイトル、タイトル画像、シート ナビゲーション矢印が含まれます。

ツールバーとシート ヘッダーが表示されたシート。ツールバーには、メモ、Insight Advisor、現在の選択などが表示されます。シート ヘッダーには、シート タイトル、タイトル画像、シート ナビゲーション矢印が含まれます。![ツールバーとシート ヘッダーが上に表示されている Qlik Sense シート。](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Resources/Images/ui_DashboardSheet_HeaderandToolbar_shown-dev-rev.png)

上記と同じシートですが、ツールバーが表示され、シート ヘッダーが非表示となっています。ユーザーにタイトル画像、シート タイトル、ナビゲーション矢印が表示されなくなります。

上記と同じシートですが、ツールバーが表示され、シート ヘッダーが非表示となっています。ユーザーにタイトル画像、シート タイトル、ナビゲーション矢印が表示されなくなります。

上記と同じシートですが、ツールバーが表示され、シート ヘッダーが非表示となっています。ユーザーにタイトル画像、シート タイトル、ナビゲーション矢印が表示されなくなります。![シート ヘッダーが非表示となっている Qlik Sense シート。](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Resources/Images/ui_DashboardSheet_Toolbar_shown-rev2.png)

上記と同じシートですが、シート ヘッダーが表示され、ツールバーが非表示となっています。どの選択が適用されたか見えません。

上記と同じシートですが、シート ヘッダーが表示され、ツールバーが非表示となっています。どの選択が適用されたか見えません。

上記と同じシートですが、シート ヘッダーが表示され、ツールバーが非表示となっています。どの選択が適用されたか見えません。![シート ヘッダーが非表示となっている Qlik Sense シート。](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Resources/Images/ui_DashboardSheet_Header_shown-rev2.png)

上記と同じシートですが、シート ヘッダーとツールバー両方が非表示となっています。

上記と同じシートですが、シート ヘッダーとツールバー両方が非表示となっています。

上記と同じシートですが、シート ヘッダーとツールバー両方が非表示となっています。![ツールバーとシート ヘッダーが非表示となってる Qlik Sense シート。](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Resources/Images/ui_DashboardSheet_HeaderandToolbar_allhidden-rev2.png)

## カスタム ロゴの追加

アプリケーションのナビゲーション バーにカスタム ロゴを追加できます。これらは、テナントのナビゲーション バーに設定されているロゴを置き換えます。

次の手順を実行します。

1. アプリケーション ナビゲーション バーで the 詳細 icon をクリックし、the 設定 icon[] をクリックします。

2. メニューで [UI 設定] タブに切り替えます。

3. [アプリのナビゲーション バー] で、the パレット icon をクリックします。

4. [ロゴ] で、the パレット icon をクリックします。

5. 既存の画像を選択するか、新しい画像をアップロードします。

6. [挿入] をクリックします。

## アプリケーションのナビゲーション バーのスタイル指定

アプリケーションのナビゲーション バーをカスタム カラーでスタイル指定できます。

次の手順を実行します。

1. アプリケーション ナビゲーション バーで the 詳細 icon をクリックし、the 設定 icon [] をクリックします。

2. メニューで [UI 設定] タブに切り替えます。

3. [アプリのナビゲーション バー] で、the パレット icon をクリックします。

4. [オプション] で、 [背景色] と [前景色] を設定します。

5. [完了] をクリックします。

## シートの表示条件の設定

数式の評価が true か false かに応じて、アプリケーションでシートを表示または非表示にするには、 [条件の表示] で条件を設定できます。シートは数式が true と評価された場合にのみ表示されます。シートを非表示にしても、アプリケーション内のデータが非表示になったり除外されたりすることはありません。

例えば、特定の値がデータに存在する場合にのみ使用できるシートを作成できます。通常、if 関数を使用する必要があります。詳細については、「[if スクリプトおよびチャート関数](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Sense_Hub/Scripting/ConditionalFunctions/if.htm)」を参照してください。

[シートの表示条件の設定](https://share.vidyard.com/watch/MkupcjehFZn4j4w83eGgKU)

## シート サムネイルの変更

アプリケーション概要およびアセット パネルでシートを見分けやすくするために、既定のサムネイルを置き換えることができます。シートの画像を生成することも、既定の画像のいずれかまたは自分の画像を使用することもできます。

次の点に注意してください。

* .png、.jpg、.jpeg、.gif の形式がサポートされています。
* サムネイルの最適な縦横比は 8:5 (幅:高さ) です。
* プライベート シートのサムネイルに対して実行できるのは、追加または変更のみです。

次の手順を実行します。

1. アプリケーション概要から、the アプリ オブジェクト icon をクリックしてシートを表示します。
2. 次のいずれかを実行します。
   * グリッド ビュー the グリッド ビュー icon の場合は、シート タイトルを選択し、the [編集] icon をクリックします。
   * リスト ビュー the リスト ビュー icon の場合は、the [編集] icon をクリックします。
3. 次のいずれかを実行します。
   * シートに基づいてサムネイルを生成する場合は、the 生成 icon をクリックします。

   * サムネイル画像を選択する場合は、次の手順を実行します。

     1. デフォルトのサムネイル上にある the 画像 icon をクリックします。

     2. [メディア ライブラリ] が開きます。

     3. シートのサムネイルとして使用する画像を選択し、[挿入] をクリックします。

     4. 編集を中止するには、the チェックマーク icon をクリックします。

選択した画像がシートのサムネイルとして使用され、アセット パネルとアプリケーション概要に表示されます。

ヒント メモシートのサムネイルは、アセット パネルまたはシート プロパティ パネルでも変更できます。

詳細については、[Qlik Sense サイトの管理: コンテンツ ライブラリにオブジェクトをアップロード](https://help.qlik.com/ja-JP/sense-admin/May2026/Subsystems/DeployAdministerQSE/Content/Sense_DeployAdminister/QSEoW/Administer_QSEoW/Managing_QSEoW/upload-objects-to-content-libraries.htm)(英語のみ) を参照してください。

Govnote-not-inQlik Cloud Government では対応していません。

## 背景色または画像の追加

シートの背景をカスタマイズできます。特定の背景色を選択したり、数式ごとに色分けしたりできます。メディア ライブラリの画像はどれも背景として設定できます。画像が全体の背景に合わない場合は、配置とサイズを変更できます。

[Adding background color and image to sheets](https://play.vidyard.com/3xzkcgPz171SVjEcvom79V)

.png、.jpg、.jpeg、.gif の形式がサポートされています。.gif を使用する場合は、動画にも静止画にもできます。

Qlik Cloud Government に関する注意

Qlik Cloud Government はシート内の背景画像や色をサポートしていません。

次の手順を実行します。

1. 編集モードでシートを開きます。

2. [シート プロパティ] で、[スタイリング] をクリックします。

3. [背景] を [カスタム] に設定します。デフォルトでは [自動] になっています。

4. 背景色:

   * 単色: 色選択ツールを使用して色を選択します。

   * 数式を使用: ユーザー定義の数式を使用する色を設定します。詳細は、[数式による色分け](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Sense_Hub/Colors/color-by-expression.htm)をご覧ください。

5. 背景画像: メディア ライブラリから画像を選択します。既定では [なし] になっています。

6. デフォルトのサムネイル上にある the 画像 icon をクリックします。

   [メディア ライブラリ] が開きます。

7. 使用する画像を選択し、[挿入] をクリックします。

   必要な画像がメディア ライブラリにない場合は、 [新しいアップロード] をクリックして画像を追加します。

8. ドロップ ダウンで画像のサイズを変更します:

   * 元のサイズ
   * 常に適合
   * 幅に合わせる
   * 高さに合わせる
   * 縮小/拡大して合わせる
   * 常にページ幅に合わせる

9. [位置] で、画像の配置を変更できます。例えば、画像をシートの中央や右上隅にできます。

選択した画像と背景色がシートに表示されるようになります。

[編集] モードのシート、左に設定された背景画像

[編集] モードのシート、左に設定された背景画像

[編集] モードのシート、左に設定された背景画像![編集モードのシートです。](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Resources/Images/ui_sheet-background-image.png)

## CSS によるシート スタイルのカスタマイズ

CSS で個々のシートのスタイルをカスタマイズできます。これは、テーマでカバーされていない要素をカスタマイズできるようにすることで、カスタム テーマを補完するのに役立ちます。カスタマイズされたシート スタイルは、アプリケーションに適用されたテーマのスタイルを上書きするためにも使用できます。

警告メモ

CSS のシート スタイルの使用はできるだけ少なくすることが推奨されます。カスタム CSS の代わりに、可能な限り利用可能なスタイル プロパティとスタイル オプションを使用することをお勧めします。

CSS スタイルは、他の選択肢がない場合にのみ使用するのが最適です。どのシートの CSS 構造も静的ではなく、API でもなく、いつでも変わる可能性があります。CSS スタイルは最小限にとどめ、それが正しいことを確認し、変更によってそれが崩れても簡単に修正できるようにしてください。

シートに適用されるカスタム CSS スタイルは、レポートには含まれません。

[Customizing css styling for sheets](https://play.vidyard.com/VXQuqYd7LMTwGk9L16LPZw)

カスタム テーマについては、「[カスタム テーマ](https://help.qlik.com/ja-JP/cloud-services/Subsystems/Hub/Content/Sense_Hub/Apps/style-app.htm#Custom)」をご覧ください。

次の手順を実行します。

1. 編集モードでシートを開きます。
2. [シート プロパティ] で、[スタイリング] をクリックします。
3. [カスタム スタイル] を [アクティブ] に設定します。
4. 入力ボックスに CSS スタイルを入力します。

### 制限事項

シートのカスタムCSSスタイルにはいくつかの制限があります。追加された CSS は解析され、アプリケーションの機能を隠したり壊したりする要素を削除して無視するようにサニタイズされます。サポートされていない CSS を入力した場合は通知されます。フォローでは、スタイル シートに CSS を使用する際の制限について概説します:

* `font-size` は 18px より大きくできません。

* HTML タグはサポートされていません。

* 以下のセレクタは使用できません。

  * 疑似セレクタ

  * ルート セレクタ

  * \* セレクタ

* 以下の @ ルールはサポートされていません。

  * `charset`

  * `color-profile`

  * `counter-style`

  * `font-face`

  * `font-feature-values`

  * `font-palette-values`

  * `import`

  * `keyframes`

  * `media`

  * `namespace`

  * `page`

  * `position-try`

  * `property`

* インジェクションは許可されていません。

* `display:none` は、カスタムのユーザー定義要素またはクラスに対してのみサポートされています。

* コメントは適用されません。

* カスタム CSS スタイルは、Qlik Analytics モバイル アプリのアプリケーションではサポートされていません。

* シートに適用されるカスタム CSS スタイルは、レポートには含まれません。