「ヘッダーのメニュー、クライアント側で並べ替えられますか」。ヘッドレスCMSの構成を提案すると、ディレクターからほぼ必ずこの確認が入ります。WordPressの「メニュー」画面に慣れていれば当然の質問で、WordPressから移行するときにも一度立ち止まる論点。答えはできます。ただし全部を渡すのは勧めません。

CMSで編集できるのは記事や固定ページの本文だけ、と思われがちなのがヘッダーのナビ、サイト名、フッターの文言といった本文の外側。ここをどう設計しておくかで、公開後に飛んでくるここも自分で変えたいの数が変わります。

本文の外側は3つに分かれる

EmDashを例にすると、本文の外側は次の3つで扱います（本文の中を拡張する話は別記事に書きました）。

  • メニュー — ヘッダーやフッターのリンクの並び。管理画面（/_emdash/admin/menus）で順番と階層を編集し、テンプレートからは getMenu("primary") で読みます。項目の種類はページ・投稿・タクソノミー・コレクション一覧・カスタムURLの5つ。ページや投稿を指した項目は /{コレクション}/{スラッグ} に自動で解決され、項目に子をぶら下げればドロップダウンになります。
  • サイト設定 — サイト名、タグライン、ロゴ、ファビコン、正規URL、1ページあたりの表示件数、日付書式、タイムゾーン、SNSアカウント、SEOの既定値。getSiteSettings() でまとめて取れます。
  • ウィジェットエリア — テンプレート側で名前をつけた領域（サイドバー、フッターの1列目など）に、管理画面から中身を差し込む仕組み。入るのはリッチテキスト、メニュー、登録済みコンポーネント（最近の投稿、カテゴリ一覧、検索フォームなど）の3種類。

3つとも使えるかどうかは論点ではありません。どれを渡すかが設計の中身になります。

本文の外側は3つに分かれる。メニュー、サイト設定、ウィジェットエリア

全部をCMSに寄せない

このサイトのヘッダーには5つのリンクが出ていて、うちCMSのメニューに入っているのは「制作実績」と「About」の2つだけ。残りはコードに直接置いています。

  • 「相談する」（CTAボタン）を渡さないのは、問い合わせ導線を管理画面の操作ミスが届く範囲に置きたくないからです。
  • 「ブログ」は記事が1件でもあるときだけ出し、1件だけ取得して有無を判定しているので、手動でオン・オフする必要がない。
  • 「よくあるご質問」は位置もスタイルも決め打ちです。動かす理由がありません。

判断の軸は更新頻度 × 壊れたときの痛さ。よく変わるうえ壊れても軽いものはCMSへ、めったに変わらないのに壊れると売上に響くものはコードへ。この線引きを実装前にやっておくと、あとでなぜここは変えられないのかを説明するのがぐっと楽になります。

更新頻度と壊れたときの痛さで、CMSに渡すものとコードに残すものを分ける比較表

空でも壊れない書き方にする

渡す以上、消される前提で書きます。

getMenu() は、その名前のメニューが無ければ null を返す。だから受け側はこうしておく。

const menu = await getMenu("primary");

// テンプレート側
{menu?.items.map((item) => (
  <a href={item.url} target={item.target}>{item.label}</a>
))}

メニューごと削除されてもヘッダーは落ちず、CMS由来のリンクが消えるだけで済みます。サイト名やタグラインも同じで、このサイトでは settings?.title || "Tsudzuri" のようなフォールバックを置いてあります。ロゴは実際いまも未設定のまま。設定されていれば画像、無ければテキスト、と分岐させてあるので表示は崩れません。

空になったときエラーとして扱うのか、その部分を省略するのかは、デザインの判断でもあるので、実装前にディレクターと決めておくのが早い。

渡す前に決める3つ

  1. 誰が触るか。サイト設定はサイト全体に効きます。EmDashではAPIやAI経由の操作について、設定の読み取りはEditor以上、更新はAdminと権限が分かれている。日々の更新担当をEditorに置けば、サイト名やSEOの既定値までは触れません。
  2. 触れる範囲は作らないことで決まる。フッター用のメニューを作らなければ、フッターのリンクはCMSから触れず、権限で塞ぐよりそもそも入り口を用意しないほうが事故が減ります。
  3. 触れない箇所は理由とセットで渡す。ここは固定ですだけだと、公開後に不満として返ってくる。ここを変えると問い合わせ導線が消えるので固定にしていますまで書けば、たいてい納得してもらえます。
渡す前に決める3つ。誰が触るか、触れる範囲、触れない箇所の理由

本文の中をどう割るか（コレクションのフィールド設計）と、本文の外側をどこまで渡すか。この2つはセットで決めるものです。本文だけ更新できますで納品すると、たいてい1か月後にヘッダーも変えたいが来ますから。

実装だけ任せたい制作会社の方へ

ヘッドレスCMSの構築で、クライアントに渡す範囲の設計から実装まで請けています。既存サイトの改修や、実装の難所だけの切り出しでも構いません。お問い合わせはこちらからどうぞ。

本記事は2026年8月時点の情報です。