header-logo
Wix の使用方法を学び、サイトとビジネスを構築する。
直感的な Wix 機能でサイトをデザインして管理する。
定期購入、プラン、請求を管理する。
ビジネスを運営し、サイト会員とつながる。
ドメインの購入、サイトへの接続と移管方法を学ぶ。
ビジネスとウェブプレゼンスを成長させるツールを入手する。
SEO とマーケティングツールで知名度を上げる。
より効率的な作業を支援する高度な機能を利用する。
解決策や既知の問題について確認し、問い合わせる。
placeholder-preview-image
コースとチュートリアルでスキルを習得する。
ウェブデザインやマーケティングなどのヒントを得る。
検索エンジンからのトラフィックを増やす方法について学ぶ。
フルスタックプラットフォームでカスタムサイトを構築する。
あなたの目標達成をサポートするエキスパートを見つけましょう。
placeholder-preview-image
  1. ホーム
  2. サイトの作成
  3. 高度な機能
  4. CMS
  5. CMS コレクションコンテンツをサイトに接続
  6. CMS：プロギャラリーにコレクションコンテンツを表示する

CMS：プロギャラリーにコレクションコンテンツを表示する

25分
プロギャラリーを使用して、CMS（コンテンツ管理システム）コレクションの各アイテムの画像を動的に表示します。各アイテムに使用する画像フィールドを制御し、コレクションフィールドを画像のタイトル、詳細、代替テキスト、リンクに接続することもできます。このタイプの設定では画像をアイテムの動的アイテムページにリンクできるため、動的リストページと静的ページの両方に最適です。
プロギャラリーのデータセット接続オプションが表示されているスクリーンショット。
重要：
この記事では、コレクションアイテムごとに 1つの画像を表示するための「画像」フィールドにプロギャラリーを接続する方法について説明します。または、プロギャラリーを「メディアギャラリー」フィールドに接続して、動的アイテムページに 1つのコレクションアイテムを表示することができます。

ステップ 1 | CMS コレクションを作成する

ギャラリーに表示したい画像を格納する複数アイテムコレクションを作成して、画像フィールドタイプや画像のタイトル、詳細、代替テキストを格納するテキストフィールドを追加することができます。次に、コレクション内の各アイテムの画像と値を追加します。必要に応じて、デフォルトの「コンテンツを表示」設定から、誰でもコンテンツを閲覧できるコレクションの権限を調整することができます。

ギャラリー画像を格納するコレクションを作成する方法：

Wix エディタ
Wix Studio エディタ
ダッシュボード
  1. サイトダッシュボードの「CMS」にアクセスします。
  2. 「コレクションを作成」をクリックします。
  3. 「白紙テンプレート」をクリックします。
    ヒント：または「AI で作成」をクリックして、AI（人工知能）にコレクションを作成してもらいます。
  4. 「次へ」をクリックします。
  5. コレクション名を入力します。
  6. （コーディングのみ）コードで使用するコレクション ID を入力します。
  7. 「複数のアイテムコレクション（デフォルト）」を選択したまま、「作成」をクリックします。
  8. 手動または CSV ファイルをインポートして、コレクションにフィールドを追加します：
ヒント：
各アイテムの画像を格納するには、必ず「画像」フィールドタイプを追加してください。「テキスト」フィールドタイプを追加して、画像のタイトル、詳細、代替テキストとして使用することもできます。
  1. コレクションにアイテムを追加します：
    1. 「＋アイテムを追加」をクリックします。
    2. 該当する各フィールドにアイテムに関するコンテンツを追加します。
    3. この手順を繰り返し、必要な数のアイテムを作成します。
CMS コレクションにアイテムを追加する様子を示したスクリーンショット。
  1. コレクションの権限を設定します：
    1. 「その他のアクション」をクリックし、「権限・プライバシー」を選択します。
    2. コレクションの権限を選択します：
      • コンテンツを表示：すべての訪問者またはサイト会員のみが、ライブサイトからコレクションのコンテンツを表示できるようにします。管理者と CMS アクセス権を持つ共同管理者は、常にコレクションのアイテムを表示、追加、更新、または削除することができます。
      • コンテンツを収集：すべての訪問者またはサイト会員のみが、入力要素または API を使用して、ライブサイトからコレクションに新しいアイテムを追加できるようにします。また、コンテンツを閲覧できるユーザーも指定してください。CMS へのアクセス権を持つ管理者と共同管理者は、常にコレクションのアイテムを表示、追加、更新、削除することができます。
      • 高度：ユーザーの役割ごとにカスタム権限を設定して、コレクションのコンテンツを表示、追加、更新、または削除できるユーザーを制御します。CMS にアクセスできる管理者と共同管理者は、すべての権限にアクセスできます。ただし、特定の共同管理者の役割に権限を設定して、コレクションへのアクセスを制限することは可能です。
    3. 「保存する」をクリックします。

コレクションの権限を設定しているスクリーンショット。

ステップ 2 | プロギャラリーをコレクションに接続する

サイトにプロギャラリーを追加し、コレクションフィールドにバインドするデータセットに接続します。次に、ギャラリーの画像ソースをコレクションの画像フィールドに接続します。タイトル、詳細、代替テキストをコレクション内のフィールドに接続することもできます。「リンクの接続先」ドロップダウンを使用して、アイテムを動的アイテムページ、または「URL」、「画像」、または「動画」フィールドにリンクします。
Wix エディタ
Wix Studio エディタ
  1. エディタにアクセスします。
  2. 異なるコレクションアイテムを表す画像をギャラリーで表示したいページに移動します。
  3. エディタ左側で「パーツを追加」 をクリックします。
  4. 「ギャラリー」をクリックします。
  5. 使用したいプロギャラリーをクリックして、ページにドラッグします。
Wix エディタでプロギャラリーを追加しているスクリーンショット。
  1. ギャラリーからサンプル画像を削除します：
    1. ギャラリーで「メディアを管理」をクリックします。
    2. 「すべて選択」をクリックし、「削除」をクリックします。
    3. 「完了」をクリックします。
  2. 「CMS に接続」アイコン  をクリックします。
  3. 「データセットを選択」ドロップダウンをクリックし、コレクションに接続されている既存のデータセットを選択します。または、「データセットを追加」を選択し、接続するコレクションを選択します。
  4. 該当するドロップダウンをクリックして、コレクションフィールドをギャラリーに接続します：
    • 画像元の接続先：表示する「画像」フィールドを選択します。
    • タイトルの接続先：画像のタイトルに使用するフィールドを選択します。
    • 詳細の接続先：画像の詳細に使用するフィールドを選択します。
    • 代替テキストの接続先：画像の代替テキストに使用するフィールドを選択します。
    • リンクの接続先：画像をリンクする動的ページ、「URL」フィールド、または「画像」フィールドを選択します。
ギャラリーへのデータセット接続設定が表示されているスクリーンショット。
  1. ギャラリーをクリックし、「設定」を選択してギャラリーのレイアウトやデザインなどをカスタマイズします。プロギャラリーのカスタマイズについての詳細はこちら

ステップ 3 | データセット設定を管理する

データセット設定を開き、一度に読み込むことができるアイテムの合計数を設定したり、特定のアイテムが表示されないようフィルターしたり、アイテムの表示順序を並べ替えたり、データセットモードを変更したりすることができます。訪問者がギャラリーに接続されているコレクションを更新できるようにする場合は、モードを「読み取り・書き込み」に設定します。
Wix エディタ
Wix Studio エディタ
  1. ギャラリーの接続済みデータセット設定に移動します：
    1. ギャラリーをクリックします。
    2. 「CMS に接続」アイコン  をクリックします。
    3. 右側の「ギャラリーを接続」パネルで「データセット設定」をクリックします。
  2. （オプション）「権限」横の権限タイプをクリックし、コレクションのコンテンツを表示、追加、更新、または削除できるユーザーを指定します。
  3. （オプション）データセット名を編集する必要がある場合は、「データセット名」をクリックします。
  4. （Velo のみ）「データセット ID」をクリックして、ページのコードでデータセットを識別するために使用する ID を編集します。
  5. 「データセットモード」ドロップダウンをクリックし、該当するオプションを選択します：
    • 読み取り：ページ上の要素は、コレクションからコンテンツを読み取って表示することができます。サイト訪問者は、コレクション内のコンテンツに変更を加えることはできません。
    • 読み取り・書き込み：接続された要素は、コレクションのコンテンツを表示することができます。サイト訪問者は入力要素を使用して、コレクションのコンテンツを追加または編集できます。
  6. 「読み込みごとのアイテム数」を編集して、一度に読み込むことができるアイテムの最大数を設定します。
    注意：これは、訪問者が「もっと見る」ボタン、「次のページ / 前のページ」ボタン、またはパジネーションバーをクリックした際に読み込まれるアイテムの最大数でもあります。手順については、次のセクションを参照してください。
データセットごとにアイテムを設定しているスクリーンショット。
  1. （オプション）「＋フィルターを追加」をクリックし、ギャラリーに特定のアイテムのみを表示させます。
  2. （オプション）「＋並び替えを追加」をクリックし、ギャラリーに表示されるコレクションアイテムの順番を選択します。

ステップ 4 |（オプション）「もっと見る」ボタンまたはナビゲーションボタンを作成する

コレクションアイテムがたくさんある場合は、「もっと見る」ボタンを追加することで、ページを読み込んだ際のパフォーマンスを改善することができます。データセットの「読み込みごとのアイテム数」では、最大 1000 のアイテムを表示するよう設定することができます。この数を調整すると、ギャラリーに最初に表示されるアイテム数と、訪問者が「もっと見る」ボタンをクリックした際に読み込まれるアイテム数を制御することができます。

このフィールドは、「次のページ / 前のページ」ボタン、およびパジネーションバーを接続している場合、ギャラリーで「ページ」ごとに表示されるアイテムの数も決定します。
Wix エディタ
Wix Studio エディタ
実行する内容を選択します：

よくある質問

ギャラリーと CMS の接続に関するよくある質問と回答については、以下をクリックしてください。

お役に立ちましたか？

|
この記事では下記を説明します：
  • ステップ 1 | CMS コレクションを作成する
  • ステップ 2 | プロギャラリーをコレクションに接続する
  • ステップ 3 | データセット設定を管理する
  • ステップ 4 |（オプション）「もっと見る」ボタンまたはナビゲーションボタンを作成する
  • よくある質問

お役に立ちましたか？

|