ガイド/サイトをカスタマイズ/エディター/コンテンツをプレビューする

コンテンツをプレビューする

WordPress エディターでコンテンツを編集する際にプレビューオプションを使用すると、そのコンテンツがサイトに適用されたテーマでどのように表示されるかを確認できます。このガイドでは、ページや投稿のプレビューを表示して、変更内容がサイト上でどのように見えるかを確認する方法を説明します。

ページまたは投稿をプレビューする

サイトのページや投稿のコンテンツは WordPress エディターで追加、編集しますが、サイト上でどのようには表示されるかはサイトのテーマによって決まります。ページまたは投稿をプレビューして、サイトのコンテンツがテーマの書式設定要素がすべて適用された状態ではどのように表示されるかを確認できます。

エディターからページや投稿をプレビューするには、次の手順を実行します。

  1. サイトのダッシュボードにアクセスします。
  2. 「固定ページ」または「投稿」をクリックします。
  3. プレビューするページまたは投稿のタイトルをクリックしてエディターで開きます。
  4. 画面上部の「表示」アイコン (「公開」ボタンの横にある開いたノートパソコンのようなアイコン) をクリックします (ページ/投稿がすでに公開されている場合は「保存」ボタンの横にあります)。
  5. 「新しいタブでプレビュー」オプションを選択します。
An arrow from the "View" icon to the "Preview in new tab" menu item.
新しいタブでプレビュー

新しいブラウザータブでページまたは投稿のプレビューが開き、コンテンツがサイトでどのように見えるかを確認できます。プレビュー後にエディターで変更を加えた場合、ページまたは投稿のプレビューに適用された変更を確認するには、「下書きを保存」(下書き投稿の場合) または「保存」(公開済み投稿の場合) をクリックして、プレビューが表示されたブラウザータブを再読み込みする必要があります。

エディター画面の形式を変更する

また、「表示」メニューで次の手順を実行すると、 WordPress エディターがコンテンツの表示に使用する形式を変更できます。

  1. サイトのダッシュボードにアクセスします。
  2. 「固定ページ」または「投稿」をクリックします。
  3. プレビューするページまたは投稿のタイトルをクリックしてエディターで開きます。
  4. 画面上部の「表示」アイコン (「公開」ボタンの横にある開いたノートパソコンの形のアイコン) をクリックします。
  5. 表示メニューの「デスクトップ」「タブレット」「モバイル」からいずれのオプションを選択します。

テンプレート内のコンテンツを表示する

ページまたは投稿の編集時にテンプレートを表示するオプションを有効または無効にできます。テンプレートを表示すると、コンテンツがサイトのデザインにどのように組み込まれるかをイメージしやすくなります。または、テンプレートのプレビューをオフにして編集に集中することもできます。

テンプレートのプレビューを有効または無効にするには、次の手順を実行します。

  1. サイトのダッシュボードにアクセスします。
  2. 「固定ページ」または「投稿」をクリックします。
  3. プレビューするページまたは投稿のタイトルをクリックしてエディターで開きます。
  4. 画面上部の「表示」アイコン (「公開」ボタンの横にある開いたノートパソコンのようなアイコン) をクリックします (ページ/投稿がすでに公開されている場合は「保存」ボタンの横にあります)。
  5. 「テンプレートを表示」を選択します。

「テンプレートを表示」の横にチェックマークが表示されていれば、テンプレートのプレビューがオンになっています。「テンプレートを表示」の横にチェックマークがない場合、テンプレートのプレビューはオフの状態で、ページまたは投稿のコンテンツのみが表示されます。

An arrow pointing from the "View" icon to the "Show template" menu item.
テンプレートを表示

テンプレートを直接編集する場合、テンプレートを表示するオプションは表示されません。たとえば、多くのテーマではホームページ自体がテンプレートです。

動画チュートリアル

以下の動画では、WordPress エディターからページのテンプレートをプレビューする方法を説明しています。「テンプレートを表示」オプションを選択すると、エディターにヘッダーとフッターが表示され、サイト上でページ全体がどのように表示されるかを確認できます。

再生をクリックした後、右下のコントロールで動画の再生速度を調整できます
Copied to clipboard!