メタオブジェクトを使用してウェブページを構築する
メタオブジェクトを使用すると、オンラインストアで繰り返し利用できるランディングページを構築できます。たとえば、アンバサダープログラムがある場合、各アンバサダーのウェブページを作成して、経歴、SNSリンク、画像を含めることができます。
メタオブジェクトを使用してウェブページを作成するには、以下の手順を実行する必要があります。
- ストアフロントアクセスを使用してメタオブジェクト定義を作成し、任意でウェブページ機能を手動で有効化します。
- メタオブジェクト定義のエントリーを作成します。
- ウェブページ用にメタオブジェクトテンプレートを作成します。
カスタムデータのオプションについて詳しくはこちら。
ウェブページ機能を有効にしてテーマテンプレートを作成する
メタオブジェクト定義とメタオブジェクトエントリーを作成したら、テーマエディタでメタオブジェクトのテンプレートを作成できます。
ページセレクターから関連するメタオブジェクトを選択すると、セクションやブロックを追加したり、設定を編集したりしてカスタマイズできます。動的ソースを使用すれば、メタオブジェクト定義のフィールドを連携させることも可能です。たとえば、アンバサダーのページを画像付きで作成する場合、テキスト付き画像を追加し、次に表示される
オンラインストアでのメタオブジェクトの表示および動的ソースの使用について詳しくはこちら。
テーマエディタでメタオブジェクトテンプレートを作成する
管理画面から、[オンラインストア] > [テーマ] に移動します。
編集するテーマを見つけて、[カスタマイズ] をクリックします。
ページ上部のページセレクターを開きます。
[メタオブジェクトテンプレートを作成] をクリックします。ダイアログで、テンプレートに使用するメタオブジェクトをクリックします。[ページタイトル] と [メタディスクリプション] に使用するメタオブジェクトフィールドを編集でき、[検索結果] セクションで URL ハンドルを編集できます。テンプレートには、メタオブジェクト定義と同じ名前が自動的に付けられます。
[テンプレートを作成] をクリックします。
テンプレートを作成した後、セクションやブロックの追加、設定の編集を行ってテンプレートをカスタマイズできます。動的ソースを使用して、メタオブジェクト定義のフィールドを連携させることが可能です。たとえば、アンバサダーのページを画像付きで作成する場合、テキスト付き画像を追加し、動的ソースアイコンをクリックしてメタオブジェクトエントリーを連携させることができます。
[保存] をクリックします。
テーマテンプレートを作成した後、ホームページのセクションからそのページにリンクできます。また、メニューの [リンク] フィールドに手動でリンクを追加することもできます。メニューへのリンクの追加について詳しくはこちら。
ウェブページ機能を有効化する
メタオブジェクトでこの機能を有効にするには、メタオブジェクト定義の [オプション] セクションで [エントリーをウェブページとして公開する] を選択します。
手順：
Shopify 管理画面で、[設定] > [メタフィールドとメタオブジェクト] に移動します。
ウェブページの作成に使用するメタオブジェクトをクリックします。
[オプション] セクションで、[ストアフロントアクセス] が有効になっていることを確認します。
[オプション] セクションで、[エントリーをウェブページとして公開する] を選択します。
「エントリーをウェブページとして公開する」セクションで、以下の操作を行います。
- 検索エンジンリスティングのページタイトルとメタディスクリプションを作成するフィールドを選択します。[オンラインストアで有効にする] は、デフォルトで選択されています。Hydrogen ストアフロントを使用している場合は、[オンラインストアで有効にする] の選択を解除します。
- 任意：URL ハンドルをカスタマイズします。
[保存] をクリックします。
メタオブジェクト定義を作成して [ウェブページ] 機能を有効にしたら、メタオブジェクトエントリーを追加する必要があります。
テーマエディタでメタオブジェクトエントリーを編集する
変更を行うために管理画面に移動することなく、テーマエディタから直接メタオブジェクトを編集できます。この機能は、画像、動画、色、商品、ページ、コレクション、テキストの各メタフィールドで利用できます。
インライン編集を使用してメタオブジェクトページのテンプレートを編集する場合、現在プレビューしているメタオブジェクトのみを編集できます。
メタオブジェクトページのテンプレートを構築する際に、以下のいずれかの方法で、現在プレビューしているメタオブジェクトエントリーを開いてインラインで編集することができます。
- メタオブジェクトのテーマテンプレートで作業している場合は、エントリーのタイトルをクリックします。
- エントリーをクリックしてから、
「値を編集」 をクリックします (テーマ設定で接続されたフィールドを操作している場合)： 
テーマでメタオブジェクトを接続して表示する方法について、詳しくはこちらをご覧ください。
手順：
管理画面から、[オンラインストア] > [テーマ] に移動します。
編集するテーマの横にある [テーマを編集] をクリックします。
サイドバーメニューの設定で、エントリーをクリックします。
- [値を編集] をクリックします。
エントリーを編集します。
[保存] をクリックします。