サイト設定
サイト基本情報、記事表示設定、トップページカスタマイズの方法を初心者向けに徹底解説します。
初心者の方へ
サイト設定では、サイト名・URLなどの基本情報、記事一覧の表示スタイル、トップページのヒーローセクション、カテゴリー管理、見出しデザイン、リストデザイン、フリースペースをカスタマイズできます。まずは基本情報を正確に設定することから始めましょう。
1. サイト設定とは？
サイト設定は、あなたのサイトの基本情報（サイト名、URL）、記事一覧の表示スタイル、トップページのビジュアル要素、記事の見出しやリストのデザインを管理する設定です。サイト全体の見た目とユーザー体験に直結する重要な設定です。
サイト設定で実現できること
- サイト基本情報の管理 - サイト名、URLを正確に設定してSEO対策
- 記事一覧の表示カスタマイズ - 1ページあたりの記事数、通常表示/カラム表示の切り替え
- トップページのビジュアル設定 - ヒーローセクションの見出し・説明文・グラデーションをカスタマイズ
- カテゴリー管理 - 記事をカテゴリー別に整理してナビゲーションを改善
- 見出しデザイン設定 - H2/H3のスタイルと色をカスタマイズ
- リストデザイン設定 - 箇条書きのアイコンと色を選択
- フリースペース設定 - 広告やお知らせを各ページの任意の場所に挿入
サイト設定の7つの管理領域
2. 設定項目一覧
各設定項目とその役割を理解しましょう。
2-1. 基本設定
| 設定項目 | 説明 | 初心者向けTips |
|---|---|---|
| サイト名 | サイトのタイトルです。HTMLのtitleタグやヘッダーに表示されます。 例: 「アダルト動画レビューサイト」 |
必須 SEO対策で重要です。キーワードを含めましょう。 |
| サイトURL | サイトの完全なURL（プロトコル付き）を設定します。 例: 「https://yourdomain.com」 |
必須 末尾のスラッシュなしで入力してください。 |
| 1ページあたりの表示件数 | 記事一覧で1ページに表示する記事の件数を設定します。 推奨: 10〜20件 |
推奨 デフォルトは10件です。 |
| 記事一覧の表示形式 | 通常表示またはカラム表示（2列）から選択します。 | 任意 画像が多い場合はカラム表示がおすすめ。 |
2-2. トップページ設定
| 設定項目 | 説明 | 初心者向けTips |
|---|---|---|
| ヒーロータイトル | トップページの大きな見出しテキストです。 例: 「AIによる記事自動生成システム」 |
任意 30文字以内がおすすめ。 |
| ヒーローリード文 | タイトル下の説明文です。 例: 「キーワードを入力するだけで、高品質な記事を自動生成」 |
任意 60文字以内がおすすめ。 |
| 背景グラデーション | ヒーローセクションの背景グラデーションの開始色と終了色を設定します。 | 任意 カラーピッカーで直感的に設定できます。 |
2-3. カテゴリー管理
| 設定項目 | 説明 | 初心者向けTips |
|---|---|---|
| カテゴリー名 | カテゴリーの表示名です。 例: 「FANZA作品レビュー」 |
必須 |
| スラッグ | URLに使用される識別子です。 例: 「fanza-review」 |
推奨 空欄の場合は自動生成されます。 |
| 説明文 | カテゴリーの説明文です。 | 任意 |
2-4. 見出し設定
| 設定項目 | 説明 | 初心者向けTips |
|---|---|---|
| H2/H3スタイル | 見出しのスタイルを選択します。デフォルト、左ボーダー、下ボーダー、背景色、左ボーダー+背景色から選択可能。 | 任意 プレビューで確認できます。 |
| ボーダー色 | 見出しのボーダーの色を設定します。 | 任意 カラーピッカーで設定。 |
| 背景色 | 見出しの背景色を設定します。 | 任意 薄い色がおすすめ。 |
| 文字色 | 見出しの文字色を設定します。 | 任意 背景とのコントラストを確保。 |
2-5. リストデザイン設定
| 設定項目 | 説明 | 初心者向けTips |
|---|---|---|
| リストスタイル | 箇条書きのアイコンスタイルを選択します。チェックマーク、サークルチェック、アウトラインチェック、矢印、三角形、ダブルアングルから選択可能。 | 任意 プレビューで確認できます。 |
| リストカラー | アイコンの色を設定します。 | 任意 サイトのテーマカラーに合わせましょう。 |
2-6. フリースペース設定
| 設定項目 | 説明 | 初心者向けTips |
|---|---|---|
| トップページ上部 | トップページの記事一覧の上に表示されます。 | 任意 お知らせバナーなど。 |
| トップページ下部 | トップページの記事一覧の下に表示されます。 | 任意 広告など。 |
| カテゴリーページ上部/下部 | カテゴリーページの記事一覧の上下に表示されます。 | 任意 |
| 記事ページ上部/下部 | 記事ページの本文の上下に表示されます。 | 任意 広告を配置するのに最適。 |
| サイドバー上部/下部 | サイドバーの上部または下部に表示されます。 | 任意 |
| アナリティクス | HTMLの<head>タグ内に挿入されます。Google Analyticsなどのトラッキングコードを設定します。 | 推奨 アクセス解析に必須。 |
注意: サイトURL設定
サイトURLは必ず「https://」または「http://」から始める必要があります。末尾のスラッシュ（/）は付けないでください。間違った形式で設定すると正しく動作しません。
3. 操作手順（シナリオ別）
よくある6つのシナリオについて、具体的な設定手順を説明します。
シナリオ1: サイト名とURLの設定（初回セットアップ）
- 管理画面にログイン
ブラウザでhttp://yourdomain.com/tool-R18-version/admin/にアクセスして、ID「admin」、パスワード「admin123」でログインします。 - サイト設定画面を開く
左サイドバーの「設定」をクリックします。 - サイト名を入力
「サイト名」フィールドに、あなたのサイトのタイトルを入力します。
例: 「アダルト動画レビューサイト」 - サイトURLを入力
「サイトURL」フィールドに、サイトの完全なURLを入力します（末尾のスラッシュなし）。
正しい例:https://yourdomain.com
間違った例:yourdomain.com（プロトコルなしNG） - 表示件数と表示形式を設定
「1ページあたりの表示件数」に数値を入力（デフォルト: 10）し、「記事一覧の表示形式」で通常表示またはカラム表示を選択します。 - 設定を保存
ページ上部または下部の「設定を保存」ボタンをクリックして完了です。
シナリオ2: トップページのヒーローセクションを編集
- 設定画面からトップページ設定を開く
左サイドバーの「設定」をクリック後、「トップページ設定」ボタンをクリックします。 - ヒーロータイトルを編集
「タイトル (h1)」フィールドに、トップページに表示する大きな見出しを入力します（30文字以内推奨）。
例: 「AIによる記事自動生成システム」 - ヒーローリード文を編集
「リード文 (p class="lead")」フィールドに、タイトル下に表示する説明文を入力します（60文字以内推奨）。
例: 「キーワードを入力するだけで、高品質な記事を自動生成」 - 背景グラデーションを設定
カラーピッカーで開始色と終了色を選択します。プレビューで確認しながら調整できます。 - 設定を保存
「設定を保存」ボタンをクリックして完了です。
シナリオ3: カテゴリーを追加する
- 設定画面からカテゴリー設定を開く
左サイドバーの「設定」をクリック後、「カテゴリー設定」ボタンをクリックします。 - カテゴリー名を入力
「カテゴリー名」フィールドに新しいカテゴリー名を入力します。
例: 「FANZA作品レビュー」 - スラッグを入力（任意）
「スラッグ」フィールドにURLに使用される識別子を入力します。空欄の場合は自動生成されます。
例: 「fanza-review」 - 説明文を入力（任意）
「説明文」フィールドにカテゴリーの説明を入力します。 - カテゴリーを追加
「追加」ボタンをクリックしてカテゴリーを保存します。
シナリオ4: 見出しのデザインを変更する
- 設定画面から見出し設定を開く
左サイドバーの「設定」をクリック後、「見出し設定」ボタンをクリックします。 - H2スタイルを選択
ドロップダウンから好みのスタイルを選択します（デフォルト、左ボーダー、下ボーダー、背景色、左ボーダー+背景色）。 - 色を設定
ボーダー色、背景色、文字色をカラーピッカーで設定します。 - プレビューで確認
ページ内のプレビューで見出しの見た目を確認します。 - H3も同様に設定
H3についても同じ手順で設定します。 - 設定を保存
「設定を保存」ボタンをクリックして完了です。
シナリオ5: リストのデザインを変更する
- 設定画面からリスト設定を開く
左サイドバーの「設定」をクリック後、「リスト設定」ボタンをクリックします。 - リストスタイルを選択
チェックマーク、サークルチェック、アウトラインチェック、矢印、三角形、ダブルアングルから選択します。 - リストカラーを設定
カラーピッカーでアイコンの色を設定します。 - プレビューで確認
ページ内のプレビューでリストの見た目を確認します。 - 設定を保存
「設定を保存」ボタンをクリックして完了です。
シナリオ6: フリースペースに広告を設置する
- 設定画面からフリースペース設定を開く
左サイドバーの「設定」をクリック後、「フリースペース」ボタンをクリックします。 - 配置したいエリアを選択
9つのエリア（トップページ上部/下部、カテゴリーページ上部/下部、記事ページ上部/下部、サイドバー上部/下部、アナリティクス）から選択します。 - HTMLコードを入力
テキストエリアに広告タグやHTMLコードを貼り付けます。
例:
<div class="text-center my-3">
<!-- 広告タグをここに貼り付け -->
</div> - 設定を保存
ページ下部の「設定を保存」ボタンをクリックして完了です。 - サイトで確認
サイトを開いて、広告が正しく表示されているか確認します。
設定のコツ
1. まず基本設定（サイト名、URL）を完了させる
2. トップページ設定でサイトの第一印象を整える
3. カテゴリー管理で記事を整理
4. 見出しとリストのデザインで記事の可読性を向上
5. フリースペースで広告やお知らせを配置して収益化