はじめに 「ハイパー・ビデオ・アセット」をShopifyテーマへ導入し、動画をインデックス可能な構造化資産へと変換する手順を解説します。 本カスタマイズは「メタオブジェクト」を使用します。 メタオブジェクトの定義 まずは、動画の詳細データを格納するための「器」を作成します。 名前：ハイパー・ビデオ・アセットタイプ：hyper_video_assetフィールド構成： ラベル タイプ キー 動画タイトル 1行テキスト title 動画概要 複数行テキスト description 動画ファイル 動画(ファイル) video 文字起こしデータ 複数行テキスト transcript チャプター情報 1行テキスト（リスト） has_part テーマを編集 スニペットを作成 テーマコードエディターにて「snippets/hyper-video-asset.liquid」を新規作成し、以下のコードををのまま貼り付けて下さい。 {%- liquid assign videos = product.media | where: 'media_type', 'video' assign entries = metaobjects.hyper_video_asset.values -%} {%- if videos.size > 0 -%} <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "Product", "name": "{{ product.title }}", "subjectOf": [ {%- assign is_first_entry = true -%} {%- for entry in entries -%} {%- liquid unless is_first_entry echo ',' endunless assign match_video = videos | where: 'id', entry.video.value.id | first assign video_duration = entry.video.value.duration | divided_by: 1000 if video_duration < 60 assign duration = video_duration | prepend: 'PT00M' | append: 'S' else assign video_time = video_duration | date: '%-M:%-S' | split: ':' assign duration = 'PT' | append: video_time[0] | append: 'M' | append: video_time[1] | append: 'S' endif assign entry_title = entry.title if entry_title == blank assign entry_title = product.title endif assign entry_description = entry.description.value if entry_description == blank assign entry_description = product.description endif -%} {%- if entry.video.value.id == match_video.id -%} { "@type": "VideoObject", "name": {{ entry_title | escape | json}}, "description": {{ entry_description | strip_newlines | escape | json }}, "thumbnailUrl": [{{ entry.video.value.preview_image.src | image_url: width: 1080 | prepend: shop.url | json | remove: '\' }}], "uploadDate": {{ product.published_at | date: '%Y-%m-%dT%H:%M:%S%:z' | json }}, "contentUrl": {{ entry.video | file_url | json | remove: '\' }}, "embedUrl": {{ product.url | prepend: shop.url | json | remove: '\' }}, "duration": {{ duration | json }} {%- if entry.transcript.value != blank -%} ,"transcript": {{ entry.transcript.value | strip_newlines | escape | json }} {%- endif -%} {% if entry.has_part != blank %} ,"hasPart": [ {%- assign is_first = true -%} {%- for clip in entry.has_part.value -%} {%- liquid unless is_first echo ',' endunless assign clip_name = clip | split: '|' | first assign clip_start = clip | split: '|' | last | split: '-' | first assign clip_end = clip | split: '|' | last | split: '-' | last -%} { "@type": "Clip", "name": {{ clip_name | json}}, "startOffset": {{ clip_start }}, "endOffset": {{ clip_end }} } {%- assign is_first = false -%} {%- endfor -%} ] } {%- endif -%} {%- endif -%} {%- assign is_first_entry = false -%} {%- endfor -%} ] } </script> {%- endif -%} セクションファイルを編集 商品ページを出力するセクションファイルの最下部に、以下のコードを貼り付けて下さい。Dawnの場合は「sections/main-product.liquid」が対象ファイルです。 {% render 'hyper-video-asset', product: product %} 動画をエントリー 管理メニュー「コンテンツ→メタオブジェクト」より「ハイパー・ビデオ・アセット」を選択し、構造化データ対応させたい動画をエントリー登録してください。 「動画タイトル」と「動画概要」が空欄の場合は、商品タイトルと商品説明がそれぞれ出力されます。 「文字起こしデータ」や「チャプター情報」は空欄でも構いませんが、LLMO強化には入力を推奨します。 検証 テストツールで検証 設定完了後、Schema Markup Validatorでページを検証してください。 「VideoObject」が検出され、その中に全ての項目がエラーなく格納されていれば、AIへの最適化は完了です。 ダブルチェック 仕上げにGeminiへ、商品ページのURLと共にこう問いかけてみてください。 「このページの構造化データから「VideoObject」を確認して。AI検索エンジンがこの動画の中身を理解できる、十分な情報が含まれているか分析して」 最後に 「ハイパー・ビデオ・アセット」は、検証ツールでページのソースを見ない限り、ヒトの目線では確認できません。 ページの裏側に書かれた「構造化データ」が、ただの「動く画像」を「動く信頼性」へと進化させ、AIが利用可能な「構造化された資産」へと変換させます。 このカスタマイズが数ヶ月後のAI検索結果で、あなたのショップの強力な武器になることでしょう。
