---
url: "/ja/weblify/inspect/preview.md"
description: "WeblifyのPreviewタブでは、生成されたWebサイトがさまざまなビューポートサイズでどのように表示されるかを確認できます。"
---

# 生成されたWebサイトのコードをプレビューする

> WeblifyのPreviewタブでは、生成されたWebサイトがさまざまなビューポートサイズでどのように表示されるかを確認できます。

[Video](/assets/videos/weblify/inspect/preview-code.mp4)

**Preview**タブを開くと、現在のWeblifyのWebサイトがHTMLとCSSとしてレンダリングされます。パネル上部のページメニューで、プレビューするページを選びます。**Add**や**Style**に戻って変更を加え、もう一度**Preview**を開くと、更新された結果を確認できます。プレビューを更新するには **↻** を選択します。

## プレビューのビューポート幅を変更する {#changing-the-preview-viewport-width}

**Desktop**、**Tablet**、**Mobile**を選択するとプリセットの幅で、**Fit**を選択するとプラグインのパネルの幅に合わせてプレビューできます。Weblifyは選択内容を記憶します。幅の広いプレビューは、パネルに収まるように縮小表示されます。