メタオブジェクトのチュートリアル

このページはMay 13, 2024に印刷されています。最新のバージョンについては、https://help.shopify.com/ja/manual/custom-data/metaobjects/using-metaobjectsをご覧ください。

メタオブジェクトを使用すると、ストアに構造化された情報を追加し、保存できます。メタオブジェクトは、管理画面でデータを保存したり、オンラインストアに表示される再利用可能で構造化されたコンテンツを作成したりするために使用できます。メタオブジェクトの例と使用できる場所を以下に示します。

  • 商品に布の種類を追加し、オンラインストアの商品ページに表示します。
  • 商品に関するよくある質問を作成し、オンラインストアの商品ページに表示します。
  • 画像とテキストを含むアンバサダーまたはインフルエンサーのプロフィールを作成し、オンラインストアのページに表示します。

管理画面から直接、商品、コレクション、お客様、注文、その他のストアの構成部分にメタオブジェクトを追加できます。

Online Store 2.0のテーマを使用している場合、メタフィールドを使用してメタオブジェクト参照を作成して、メタオブジェクトとテーマを連携させることができます。以前のテーマを利用している場合、またはテーマで使用できないメタフィールドタイプを追加したい場合は、テーマコードを編集するか、Shopifyパートナーを雇ってサポートを受けることができます。Shopifyパートナーを雇うことについて詳しくはこちらをご覧ください。

目次

商品の特長に関するチュートリアル

このチュートリアルでは、商品の特長に関するカスタムメタオブジェクトを作成し、オンラインストアに表示する方法について説明します。

何を学ぶか

このチュートリアルを終えると、以下を完了したことになります。

  • 商品の特長のメタオブジェクトを作成しました
  • 作成したメタオブジェクトを使用して、商品の特長に複数のエントリーを作成しました
  • メタオブジェクトを参照するメタフィールド定義を作成しました
  • エントリーを特定の商品に連携させました
  • メタオブジェクトのエントリーを公開しました

ステップ1：メタオブジェクトを作成する

  1. 管理画面から、[設定] > [カスタムデータ] の順に移動します。
  2. [メタオブジェクト] で [定義を追加] をクリックします。
  3. メタオブジェクト定義に [商品の特長] という名前を付けます。

  4. [フィールドを追加] をクリックし、このメタオブジェクトに表示するコンテンツのタイプを選択します。フィールドはメタオブジェクトに表示されるコンテンツを定義し、各フィールドには独自のオプションと検証が設定されています。

    • このチュートリアルでは、画像、商品名、キャプション、説明を表示する商品の特長のメタオブジェクトを作成します。最初のフィールドを追加するには、[ファイル] を選択します。

  5. タイプと検証を設定します。フィールドに [画像] という名前を付け、簡単な説明を入力します。

  6. [アクセス] で、[ストアフロント] が自動的に選択されます。ストアがコンテンツにアクセスして表示できるように、このオプションを選択したままにしておきます。

  7. メタオブジェクトに画像フィールドを追加します。[フィールドを追加] > [ファイル] の順に選択します。

    • このフィールドに [画像] という名前を付けます。
    • [ビデオ] をオフにすると、このメタオブジェクトが画像のみを表示するよう設定できます。
    • 説明を入力します。
    • 完了したら [追加] をクリックします。

  8. メタオブジェクトに見出しフィールドを追加します。今回は [フィールドを追加] を選択し、フィールドの種類として [単一行のテキスト] を選択します。次の手順を実行します。

    • このフィールドに [見出し] という名前を付けます。
    • [このフィールドを表示名として使用する] にチェックを入れ、インデックスのエントリー名としてこのフィールドを使用します。
    • 説明を入力します。
    • 完了したら [追加] をクリックします。

  9. メタオブジェクトにキャプションフィールドを追加します。[フィールドを追加] > [単一行のテキスト] の順にクリックします。次の手順を実行します。

    • このフィールドに [キャプション] という名前を付けます。
    • 説明を入力します。
    • 完了したら [追加] をクリックします。

  10. メタオブジェクトに説明フィールドを追加します。[フィールドを追加] > [複数行のテキスト] の順にクリックします。以下の操作を実行します。

    • このフィールドに [説明] という名前を付けます。
    • 説明を入力します。
    • 完了したら [追加] をクリックします。

  11. 新しいメタオブジェクト定義を [保存] します。

メタオブジェクト定義を保存すると、エントリーの作成ができるようになります。

ステップ2：エントリーを作成する

  1. 管理画面から [コンテンツ] をクリックします。
  2. 新しいエントリーのベースとなる [商品の特長] というメタオブジェクト定義をクリックし、[エントリーを追加] をクリックします。

  3. エントリーのフィールドに入力します。

    • [画像を選択] をクリックし、この商品の特長の画像を選択またはアップロードします。
    • [タイトル] と [説明] を追加します。

  4. ステータスは自動的に [アクティブ] に設定されます。エントリーを使用する準備ができていない場合は、ステータスを [下書き] に変更できます。

  5. [保存] をクリックします。

エントリーが、コンテンツエントリーごとの固有IDである [ハンドル] を生成しました。エントリーをストアの領域に連携させた後は、ハンドルを編集することはおすすめしません。ストアでエントリーハンドルを使用した後にエントリーハンドルを変更する場合の影響について詳しくはこちらをご覧ください。

上記の手順を繰り返して、商品の特長のメタオブジェクト定義に基づきさらに3つのエントリーを作成します。

メタオブジェクト定義とエントリーを保存した後、メタオブジェクトを参照するメタフィールド定義を作成できます。

ステップ3：メタオブジェクトを参照するメタフィールド定義を作成する

  1. 管理画面から、[設定] > [カスタムデータ] の順に移動します。
  2. [メタフィールド] セクションで [商品] をクリックします。
  3. [定義を追加] をクリックします。固有の名前と説明を入力し、[コンテンツタイプを選択] をクリックします。
  4. [タイプを選択] をクリックした後、[メタオブジェクト] をクリックします。
  5. [参照] セクションで、参照するメタオブジェクト定義を選択します。[商品の特長] を選択します。これにより、商品の定義メタフィールドが商品の特長のメタオブジェクトに関連するエントリーのみが表示されます。
  6. この定義によって、1つのエントリーまたはエントリーのリストを表示できるかどうかが定まります。この例では [エントリーのリスト] オプションを選択します。
  7. [アクセス] セクションでは、[ストアフロント] オプションがデフォルトで選択されています。
  8. [保存] をクリックします。

次に、エントリーを表示する商品に連携させます。

ステップ4：商品をエントリーに連携させる

  1. 管理画面から [商品管理] に移動します。

  2. 商品の特長を表示する商品を選択します。

  3. この例では、作成した商品の特長の一部 (すべてではない) のエントリーを表示したいとします。[商品のメタフィールド] セクションで、[商品の特長] メタフィールドの横にあるエントリーフィールドをクリックします。メタフィールドリストに商品の特長が表示されない場合、[すべて表示] をクリックします。

  4. [エントリーを選択] をクリックします。このステップでは、この特定の商品に表示するエントリーを選択します。商品の特長を2つ選択します。

  5. 商品ページに戻ります。別の商品を選択し、前の手順に従って商品の特長の2つの異なるエントリーを商品に割り当てます。

次に、オンラインストアでメタオブジェクトを公開します。

ステップ5：オンラインストアにエントリーを公開する

エントリーを商品に連携させたため、次に、ストアでエントリーを表示します。この手順では、テーマエディタを使用して、メタオブジェクトのエントリーが連携するブロックとセクションを選択します。

セクションまたはブロックを追加した後、[動的ソースを接続] アイコンをクリックしてメタフィールドを選択できます。

「動的ソースを連携する」のアイコン

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. 編集するテーマを見つけて、[カスタマイズ] をクリックします。
  3. 画面上部のドロップダウンメニューを使用して、[商品] > [デフォルトの商品] の順に選択します。これにより、テーマエディタにデフォルトの商品のテンプレートを読み込みます。
  4. 左側のサイドバーで [セクションを追加] をクリックし、新しいセクションタイプとして [複数行] を選択します。

  5. [複数行] セクションの最初の行をクリックします。

    • 最初のブロックの設定が、右側のサイドバーに表示されます。列ブロックでは、手動で画像を選択、見出しを挿入、キャプションを追加、また説明を追加することができます。個々のデータソースのアイコンをクリックして、ブロック設定を希望するエントリーに連携させることもできます。

  6. ブロック名の横にある [動的ソースを接続] をクリックして、[商品の特長] を選択します。テーマエディタによって、新しい複数行ブロックに商品の特長のエントリーが入力されます。

  7. [複数行] セクションの残りのブロックを設定するか、未使用のブロックを削除します。

  8. [保存] をクリックして、商品の特長のエントリーを公開します。

エントリーは関連する商品でのみ表示され、商品がエントリーに連携されていない場合、セクションは公開されません。そのため、すべての商品で機能する単一の商品テンプレートを設定できます。

Shopifyで販売を開始する準備はできていますか?

無料体験を試す