🎓 プレゼンテーション・コンテンツ＆レシピ集
TIP
開発手順・データ管理・実装フローについては 💻 WordPress開発ガイド を参照してください。
レビュー時や、自身のポートフォリオとして見せる際に役立つ、WordPressサイトの構成案とレシピ集です。
1. MyOrganization Style (モダンなサイトデザインの再現)
「MyOrganization.jp のようなサイトを作りたい」という場合の技術アプローチです。
技術スタック分析
実際の MyOrganization 公式サイトなどは、最近では Jamstack (Headless CMS + Static Site Generator) で作られることが多いですが、プロジェクト要件（WordPress）で再現するには以下の機能を活用します。
再現アプローチ
- テーマ:
Hello ElementorやAstraなどの軽量テーマを選択。 - ページビルダー: Elementor (プラグイン) を入れると、コーディングなしで「動画背景」「アニメーションするテキスト」「グリッドレイアウト」などが作れます。
- 動画背景: トップページのヒーローセクション（一番上の大きな部分）に、黒背景＋ループ動画を設定することで、サイバー感を演出。
- フォント: Google Fontsプラグインを使い、
RobotoやNoto Sans JPなどのサンセリフ体を使用。
2. WordPress レシピ集
🔰 基本操作 (オーナーズマニュアル)
- 記事の投稿: ダッシュボード > 投稿 > 新規追加。Gutenbergエディタ（ブロックエディタ）の使い方（見出し、画像、リスト）。
- 固定ページの作成: 「お問い合わせ」や「About」など、時系列に関係ないページは「固定ページ」で作る。
- メニュー設定: 外観 > メニュー。作成した固定ページをヘッダーメニューに追加する手順。
- ウィジェット管理: サイドバーやフッターに検索窓やカテゴリ一覧を表示する。
🏢 サイト構成パターンと作成例
用途に合わせて、以下のようなページ構成を用意すると効果的です。
| 種類 | 必要な固定ページ構成 | 推奨プラグイン/機能 |
|---|---|---|
| コーポレートサイト | Home, 会社概要, 事業内容, 採用情報, お問い合わせ | Contact Form 7 (フォーム), Google Maps |
| ブログ・メディア | Home(記事一覧), カテゴリ別アーカイブ, 運営者情報 | SEOプラグイン, SNSシェアボタン |
| ポートフォリオ | Home(自己紹介), Works(作品ギャラリー), Skill, Contact | ギャラリー系プラグイン (Envira Gallery等) |
| LP (ランディングページ) | Homeのみ (縦長、全ての情報を1ページに) | Elementor, アンカーリンクでのスクロール移動 |
🛠️ 機能別レシピ
- 多言語対応:
PolylangやTranslatePressプラグインを使用。1つのWordPressで日/英を切り替えるスイッチを実装。 - お問い合わせフォーム:
Contact Form 7が鉄板。SMTP設定が必要な場合はWP Mail SMTPを使用（ただしDocker Infrastructure環境ではメール送信は外部STMPサーバーが必要）。 - SEO設定:
Yoast SEOやAll in One SEOを導入。各ページの<title>やmeta descriptionを設定し、Google検索での表示を最適化。 - 会員限定サイト:
Ultimate MemberやWP-Members。ログインしないと見れないページを作成可能（社内ポータルごっこができる）。
3. ボーナス機能活用ショーケース (レビュー対策)
レビューで「この機能は何の役に立つのか？」と聞かれた時に、実際に操作して見せるためのシナリオです。
🔴 Redis の効果実演
- 実演: ページをリロードし、超高速で表示されることを見せる。
- 裏側:
redis-cli monitorでログが流れているのを見せ、「DBに行かずにメモリから返しているので速いです」と解説。
📂 FTP の活用実演
- シナリオ: 「CSSを少し微調整したいが、管理画面が開けない（想定）」。
- 実演: FileZillaでFTP接続し、
wp-content/themes/my-theme/style.cssをダウンロード → 編集 → アップロード。 - 結果: サイトのデザインが変わったことを見せる。「コンテナに入らなくてもファイルがいじれます」とアピール。
🗄️ Adminer の活用実演
- シナリオ: 「ユーザーのパスワードを忘れて締め出された（想定）」。
- 実演: Adminerでログインし、
wp_usersテーブルのuser_passカラムを、MD5ハッシュ値で直接書き換えてリセットする。 - 解説: 「GUIでDBが見えるので、緊急時の対応やデータの確認が容易です」と説明。