ビデオスポットライトセクション

あなたが学ぶこと

  • タイトルと行動喚起(CTA)付きで注目ビデオを表示する方法

  • ビデオの動作(自動再生、コントロール)をカスタマイズする方法

  • レイアウト、間隔、およびアスペクト比を調整する方法

  • セクションの色とタイポグラフィをスタイル設定する方法


🧩 セクション概要

ビデオスポットライトセクションは、補助テキストと任意のCTAリンクとともに単一のビデオを強調表示するように設計されています。キャンペーン、インタビュー、製品紹介ビデオに最適で、このセクションは完全にレスポンシブで自動再生または手動コントロールをサポートします。


セクションの追加方法

  1. Shopify テーマエディタ」で、クリックします セクションを追加

  2. を選択 ビデオスポットライト

  3. ページレイアウト上の位置にドラッグしてください


コンテンツ&データ設定

  • ビデオ:ビデオファイルをアップロードまたは選択

  • カバー画像:オプションのフォールバックサムネイル画像(ビデオが読み込まれる前に使用)

  • ヘッダーテキスト:ビデオ上に表示されるタイトル(例:「ストーリーを見る」)

  • 表示リンクのテキスト:ボタンのテキスト(例:「今すぐ見る」)

  • 表示リンクのURL:商品、ページ、または外部ビデオリンクを貼り付け

💡 ヒント: ベストなパフォーマンスのために短いビデオ(10MB未満)を使用してください .mp4 フォーマットで、デバイス間での最良のパフォーマンスを得られます。


レイアウト&表示オプション

  • 自動再生ビデオ(ミュート):読み込み時に自動的に再生するようにONに切り替えます(音無し)

  • ビデオコントロールを表示:再生、停止、音量、全画面アイコンを表示するよう有効化します

  • 幅スタイル:次から選択してください:

    • ギャップありの全幅

    • 全幅(端から端まで)

    • コンテンツ幅(内側のコンテンツに揃える)

  • アスペクト比:16:9や4:3などの一般的なフォーマットから選択してください

⚠️ 省電力モードが有効なiPhoneでは自動再生が動作しない場合があります。


タイポグラフィ

  • セクションヘッダーサイズ:

    • デスクトップ:ピクセル単位で調整可能

    • モバイル:ピクセル単位で調整可能

  • 切り替え セクションタイトルを太字にする表示リンクを太字にする 必要に応じて


  • ヘッダーの色:任意の16進値を選択してください(例: #000000)

  • 背景色:デフォルトは透明;必要に応じてカスタマイズしてください


スタイリング

  • 角を丸くする:ビデオコンテナのボーダー半径を調整します


間隔

デスクトップとモバイルで間隔を個別にカスタマイズ:

  • 上部および下部の間隔(デスクトップ)

  • 上部および下部の間隔(モバイル)

各間隔オプションはレイアウトの流れを微調整するために調整できます。


ヘルプが必要ですか?

  • 💬 Discord のコミュニティに参加してください: https://discord.gg/hcc2GvgZc6

  • 📧 メールでお問い合わせ: [email protected]

  • 💻 ライブチャット: 月〜金、現地時間(EST)10:00〜18:00 に当社ウェブサイトで直接利用可能

最終更新