2026年10月13日

2026年10月13日

WordPressで飲食店サイトを構築する方法|メニュー・営業時間・アクセスを正しく伝える作り方

飲食店のサイトで来店前の人が知りたいのは、「今日開いているか」「何がいくらで食べられるか」「どう行くか」の3つです。この記事では、WordPressでメニュー・営業時間・アクセスを更新しやすい形で載せ、検索結果や地図アプリの情報とずれない飲食店サイトを作る手順を解説します。予約システムの比較は扱わず、サイト全体の組み立てに絞ります。

飲食店サイトで最初に決めること

作り始める前に、サイトの役割を決めておきます。グルメサイトや予約サービス、Googleビジネスプロフィールにもすでに店舗情報がある場合、自社サイトが担うのは次のような「正確な一次情報」と「店の雰囲気」です。

  • 最新のメニューと税込価格
  • 通常の営業時間と、臨時休業・年末年始の予定
  • 席数、個室の有無、喫煙の扱い、子連れ・ペット可否などの来店前の疑問
  • 地図、最寄り駅からの道順、駐車場の有無
  • 予約の方法(電話、外部予約サービス、フォーム)

ページ数は多くなくて構いません。トップ、メニュー、店舗情報(アクセス・営業時間)、お知らせ、予約・問い合わせの5ページ程度から始め、宴会コースやテイクアウトなどは必要になってから足します。

テーマとトップページの組み立て

料理写真を大きく見せたいので、写真を全幅で配置できて表示の軽いテーマを選びます。ブロックテーマ(Twenty Twenty-Five など)なら、サイトエディターでトップページの構成を組み替えられます。汎用テーマは有料版にしかない機能もあり、無料版との分け方もテーマごとに異なるため、導入前に公式の機能一覧を確認してください(2026年10月現在)。

トップページの最初の画面には、店名と料理写真に加えて、営業時間と予約ボタンを置きます。スマートフォンでは最初の画面に収まる情報が限られるため、スライダーで写真を何枚も回すより、1枚の写真と要点の文字情報のほうが伝わります。電話予約が中心の店なら、電話番号を tel: リンクにしておくとタップで発信できます。

メニューページの作り方

メニューは画像(チラシやメニュー表の写真)だけで載せると、文字が小さくて読めない、検索に引っかからない、音声読み上げで内容が伝わらない、という問題が出ます。料理名と価格はテキストで載せ、写真は補助として添えるのが基本です。

構成は「カテゴリー見出し(前菜、メイン、ドリンクなど)+料理名・説明・価格の一覧」が読みやすく、ブロックエディターの見出しとテーブル、またはカラムで十分に作れます。品数が多く頻繁に入れ替える店では、メニューをカスタム投稿タイプにしてカテゴリーで並べる方法もありますが、更新する人が使いこなせる範囲にとどめるほうが長続きします。

価格を載せるときは、消費者向けには税込の総額で表示します。テイクアウトとイートインで税率が異なる場合は、どちらの価格かを明記します。アレルギー情報を載せる場合は、仕入れやレシピの変更に合わせて更新できる体制があるかを先に考え、「詳しくは店舗スタッフにお尋ねください」と案内を添えます。古い情報が残るほうが来店者にとって危険です。

営業時間とお知らせの運用

飲食店サイトでよく起きる問題が、営業時間の変更や臨時休業がサイトに反映されず、Googleビジネスプロフィールやグルメサイトと食い違うことです。食い違いを防ぐには、変更時に更新する場所の一覧(自社サイト、Googleビジネスプロフィール、各グルメサイト、SNS)を作っておき、毎回同じ順番で直します。

臨時休業は「お知らせ」として投稿し、トップページにも最新のお知らせが表示されるようにしておくと、1か所の更新で済みます。営業時間そのものは店舗情報ページに1か所だけ書き、ほかのページからはそこへリンクすると、直し漏れが起きにくくなります。

構造化データで店舗情報を伝える

検索エンジンに店舗の基本情報を伝える方法として、schema.org の Restaurant 型(LocalBusiness の一種)を使った構造化データがあります。Rank Math や Yoast SEO などのSEOプラグインにローカルビジネス向けの設定がある場合はそちらを使い、テーマや別プラグインと二重に出力しないようにします。プラグインを使わずに出す場合の例が次のコードです。子テーマの functions.php か mu-plugin に置き、ステージング環境で表示を確認してから本番に入れてください。

<?php
// トップページにだけ Restaurant の構造化データを出力する例
add_action( 'wp_head', function () {
	if ( ! is_front_page() ) {
		return;
	}
	$data = array(
		'@context'      => 'https://schema.org',
		'@type'         => 'Restaurant',
		'name'          => '店名(例)',
		'url'           => home_url( '/' ),
		'telephone'     => '+81-3-0000-0000',
		'servesCuisine' => '和食',
		'priceRange'    => '¥¥',
		'address'       => array(
			'@type'           => 'PostalAddress',
			'postalCode'      => '000-0000',
			'addressRegion'   => '東京都',
			'addressLocality' => '〇〇区',
			'streetAddress'   => '〇〇1-2-3',
			'addressCountry'  => 'JP',
		),
		'openingHoursSpecification' => array(
			array(
				'@type'     => 'OpeningHoursSpecification',
				'dayOfWeek' => array( 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday' ),
				'opens'     => '11:30',
				'closes'    => '21:00',
			),
		),
		'menu'          => home_url( '/menu/' ),
	);
	echo '<script type="application/ld+json">' . wp_json_encode( $data, JSON_UNESCAPED_UNICODE | JSON_UNESCAPED_SLASHES ) . '</script>' . "\n";
} );

出力後は、Googleの「リッチリザルト テスト」やスキーマ マークアップ検証ツールで読み取れているかを確認します。構造化データは検索結果での表示を約束するものではなく、書いた内容とページ上の情報が一致していることが前提です。営業時間を変えたらここも直す必要があるので、更新場所の一覧に加えておきます。

地図・アクセスと予約の導線

アクセスページには Googleマップの埋め込みに加えて、文章での道順(「〇〇駅東口を出て右へ徒歩3分、1階がコンビニのビルの2階」など)を書きます。地図が読み込めない環境や、読み上げで閲覧する人にも伝わるからです。地図の埋め込みは表示を重くしやすいので、ページ下部に置くか、iframe に loading="lazy" を付けます。

予約は、電話・外部予約サービス・フォームのどれを主にするかを決め、サイト内で案内を統一します。外部の予約サービスを使う場合はそのサービスの予約ページへのボタンを置き、フォームで受け付ける場合は「送信しただけでは予約確定ではない」ことと、確定連絡の方法を明記します。フォームで集める氏名や電話番号は個人情報なので、プライバシーポリシーへのリンクを近くに置きます。

公開前の確認

公開前に、スマートフォンで次の操作を試します。

  • トップから3タップ以内でメニュー・営業時間・地図にたどり着けるか
  • 電話番号をタップして発信画面になるか
  • 予約ボタンやフォームが最後まで動くか(自分宛てに送信テスト)
  • 料理写真の多いページが重すぎないか(PageSpeed Insights で確認)

まとめ

  • 飲食店サイトの役割は、メニュー・営業時間・アクセス・予約方法の正確な一次情報を出すこと
  • メニューはテキストで載せ、価格は税込の総額表示にする
  • 営業時間は1か所に書き、変更時に更新する場所の一覧を作って外部サービスとの食い違いを防ぐ
  • 構造化データはSEOプラグインと重複させず、ページの内容と一致させる
  • 地図には文章の道順を添え、予約の流れと確定方法を明記する

お気軽にご相談ください

お見積りへ お問い合わせへ
▲