利用マニュアル

Utopia テーマユーザーマニュアル

Utopia は、企業サイト・メディア・ランディングページ・ブログ・ポータルサイトなど、幅広い用途に対応した WordPress テーマです。管理画面から直感的にカスタマイズでき、コーディング不要でプロ品質のサイトを構築できます。

はじめに
管理画面の構成
セットアップウィザード
デザイン設定
レイアウト設定
ヘッダー設定
フッター設定
フロントページ設定
コンテンツ設定
SEO 設定
広告・アナリティクス
コンタクトフォーム
パフォーマンス設定
アフィリエイト設定
会員制機能
メンテナンスモード
フローティングウィジェット
カスタムブロック
エクスポート・バックアップ

1. はじめに

アクセス方法

WordPress 管理画面の左メニューに 「Utopia」 が表示されます。クリックするとダッシュボードが開き、各設定ページへアクセスできます。

推奨環境

WordPress 6.0 以上
PHP 7.4 以上

2. 管理画面の構成

メニュー	説明
📊 ダッシュボード	設定の概要とクイックアクセス
🚀 セットアップウィザード	初回設定をガイド
🎨 デザイン設定	色・フォント・見出し・ボタン
📐 レイアウト設定	コンテンツ幅・サイドバー・余白
🔝 ヘッダー設定	CTA・メニュー・ヘッダーメディア
🔻 フッター設定	著作権・CTA・SNS リンク
🏠 フロントページ設定	トップページの構成
📝 コンテンツ設定	パンくず・目次・関連記事・著者
🔍 SEO 設定	OGP・Twitter Card・サイト認証
💴 広告設定	広告コードの配置
📈 アナリティクス設定	トラッキングコード
✉️ コンタクトフォーム	お問い合わせフォーム
⚡ パフォーマンス	読み込み最適化
💰 アフィリエイト	PR ラベル・免責表示
👥 会員制	コンテンツのアクセス制限
🔧 メンテナンス	メンテナンスページ表示
📌 フローティングウィジェット	固定表示ボタン・バナー
🔑 ライセンス	ライセンスキー認証
📦 エクスポート / バックアップ	テーマ ZIP ダウンロード

3. セットアップウィザード

テーマ有効化時に自動で起動します。サイトタイプ・ブランドカラー・レイアウト・CTA を順番に設定できます。

サイトタイプ: 企業・メディア・LP・ブログ・ポータルなど
ブランドカラー: プリセットから選択またはカスタム
レイアウト: サイドバー・コンテンツ幅
CTA: ヘッダーボタンの有無

4. デザイン設定

カラーパレットプリセット

業種に合わせた 8 種類のカラーパレットをワンクリックで適用できます。

信頼・誠実（青系）— 金融・医療・コーポレート
活力・楽しさ（オレンジ系）— 飲食・エンタメ
自然・安心（グリーン系）— エコ・ウェルネス
高級・洗練（パープル×ゴールド）— ファッション・ブライダル
情熱・行動（赤系）— セール・LP
清潔・シンプル（ライトブルー）— 医療・SaaS
温もり・親しみ（ウォームオレンジ）— カフェ・子育て
革新・テック（シアン×ネイビー）— スタートアップ・AI

基本カラー

メインカラー: ボタン・リンク・アクセント
サブカラー: サブアクセント
テキスト色: 本文

サイトタイプ（9 種類）

タイプ	説明
Corporate	標準的な企業サイト
Media	ニュース・マガジン向け
LP	ランディングページ
Blog	個人・テーマブログ
Portal	検索バー付きポータル
Corporate Pro	アナウンスバー + スティッキーナビ
Side Header	左サイドバーナビ
Hero Header	ヒーロー画像上の透明ヘッダー
LP Pro	フルスクリーン LP

フォント・見出し・ボタン・カード・余白

本文フォント・見出しフォントは 15 種類の Google Fonts から選択。見出しスタイル（左ボーダー/下ボーダー/背景ブロック）、ボタンスタイル（ソリッド/アウトライン/ラウンド）、カードスタイル（フラット/ボーダー/シャドウ/ミニマル）、余白プリセット（コンパクト/ノーマル/スペーシャス）を設定できます。

ヘッダー・ナビゲーション色・ダークモード

ヘッダー背景・文字色・ナビリンク色を個別に設定。ダークモードトグルでライト/ダークを切り替え。OS の設定も反映されます。

5. レイアウト設定

コンテンツ幅: 最大幅の選択
サイドバー: ブログ・アーカイブで表示 ON/OFF
余白プリセット: セクション間の余白
ウィジェットエリアの色: コンテンツ上下・フロントページの背景・文字色
サイドバーの色: サイドバーエリアの色

6. ヘッダー設定

ヘッダー CTA

ボタンテキスト・URL、背景色・文字色、配置（左・中央・右）

ヘッダーメディア

タイプ: 単一画像 / 画像スライダー / 動画。単一画像は外観→ヘッダーで設定。スライダーは複数画像・間隔・矢印・ドット。動画は YouTube / Vimeo / アップロード動画。

オーバーレイ

カラーオーバーレイ（色・透明度）、オーバーレイコンテンツ（見出し・サブテキスト・ボタン）、スライドアニメーション（フェード/スライド）

メニュー・その他

レイアウト（ヘッダー上/横並び/ヘッダー下）、位置、メニュー項目ごとの文字色。検索ボタン、アナウンスバー、スティッキーヘッダー、トップへ戻るボタン。

7. フッター設定

著作権テキスト: 空欄ならサイト名＋年を自動表示
フッター CTA: 著作権上の CTA セクション
フッターメニュー: 位置・色
SNS リンク: X, Instagram, Facebook, YouTube, LINE など

8. フロントページ設定

コンテンツの表示元

固定ページのコンテンツを使用: ON にするとフロントページ編集画面の内容を表示。他セクションも併用可能。

セクション並び順

ドラッグで並び替え。ヒーロー / 固定ページコンテンツ / カスタムコンテンツ / 特徴 / プランと料金 / 新着記事 / CTA バナー

ヒーロー・カスタムコンテンツ・プランと料金

ヒーローは見出し・サブテキスト・ボタン・背景画像・グラデーションオーバーレイ。カスタムコンテンツは任意の HTML を挿入。プランと料金は Airwallex Payment Link URL を貼り付け。


        
                        プランと料金
                        
                                
                    👤
                    個人ライセンス
                    $79
                    
                        購入する                    
                
                                                
                    🏢
                    制作業者・代理店ライセンス
                    $149/year
                    
                        購入する

ショートコードで他ページにも表示可能。

特徴セクション

最大 10 項目。アイコン（絵文字）は OS の絵文字ピッカー（Win+. / Mac: Ctrl+Cmd+Space）や Emojipedia からコピー。タイトル・説明は改行可能。

9. コンテンツ設定

アイキャッチ画像

投稿・固定ページで表示 ON/OFF。表示スタイル（タイトル上/ヒーロー型）、画像の高さ（小・中・大）

パンくずリスト

投稿・固定ページ・アーカイブで ON/OFF。表示位置（上部/下部）。Schema.org BreadcrumbList 対応。

目次・関連記事・著者ボックス

目次は H2/H3 を自動解析。最小見出し数・開閉ボタン。関連記事はカテゴリ→タグ順。著者ボックスはアバター・プロフィール・リンクを投稿下部に表示。

10. SEO 設定

OGP 画像（1200×630px 推奨）、Facebook App ID、Twitter/X カード、Google Search Console・Bing サイト認証、投稿・ページごとのメタディスクリプション。

11. 広告・アナリティクス

広告設定: コンテンツ前・コンテンツ後・サイドバーに広告コードを配置。アナリティクス設定: Head・Body 直後・Footer にトラッキングコードを貼り付け。

12. コンタクトフォーム

複数フォームを作成可能。ショートコードで表示。Google reCAPTCHA v3 対応。フォームごとに項目・宛先を設定。

13. パフォーマンス設定

Head クリーンアップ: WordPress バージョン・RSD・ショートリンク・REST API・前後記事・フィード・X-Powered-By の削除。スクリプト・スタイル: 絵文字・jQuery Migrate 無効化、バージョンクエリ削除、アーカイブのブロック CSS 削除。読み込み: Google Fonts プリコネクト、HTML 圧縮、Heartbeat API 間隔・無効化。

14. アフィリエイト設定

PR ラベル、免責表示バナー（景品表示法対応）、外部リンクの自動 nofollow・sponsored、ブログカード（ショートコード）

15. 会員制機能

プラグイン不要で投稿・ページを会員限定に可能。ロックアウトモード（ログインへリダイレクト / 冒頭のみ表示＋ロック画面）、ティーザー設定。投稿編集画面のサイドバーで「会員限定」を設定。

16. メンテナンスモード

全訪問者にメンテナンスページを表示（管理者・編集者は通常閲覧可能）。ページタイトル・本文・終了予定日時を設定。

17. フローティングウィジェット

全ページに固定表示するボタン・バナー。タイプは画像・テキストボタン・カスタム HTML（LINE バッジ等）。位置・サイズ・アニメーション・閉じるボタン・モバイル非表示。

18. カスタムブロック

ブロックエディターで使用できる Utopia 専用ブロックです。

ブロック	説明
ノーティス / アラート	情報・成功・警告・エラーの通知ボックス
吹き出し	会話・Q&A 用
スタイルボックス	タイトル付きコンテンツボックス
ステップ	チュートリアル用ナンバリング
ポイントボックス	メリット・デメリット・チェック・注意
フロート画像	テキスト回り込み画像
アフィリエイトボタン	nofollow/sponsored 対応 CTA
アコーディオン / FAQ	折りたたみ
コンタクトフォーム	フォーム埋め込み

リッチテキストフォーマット

マーカー（蛍光ペン）、ペンマーカー、文字色、下線スタイル、インラインボックス、アイコン挿入、フォントサイズ

19. エクスポート・バックアップ

親テーマ（utopia.zip）、子テーマ（utopia-child.zip）、両方（utopia-full.zip）をダウンロード。WordPress 管理画面 → 外観 → テーマ → 新規追加 → アップロードからインストール可能。設定はデータベースに保存され、ZIP には含まれません。

進化し続けるワードプレステーマ