最初のページを作成

XOOPSで最初のページを作成

XOOPSで最初のコンテンツを作成、フォーマット、公開する方法を学びます。

XOOPSコンテンツを理解

ページ/投稿とは?

XOOPSでは、コンテンツはモジュールを通じて管理されます。最も一般的なコンテンツタイプは:

タイプ	説明	ユースケース
ページ	静的コンテンツ	について、お問い合わせ、サービス
投稿/記事	タイムスタンプされたコンテンツ	ニュース、ブログ投稿
カテゴリー	コンテンツ整理	関連コンテンツをグループ化
コメント	ユーザーフィードバック	訪問者操作を許可

このガイドはXOOPSのデフォルトコンテンツモジュールを使用した基本的なページ/記事作成について説明します。

コンテンツエディタへアクセス

管理パネルから

管理パネルにログイン: http://your-domain.com/xoops/admin/
コンテンツ > ページ (またはコンテンツモジュール) に移動
「新しいページを追加」または「新しい投稿」をクリック

フロントエンド (有効化されている場合)

XOOPSがフロントエンドコンテンツ作成を許可するように設定されている場合:

登録ユーザーとしてログイン
プロファイルに移動
「コンテンツを送信」オプションを探す
下記の同じステップに従う

コンテンツエディタインターフェース

コンテンツエディタには以下が含まれます:

┌─────────────────────────────────────┐
│ Content Editor                      │
├─────────────────────────────────────┤
│                                     │
│ Title: [________________]           │
│                                     │
│ Category: [Dropdown]                │
│                                     │
│ [B I U] [Link] [Image] [Video]    │
│ ┌─────────────────────────────────┐ │
│ │ Enter your content here...      │ │
│ │                                 │ │
│ │ You can use HTML tags here      │ │
│ └─────────────────────────────────┘ │
│                                     │
│ Description (Meta): [____________]  │
│                                     │
│ [Publish] [Save Draft] [Preview]   │
│                                     │
└─────────────────────────────────────┘

ステップバイステップガイド: 最初のページを作成

ステップ1: コンテンツエディタにアクセス

管理パネルで コンテンツ > ページ をクリック
「新しいページを追加」 または 「作成」 をクリック
コンテンツエディタが表示されます

ステップ2: ページタイトルを入力

「タイトル」フィールドにページ名を入力:

タイトル: ウェブサイトへようこそ

タイトルのベストプラクティス:

明確で説明的
可能ならばキーワードを含める
50-60文字が理想的
すべて大文字を避ける (読みにくい)
具体的 (「ページ1」ではなく)

ステップ3: カテゴリーを選択

コンテンツの整理先を選択:

カテゴリー: [ドロップダウン ▼]

オプションには以下が含まれる場合があります:

一般
ニュース
ブログ
お知らせ
サービス

カテゴリーが存在しない場合は、管理者に作成を依頼してください。

ステップ4: コンテンツを作成

コンテンツエディタエリアをクリックしてテキストを入力します。

基本的なテキストフォーマッティング

エディタツールバーを使用:

ボタン	アクション	結果
B	太字	太字テキスト
I	イタリック	イタリックテキスト
U	下線	下線テキスト

HTMLを使用

XOOPSは安全なHTMLタグを許可します。一般的な例:

<!-- 段落 -->
<p>これは段落です。</p>

<!-- 見出し -->
<h1>メインの見出し</h1>
<h2>サブ見出し</h2>

<!-- リスト -->
<ul>
  <li>項目 1</li>
  <li>項目 2</li>
  <li>項目 3</li>
</ul>

<!-- 太字とイタリック -->
<strong>太字テキスト</strong>
<em>イタリックテキスト</em>

<!-- リンク -->
<a href="https://example.com">リンクテキスト</a>

<!-- 改行 -->
<br>

<!-- 横線 -->
<hr>

安全なHTML例

推奨タグ:

段落: <p>, <br>
見出し: <h1> から <h6>
テキスト: <strong>, <em>, <u>
リスト: <ul>, <ol>, <li>
リンク: <a href="">
ブロック引用: <blockquote>
テーブル: <table>, <tr>, <td>

これらのタグを避ける (セキュリティのため無効化される場合があります):

スクリプト: <script>
スタイル: <style>
Iframes: <iframe> (設定されている場合を除く)
フォーム: <form>, <input>

ステップ5: 画像を追加

オプション1: 画像URLを挿入

エディタを使用:

画像を挿入 ボタン (画像アイコン) をクリック
画像URL を入力: https://example.com/image.jpg
alt テキストを入力: 「画像の説明」
「挿入」をクリック

HTML同等:

<img src="https://example.com/image.jpg" alt="説明">

オプション2: 画像をアップロード

最初にXOOPSに画像をアップロード:
- コンテンツ > メディアマネージャー に移動
- 画像をアップロード
- 画像URLをコピー
コンテンツエディタで、URLを使用して挿入 (上記のステップ)

画像のベストプラクティス

適切なファイルサイズを使用 (画像を最適化)
説明的なファイル名を使用
常にaltテキストを含める (アクセシビリティ)
サポートされた形式: JPG, PNG, GIF, WebP
コンテンツ幅の推奨: 600-800ピクセル

ステップ6: メディアを埋め込む

YouTubeビデオを埋め込む

<iframe width="560" height="315"
  src="https://www.youtube.com/embed/VIDEO_ID"
  frameborder="0" allowfullscreen>
</iframe>

VIDEO_IDをYouTubeビデオIDに置き換えます。

YouTubeビデオIDを見つける方法:

YouTubeでビデオを開く
URLは: https://www.youtube.com/watch?v=VIDEO_ID
IDをコピー (v=の後の文字)

VimeoビデオからVimeoビデオを埋め込む

<iframe src="https://player.vimeo.com/video/VIDEO_ID"
  width="640" height="360" frameborder="0"
  allow="autoplay; fullscreen" allowfullscreen>
</iframe>

ステップ7: メタ説明を追加

「説明」フィールドに簡潔な概要を追加:

説明: 当社のウェブサイトを始める方法をご紹介します。
このページはサービスの概要と当社がどのように役立つかを説明します。

メタ説明のベストプラクティス:

150-160文字
主なキーワードを自然に含める
正確にコンテンツを要約
検索エンジン結果に使用
説得力がある (ユーザーはこれを見る)

ステップ8: 公開オプションを設定

公開ステータス

公開ステータスを選択:

ステータス: ☑ 公開

オプション:

公開: 一般に表示
ドラフト: 管理者のみに表示
レビュー待機中: 承認待ち
アーカイブ: 非表示だが保持

表示

誰がこのコンテンツを見ることができるかを設定:

表示: ☐ 公開
     ☐ 登録ユーザーのみ
     ☐ プライベート (管理者のみ)

公開日

コンテンツが表示可能になる日時を設定:

公開日: [日付ピッカー] [時刻]

即座に公開する場合は「今」のままにしておきます。

コメントを許可

訪問者のコメントを有効または無効:

コメントを許可: ☑ はい

有効化された場合、訪問者はフィードバックを追加できます。

ステップ9: コンテンツを保存

複数の保存オプション:

[今すぐ公開]  [ドラフトで保存]  [スケジュール]  [プレビュー]

今すぐ公開: すぐに表示
ドラフトで保存: 今のところプライベートに保持
スケジュール: 将来の日時に公開
プレビュー: 保存する前に外観を確認

選択肢をクリック:

[今すぐ公開]をクリック

ステップ10: ページを確認

公開後、コンテンツを確認:

ウェブサイトのホームページに移動
コンテンツエリアに移動
新しく作成されたページを探す
クリックして表示
確認:
- コンテンツが正しく表示
- 画像が表示
- フォーマットが良好
- リンクが機能
- タイトルと説明が正確

例: 完全なページ

タイトル

XOOPSの開始

コンテンツ

<h2>XOOPSへようこそ</h2>

<p>XOOPSは強力で柔軟なオープンソース
コンテンツ管理システムです。最小限の技術知識で
動的なウェブサイトを構築できます。</p>

<h3>主な機能</h3>

<ul>
  <li>簡単なコンテンツ管理</li>
  <li>ユーザー登録と管理</li>
  <li>拡張性用のモジュールシステム</li>
  <li>柔軟なテーマングシステム</li>
  <li>組み込みセキュリティ機能</li>
</ul>

<h3>はじめに</h3>

<p>XOOPSサイトを実行するための最初のステップは以下の通りです:</p>

<ol>
  <li>基本的な設定を設定</li>
  <li>最初のページを作成</li>
  <li>ユーザーアカウントを設定</li>
  <li>追加モジュールをインストール</li>
  <li>外観をカスタマイズ</li>
</ol>

<img src="https://example.com/xoops-logo.jpg"
  alt="XOOPSロゴ">

<p>詳細については、
<a href="https://xoops.org/">xoops.org</a> にアクセスしてください</p>

メタ説明

XOOPSで開始します。機能を学び、
動的なウェブサイトを起動するための最初のステップを実行してください。

高度なコンテンツ機能

WYSIWYGエディタを使用

リッチテキストエディタがインストールされている場合:

[B] [I] [U] [Link] [Image] [Code] [Quote]

HTMLなしでテキストをフォーマットするボタンをクリック。

コードブロックを挿入

コード例を表示:

<pre><code>
// PHP例
$variable = "Hello World";
echo $variable;
</code></pre>

テーブルを作成

テーブルにデータを整理:

<table border="1" cellpadding="5">
  <tr>
    <th>機能</th>
    <th>説明</th>
  </tr>
  <tr>
    <td>柔軟</td>
    <td>カスタマイズが簡単</td>
  </tr>
  <tr>
    <td>強力</td>
    <td>フル機能CMS</td>
  </tr>
</table>

インライン引用

重要なテキストを強調:

<blockquote>
"XOOPSは強力なコンテンツ管理システムです
動的なウェブサイトを構築して力を与えます。"
</blockquote>

コンテンツ用SEOベストプラクティス

検索エンジント用コンテンツを最適化:

タイトル

メインキーワードを含める
50-60文字
ページごとに一意

メタ説明

キーワードを自然に含める
150-160文字
説得力のある正確

コンテンツ

自然に書く、キーワード詰め込みを避ける
適切に見出し (h2, h3) を使用
他のページへの内部リンクを含める
すべての画像にaltテキストを使用
記事は300語以上を目指す

URL構造

URL を短く説明的に保つ
ハイフンで単語を分離
特殊文字を避ける
例: /about-our-company

コンテンツを管理

既存ページを編集

コンテンツ > ページ に移動
リストでページを探す
編集またはページタイトルをクリック
変更を行う
更新をクリック

ページを削除

コンテンツ > ページ に移動
ページを探す
削除をクリック
削除を確認

公開ステータスを変更

コンテンツ > ページ に移動
ページを探して編集をクリック
ドロップダウンでステータスを変更
更新をクリック

コンテンツ作成のトラブルシューティング

コンテンツが表示されない

症状: 公開されたページがウェブサイトに表示されない

解決策:

公開ステータスを確認: 「公開」である必要があります
公開日を確認: 現在または過去である必要があります
表示を確認: 「公開」である必要があります
キャッシュをクリア: 管理 > ツール > キャッシュをクリア
パーミッションを確認: ユーザーグループがアクセス権を持つ必要があります

フォーマットが機能していない

症状: HTMLタグまたはフォーマットがテキストとして表示

解決策:

HTMLはモジュール設定で有効になっていることを確認
適切なHTMLシンタックスを使用
すべてのタグを閉じる: <p>テキスト</p>
許可されたタグのみを使用
HTMLエンティティを使用: < <, & &

画像が表示されない

症状: 画像が壊れたアイコンを表示

解決策:

画像URLが正しいことを確認
画像ファイルが存在することを確認
画像のパーミッションが正しいことを確認
XOOPSにアップロードした画像を試す
外部ブロッキングを確認 (CORSが必要な場合)

文字エンコーディングの問題

症状: 特殊文字がガイブなしに表示

解決策:

ファイルをUTF-8エンコーディングで保存
ページ文字セットがUTF-8であることを確認
HTMLの先頭に追加: <meta charset="UTF-8">
Word からのコピー貼り付けを避ける (プレーンテキストを使用)

コンテンツワークフローのベストプラクティス

推奨プロセス

エディタで最初に作成: 管理者コンテンツエディタを使用
公開前にプレビュー: プレビューボタンをクリック
メタデータを追加: タイトル、説明、タグを完了
最初にドラフトで保存: 作業を失うのを避ける
最終確認: 公開前に再読
公開: 準備完了時に公開をクリック
確認: ライブサイトで確認
必要に応じて編集: すぐに修正を行う

バージョン管理

常にバックアップを保持:

主な変更前: 新バージョンとして保存またはバックアップ
古いコンテンツをアーカイブ: 非公開バージョンを保持
ドラフトを日付: 明確な名前付け: 「ページドラフト2025-01-28」

複数のページを公開

コンテンツ戦略を作成:

ホームページ
├── について
├── サービス
│   ├── サービス 1
│   ├── サービス 2
│   └── サービス 3
├── ブログ
│   ├── 記事 1
│   ├── 記事 2
│   └── 記事 3
├── お問い合わせ
└── FAQ

この構造に従うページを作成します。

次のステップ

最初のページを作成した後:

ユーザーアカウントを設定
追加モジュールをインストール
管理機能を探索
設定を設定
パフォーマンス設定を最適化

タグ: #content-creation #pages #publishing #editor

関連記事:

Admin-Panel-Overview
Managing-Users
Installing-Modules
../Configuration/Basic-Configuration