「ヘッダーのメニュー、クライアント側で並べ替えられますか」。ヘッドレス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月時点の情報です。