【ブロックテーマ入門②】サイトエディターの歩き方

ブロックテーマの醍醐味は、「サイトエディター」。これを使えば、本文だけでなく、ヘッダーもサイドバーも、サイト全体のデザインを丸ごとあなたの手でプロデュースできるようになります!

「中身(文章)」だけを卒業して、自分好みの「外枠(デザイン)」まで自由に操る第一歩。サイトエディターを探検してみましょう!

スポンサーリンク

「サイトエディター」を開いてみよう

操作の手順

  1. WordPressの管理画面(ダッシュボード)の左メニューから「外観」を選びます。
  2. その中にある「エディター」をクリックしてください。

「エディター」をクリックすると、一瞬、画面が暗くなり、今まで見ていた管理画面とは全く違う雰囲気の画面に切り替わります。
これが「サイトエディター」に入った証拠です。
左上の「アイコン」や「ブラウザの戻る」ボタンで、いつでも元の画面に帰れます。

2つの「状態」

エディターを開いてまず戸惑うのが、「画面が途中で切り替わること」ことかもしれません。
大きく分けて2つの「状態」があります。

1. 最初は「選択モード」

まずは左側のメニューから「ナビゲーション」「スタイル」「テンプレート」など、どこを直したいか選ぶ画面です。ここは、お家のリフォームでいう「どの部屋を直すか決める」段階です。


2. クリックすると「編集モード」へ

中央の画面をどこかクリックすると、いよいよ本番! 実際にブロックを動かす画面に切り替わります。ここで「投稿画面と同じような操作」ができるようになります。

選択モード:「玄関ホール」を理解しよう!

エディター画面の左側(玄関ホール)に並んでいる名前は、実は「3つの箱」のことなんです。

🌟 あなたが触る「箱」はどれ?

① 「固定ページ」の箱(中身)

中に入れる「おもちゃ」です
文章や写真など、そのページごとに自由に入れ替える 「中身(コンテンツ)」。のこと。

② 「テンプレート」の箱(間取り)

お部屋の「並べ方」です。
「右にサイドバー、左に本文」といった、ページ全体の配置を決める設計図のこと。

③ 「パターン(パーツ)」の箱(共通部品)

家中どこでも使う「窓やドア」です
ヘッダーやフッターなど、どのページでも使い回す 「共通のパーツ(テンプレートパーツ)」。「パターン」

🤔 「今、どこを触ってるか」迷ったら?

文字を書きたいなら ➔ ①の箱
並び方を変えたいなら ➔ ②の箱
屋根(ヘッダー)を直したいなら ➔ ③の箱

サイトエディターは「記事の型紙」を決める司令塔

「テンプレートとかテンプレートパーツとか、名前が似ていてややこしい!」と思ったら、3枚の透明なシートをイメージしてみてください。
この3枚を重ねて、1枚のブログ記事を完成させる「ルール」を決める場所、それがサイトエディターなんです。

1枚目:中身

① コンテンツ(記事の中身)

あなたが書いた「お手紙(本文)」そのもの。 ※編集はいつもの「投稿ページ」からやるのが一番スムーズです!

2枚目:間取り

② テンプレート(全体の設計図)

「本文はここ、サイドバーはここ」という配置のルール。「この記事はこのテンプレートで表示する!」と指定します。

3枚目:共通部品

③ テンプレートパーツ(屋根や土台)

ヘッダーやフッターなどの「使い回すパーツ」。これらをパズルのように組み合わせて、上の「②テンプレート」を完成させます。

「どのパーツを使って(③)、どんな間取りにして(②)、どの中身を流し込む(①)」
このセットメニューを決めています。

「テンプレートパーツ」と「パターン」の違いは

🧩 テンプレートパーツ

「お家の固定設備(ユニットバスなど)」

ヘッダーやフッターのように、場所が最初から決まっている「外枠」の部品です。一度セットしたら、基本的にはずっとそこにある、サイトの「顔」となる部分です。

🎨 パターン

「家具のセット(ダイニングセットなど)」

「自己紹介欄」や「おすすめ記事リスト」のように、好きな場所にポンと置ける「デザインの固まり」です。パズルのピースのように、記事の中の好きなところで使い回せます。

ざっくり言うと…
外側の枠なら ➔ テンプレートパーツ
中身のレイアウトなら ➔ パターン

編集モード:「机の形」を覚えよう

どこを直したいか決まれば、中央の画面をどこかクリックして「編集モード」に入ります。

「編集モード」に入ると、画面は役割ごとに整理されます。特に大切なのが、左側に表示される「リストビュー(構造)」です。

  • 左側 リストビュー(構造の地図)
    ヘッダー、コンテンツ、サイドバーなど、サイトの「骨組み」が並んでいます。
  • 中央 キャンバス(実際の見た目)
    文字を打ったり、画像を並べたりする作業机です。
  • 右側 設定パネル(細かい調整)
    色、サイズ、文字の大きさなどをいじる道具箱です。

左側:三本線「リストビュー」はGPS

📝

画面左上の「三本線アイコン」をポチッ!

これが「リストビュー」のスイッチです。ここを押すと、画面の左側にサイトの「骨組み(構造)」がズラリと表示されます。

「今、自分がどのパーツを触っているのか分からなくなった!」という時に、真っ先に押してほしいボタンです。

リストビューを表示すると、ヘッダーの中にロゴがあって、その下になんというブロックがあって……という「お家の家計図」のようなものが見えてきます。

💡 ここがポイント!

ブロックテーマでは、「箱の中に、さらに小さな箱が入っている」という構造(入れ子構造)になっています。画面上を直接クリックしてもうまく選べないときは、このリストビューからパーツの名前を選んでみてください。確実に「その場所」を捕まえることができますよ。

入れ子構造

まずは三本線を押して、ブロック名の左側の矢印をクリックして、入れ子構造を眺めてみてください。

右側:「設定パネル」は選んだブロックの性格を変える場所

パーツを選んだら、次は右側の「設定パネル」の出番です。ここは、選んだブロックの「色」「サイズ」「フォント」などを細かく調整する、いわば専用の道具箱です。

💡 触るものによって中身が変わる!

この道具箱の面白い(そして少しややこしい)ところは、「今、何を選んでいるか(ブロックの種類)」によって、道具箱の中身が替わることです。
画像を選べば「画像の明るさ」を変える道具が出てきますし、文字を選べば「文字の大きさ」を変える道具が出てきます。

⚠️ ここで迷子になりがち!「2つのタブ」の使い分け

設定パネルの一番上を見てください。「ブロック」「テンプレート(または固定ページ)」という2つのタブが並んでいませんか?

  • 「ブロック」タブ: いま選んでいる「そのパーツだけ」を直したいとき。
  • 「テンプレート」タブ: サイト全体の「外枠」や「共通設定」を直したいとき。

「色を変えたいのに、メニューが出てこない!」と思ったら、まずはこの右側のタブが『ブロック』になっているかを確認してみてください。これを知っているだけで、操作のイライラは半分以下になります!

💡 嬉しいお知らせ!

「3つのエリア」は、サイトのデザインを直すときも、いつものブログ記事を書く画面でも、同じ操作なんです。一度この「机の形」を覚えてしまえば、WordPressのどこへ行っても迷うことはありませんよ!

① 左側:リストビュー(地図)

サイトの「骨組み」を確認する場所です。「何をお直しするか」をここで選びます。

② 中央:キャンバス(作業机)

文字を打ったり、ブロックを並べたりするメインの場所です。見たままが形になります。

③ 右側:設定パネル(道具箱)

色やサイズを細かく調整するための道具が入っています。

「まずは左で場所を確認して、真ん中で作業して、右で整える」。この左・中・右のリズムさえ身につけば、あなたはもうブロックエディタの使い手です!

どっちを使う?投稿画面とサイトエディター

「結局、どこで編集すればいいの?」と迷ったら、お手紙をイメージしてみてください。

✍️

いつもの「投稿画面」

役割:お手紙の「文章」を書く

今日あったことや、伝えたいメッセージを書く場所です。中身だけを集中して書きたいときは、いつものここを使いましょう。

📐

サイトエディター

役割:便せんの「柄」を作る

「外枠をピンクにしたい」「ロゴを左に置きたい」など、全ページで使う便せんの柄(テンプレート)を新しく作るときに使います。

デザインそのものを作り直したい時だけ「サイトエディター」へ
文章を書くだけならいつもの「投稿画面」へ。これが迷子にならないコツです!

✨ ここがブロックテーマのすごいところ!

お手紙(文章)を書いたあとで、「今日はこのカッコいい便せん(テンプレート)に入れよう!」と、後からデザインをポチッと選んで着せ替えることができるんです。

🤔 ちょっと一言:投稿画面の「固定ページ」と「投稿」って何が違うの?

  • 投稿: 毎日のお手紙(ブログ日記など)。新しいものがどんどん上にきます。
  • 固定ページ: ずっと置いておく看板(自己紹介や連絡先など)。

まずは「どっちも中身(文章)を書く場所なんだな」と思っていれば、今日は100点です!

保存するときの「謎のチェックボックス」〜最後のお買い物確認〜

編集が終わって「保存」ボタンを押したとき。画面にズラッとチェックボックスが出てきて、「えっ、何これ!? 怖い!」と固まったことはありませんか?

🛒 これは「レジの最終確認」です!

ブロックテーマでは、「中身(文章)」と「外枠(デザイン)」を同時にいじることができるから、保存のときに「どっちを本番に反映させますか?」と聞いてくれるんです。

  • 「固定ページ」にチェック: 今日書いた「お手紙(中身)」を保存します。
  • 「ヘッダー」や「テンプレート」にチェック: デザインの「間取りや屋根」の変更を保存します。

「あれ? 記事を書いてる時はチェックボックスなんて出ないよ?」と思った方、大正解です! 実はあの確認画面が出るのは、「2つ以上の場所を同時にお直しした時」だけです。

✅ 出ないとき(いつもの投稿画面)

「お手紙の中身(文章)」だけを書いている時は、保存ボタンを押せばそのまま保存されます。確認の手間はありません。

⚠️ 出るとき(サイトエディター画面)

「文章を直しながら、ついでにヘッダー(屋根)の色も変えちゃった!」という時。WordPressが「中身と外枠、両方変えたけど、どっちも保存していいの?」と親切に聞いてくれるんです。

つまり、あのチェックボックスが出たときは「あ、私いま『中身』以外もいじったんだな」という合図です!

失敗しても安心!『リセットボタン』の場所

「あちこち触りすぎて、デザインがめちゃくちゃになっちゃった!」「元の綺麗な状態に戻したい……」

そんなとき、ブロックテーマには「最初の状態」に一瞬で巻き戻せる魔法のボタンがあります。

🪄 デザインをリセットする手順

  1. 画面左側のメニュー(玄関ホール)で、直したい「テンプレート」「パターン」を選びます。
  2. 名前の右側にある「3つの点(︙)」をクリックします。
  3. 「カスタマイズをクリア」を選びます。これだけで、一瞬でお買い上げ時のピカピカの状態に戻ります!

このボタンは「デザイン(外枠)」をリセットするものです。あなたが一生懸命書いた「記事の中身(文章)」まで消えることはないです

🤔 ちょっと一言:実はWordPressには、「リセットできるもの」と「できないもの」の明確なルールがあります。

種類 リセットボタン 理由
テーマ備え付けの部品
(Header, Footer, Single)
出る 「家(テーマ)に最初からあった家具」だから、テーマの標準装備パターンを含め、それらは元の状態に戻せます。
自分で追加したパターン
(公式からのコピー品も含む)
出ない 公式からレシピを借りても、自分で保存した瞬間、それはあなたの「オリジナル作品」。比べる「元のお手本」がテーマ内にないからです。

💡 自分のパターンをやり直したい時は?

リセットボタンがないときの、代替え案。

  • リビジョン: メニューにある「リビジョンを表示」から、過去の自分が保存した時点まで巻き戻せます。
  • 再インポート:公式ライブラリからもってきたものは、思い切って一度削除してもう一どコピペする!

🚀テンプレートを深堀する

テンプレートを制するものは、ブロックテーマを制す😊
理由は、テンプレートのルール(テンプレート階層)がサイト全体の「骨組みとルール」を決めているからです。

  • どのページにどのデザインが適用されるのか?(優先順位)
  • 一部のページだけデザインを変えるにはどうするか?(カスタムテンプレート)

この仕組み(ロジック)を理解してしまえば、もう「設定を変えたのに反映されない!」「どこを触ればいいかわからない!」と迷走することはありません。

【2026年版】テンプレート完全攻略ガイドを読む

※2022年の記事を、最新のWordPress仕様にフルリライトしました!

スポンサーリンク