メタオブジェクトを使用してウェブページを構築する

メタオブジェクトを使用して、繰り返し利用可能なオンラインストアのランディングページを構築できます。たとえば、アンバサダープログラムがある場合は、経歴、SNSリンク、画像を含む各アンバサダーのウェブページを作成できます。

メタオブジェクトを使用してウェブページを作成するには、以下の手順を実行する必要があります。

ストアフロントへのアクセス権があるメタオブジェクト定義を作成します。必要に応じて、ウェブページ機能を手動で有効化します。
メタオブジェクト定義のエントリーを作成します。
ウェブページのメタオブジェクトのテンプレートを作成します。

カスタムデータのオプションについて、詳しくはこちらをご覧ください。

ウェブページ機能を有効化してテーマテンプレートを作成する

メタオブジェクト定義を作成してメタオブジェクトエントリーを作成した後、テーマエディタでメタオブジェクトのテンプレートを作成できます。

ページセレクターから関連するメタオブジェクトを選択した後、セクションの追加、ブロックの追加、設定の編集を行ってカスタマイズできます。動的ソースを使用して、メタオブジェクト定義フィールドと連携させることもできます。たとえば、アンバサダー向けのページを画像付きで作成する場合、以下の動的ソースアイコンをクリックすることにより、テキスト付き画像を追加し、メタオブジェクトエントリーを連携させることができます。

オンラインストアにメタオブジェクトを表示する方法の詳細についてはこちら、動的ソースを使用する方法の詳細についてはこちらをご覧ください。

テーマエディタでメタオブジェクトのテンプレートを作成する

管理画面から [オンラインストア] > [テーマ] に移動します。
編集するテーマを見つけて、[カスタマイズする] をクリックします。
ページ上部にあるページセレクターを開きます。
[メタオブジェクトのテンプレートを作成する] をクリックします。ダイアログで、テンプレートに使用するメタオブジェクトをクリックします。ページタイトルとメタディスクリプションに使用するメタオブジェクトフィールドを編集することができます。また、[検索結果] セクションでURLハンドルを編集することもできます。テンプレートの名前には、メタオブジェクト定義と同じ名前が自動的に設定されます。
[テンプレートを作成する] をクリックします。
テンプレートを作成してから、セクションの追加、ブロックの追加、設定の編集を行って、テンプレートをカスタマイズすることができます。動的ソースを使用して、メタオブジェクト定義フィールドと連携させることもできます。たとえば、アンバサダー向けのページを画像付きで作成する場合、動的ソースアイコンをクリックすることにより、テキスト付き画像を追加し、メタオブジェクトエントリーを連携させることができます。
[保存] をクリックします。

テーマテンプレートを作成した後、ホームページのセクションからそのページにリンクさせることができます。また、[リンク] フィールドのメニューに手動でリンクを追加することもできます。メニューへのリンクの追加について、詳しくはこちらをご覧ください。

ウェブページの機能を有効化する

メタオブジェクトの機能を有効にするには、メタオブジェクト定義の [オプション] セクションで [エントリーをウェブページとして公開する] を選択します。

手順

管理画面から、[設定] > [カスタムデータ] の順に移動します。
ウェブページの作成に使用するメタオブジェクトをクリックします。
[オプション] セクションで [ストアフロントのアクセス] が有効化されていることを確認します。
[オプション] セクションで [エントリーをウェブページとして公開する] を選択します。
エントリーをウェブページとして公開するセクションで、以下の操作を行います。
1. ページタイトルと検索結果のメタディスクリプションを作成するフィールドを選択します。[オンラインストアで有効にする] がデフォルトで選択されています。Hydrogenのストアフロントがある場合は、[オンラインストアで有効にする] の選択を解除します。
2. オプション：URLハンドルをカスタマイズします。
[保存] をクリックします。

メタオブジェクト定義を作成してウェブページ機能を有効にした後、メタオブジェクトエントリーを追加する必要があります。

テーマエディタでメタオブジェクトのエントリーを編集する

メタオブジェクトのテンプレートに関する作業を行う場合、オンラインストアエディタから直接メタオブジェクトを編集できます。

メタオブジェクトページのテンプレートを構築する場合、現在プレビュー中のメタオブジェクトエントリーを開き、以下のいずれかの方法に従って直接編集できます。

メタオブジェクトのテーマテンプレートに関する作業を行う場合、以下のエントリータイトルをクリックします。
テーマ設定で接続されたフィールドに関する作業を行う場合、[値を編集] をクリックします。