---
title: "プレビューおよびインスペクトコンポーネント"
slug: "preview-and-inspect-components"
abstract: "特定のブレークポイントでコンポーネントを表示したり、マッピングされたデータで各種コンポーネントレイアウトをプレビューしたり、隠れた要素の有無にかかわらずコンポーネントを検査したりできます。"
---
# プレビューおよびインスペクトコンポーネント

コンポーネントビルダーは、コンポーネントを視覚化するためのさまざまな方法を提供します。

コンポーネントの構築が完了すると、コンポーネントを表示するための2つのモードがあります。 **インスペクト** モードでは、隠された要素は見えますが利用できません。 **プレビュー** モードでは、ウェブページ上でレンダリングされるコンポーネントを見ることができます。マッピングされたデータを持つコンポーネントがある場合は、すべてのコンポーネントのレイアウトの繰り返しを表示することもできます。

## マッピングされたデータを用いたコンポーネントのプレビューレイアウト

コンポーネントを表示する方法はいくつかあります。例えば、コンポーネントにデータがマッピングされている場合、そのコンポーネントの繰り返しレイアウトをすべて見たいかもしれません。あるいは、変数を個別のデータに置き換えたコンポーネントを見たい場合もあります。

マッピングされたデータを含むコンポーネントのすべての繰り返しレイアウトを見るには:

-   **プレビュー**または**検査**メニューで「**すべてのデータ収集を表示**」をオンにしてください。

繰り返しレイアウトは、斜めの灰色のストライプ背景で元のレイアウトと区別されます。繰り返しレイアウトはプレビューのみ可能で、編集はできません。ただし、元のレイアウトのすべてのスタイル変更は繰り返しレイアウトに直接反映されます。

変数の代わりにデータソースからのデータを表示するコンポーネントを表示するには:

-   **プレビュー**または**検査**メニューで**「マッピングデータの表示**」をオンにします。

コンポーネントビルダーは **プレビュー** モードで、ウェブページ上でレンダリングされるすべてのコンポーネントレイアウトを確認できます。 **プレビュー** モードに入るには、以下の3つのスイッチがオンになっている必要があります:

-   **マッピングされたデータの表示**
-   **すべてのデータコレクションを表示**
-   **隠された要素を隠す**

これらのスイッチのうち1つ以上が選択されていない場合、コンポーネントビルダーは **検査モード**になります。

![Screenshot of the Preview / Inspect mode menu](https://doc.sitecore.com/api/markdown-image/sai/ja/users/sitecoreai/images/inspect_mode.png)