← ポートフォリオトップへ

SCREEN PREVIEW

WordPress機能追加サンプル:申込フォーム+管理画面

ページに [wpfs_form] ショートコードを置くだけで申込フォームを追加。送信内容はカスタム投稿として保存され、管理画面の一覧表示とCSVエクスポートまでを一式で提供します。

このページについて:プラグインが実際に出力するPHP/HTMLマークアップ(class-form.php のフォーム、class-admin-list.php の管理画面一覧)を、WordPress環境なしで見た目を確認できるよう静的HTMLで再現したプレビューです。一覧の申込データはすべて架空です。

フロント側:申込フォーム([wpfs_form])

nonce付きフォーム。必須項目未入力・メール形式不正で送信すると保存されず、同じフォームにエラーメッセージが表示されます(送信しました。ありがとうございます。 は成功時の表示)。

管理画面:「申込フォーム受付」一覧

WordPress 管理画面  ›  申込フォーム受付

申込フォーム受付一覧

CSVエクスポート
日時お名前メール内容
2026-07-30 10:12ひろきhiroki@example.jp体験レッスンの空き状況について教えてください…
2026-07-29 18:40かなkana@example.jp資料請求をお願いします。郵送先は下記の通りです…
2026-07-28 09:03たくやtakuya@example.jp料金プランの違いについて質問があります…

一覧のマークアップ(div.wrap / table.widefat.striped / CSVエクスポートボタン)は class-admin-list.php が実際に出力する構造そのままです。表示は manage_options 権限が必要で、内容は mb_strimwidth により40文字で省略表示されます。

CSVエクスポート結果

date,name,email,message
2026-07-30 10:12,ひろき,hiroki@example.jp,体験レッスンの空き状況について教えてください
2026-07-29 18:40,かな,kana@example.jp,資料請求をお願いします。郵送先は下記の通りです
2026-07-28 09:03,たくや,takuya@example.jp,料金プランの違いについて質問があります

実際の出力は Excel での文字化け対策として BOM 付き UTF-8・Content-Disposition: attachment でダウンロードされ、manage_options 権限とnonce検証を通過した場合のみ実行されます。

▸ ソースコード(GitHub) ▸ ポートフォリオトップへ戻る