LYCデザイン／動作デモ

React製WordPressテンプレート
動作デモ

ご依頼の実装方式（WordPress内で完結する React ／ Gutenberg カスタムブロック＋ブロックテーマ）で、実際に動くものを先に作りました。ブラウザの中で本物の WordPress が起動するので、公開ページの見え方も、編集画面での操作感もそのままご確認いただけます。

※ 初回の起動に 20〜40 秒ほどかかります（WordPress をブラウザ内で立ち上げています）。管理画面には自動でログイン済みです。編集内容はお使いのブラウザ内だけに残り、保存・公開はされません。

非エンジニアの方がそのまま編集できます

見出し・文章・ボタン・アイコン・列数・背景色などを、完成ページと同じ見た目のままブロックエディタ上で直接書き換えられます。

親ブロック＋子ブロックの構成で、カードやQ&Aは「＋」で増やし、ドラッグで並べ替えできます。

背景トーン3種・中央寄せ切替・2つのボタン

アイコン付きカード。PC 2〜4列を切替

番号は CSS カウンタで自動採番

「おすすめ」プランを強調表示

<details> 製の開閉式。JS 不要

申し込み・問い合わせへの誘導帯

納品物として想定している構成そのままです。

React（JSX）＋ @wordpress/scripts でビルド。block.json（apiVersion 3）を置くだけでブロックが自動登録されます
ブロックテーマ（theme.json でカラー・フォント・余白を一元管理）。テーマの色を変えれば全ブロックの配色が連動
レスポンシブ対応（PC／タブレット／スマホ）。ヘッダーのメニューはスマホでハンバーガーに切替
ページ全体を「パターン」として登録済み。固定ページに挿入して文章を差し替えるだけで量産できます
ヘッドレス構成は使わず、WordPress 内で完結
納品物：ビルド前ソース一式（src/）＋ビルド済みファイル＋導入手順メモ（README）

ソース一式のダウンロード（デモ用の簡易版）：