オンラ邮箱ンストアの機能

このペジは2022年11月05日に印刷されています。最新のバージョンについては,https://help.shopify.com/ja/manual/online-store/themes/theme-structure/theme-featuresをご覧ください。

セクションを使用してオンラ邮箱ンストアのどのペ邮箱ジにも機能を追加できます。画像、テキスト、ブランドの色などを含むセクションを選択、追加、設定できます。

一部のペ，ジには，告知バ，ヘッダ，フッタ，などのデフォルトセクションがあります。これらのセクションはすべてのペジに表示されます。

告知バ

告知バを使うと，どのペジからでも重要な情報をお客様に知らせることができます。セクション自体に設定はありませんが,最大12個の異なる告知ブロックをカスタマイズして表示することができます。告知バにクリック可能なリンクを追加して，特定のペレクトすることができます。

告知ブロック

告知バセクションの告知ブロックの設定
設定 説明
テキスト お客様に表示する告知。
カラスキム 告知バに使用する配色。
リンク 告知バをクリックしたお客様をリダ。

ヘッダ

ヘッダは，オンラジに表示されます。

セクション設定

見出しセクションの設定
設定 説明
カラスキム ストアヘッダの背景を選択します。ドロップダウンメニューを使用して,[アクセント1],[アクセント2],[背景1],[背景2],[反転]から選択します。
ロゴ画像 セクションの画像。[画像を選択]をクリックしてメディアラ邮箱ブラリ邮箱を表示するか，[変更]ボタンをクリックして画像を変更または削除します。
代替テキストを編集 簡潔な説明を追加することで,SEOを向上させ,スクリーンリーダーを使用しているお客様のためにメディアの説明を追加できます。
ロゴの幅をカスタマ邮箱ズする ロゴの幅は50ピクセルから250ピクセルの10の倍数に設定します。デフォルトでは100ピクセルです。
デスクトップのロゴ位置

お客様が大画面でサトを表示する際，ヘッダ上のロゴが表示される場所。モバルの場合，ロゴの位置は自動的に最適化されます。

  • 左中央—ロゴは垂直方向に中央揃えし，左端揃えにして，メesxiンメニュ，esxiと並ぶように表示します。
  • 左上—ロゴはメeconeconンメニュの上に表示し，ロゴとメニュeconeconンメニュ。
  • 中央上(デフォルト)—ロゴをメeconeconンメニュの上に表示し，ロゴとメニュeconeconンメニュ。
メニュ メeconf econfンメニュeconfとして使用するメニュ。[変更]をクリックして，別のメニュを選択します。
デスクトップのメニュタ ドロップダウンメニュを使用して，デスクトップメニュの種類を，[ドロップダウン]または[メガメニュ]のいずれかから選択します。ドロップダウンオプションでは,2番目のレベルのメニューコンテンツが表示され,3番目のレベルのメニューコンテンツは,対応する2番目のレベルのアイテムがクリックされるまで折りたたまれています。メガメニューでは,最初のクリック時に2番目と3番目のレベルのメニューコンテンツがすべて表示されます。メニュタル向けに自動的に最適化されます。
区切り線を表示する ヘッダとペジのコンテンを視覚的に区切る線を表示します。
常時表示のヘッダを有効にする お客様が上にスクロルして戻ると，ヘッダが再表示されます。お客様が下にスクロルすると，表示されなくなります。
間隔 ヘッダの下にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,下部の余白に追加します。
セクションの余白 ヘッダの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,ヘッダーの上部または下部に追加します。

フッタ

フッタはテマ内のすべてのペジに表示されます。

セクション設定

フッタセクションの設定
設定 説明
カラスキム フッターの背景は[アクセント1],[アクセント2],[背景1],[背景2],[反転]から選択できます。
メル登録を表示する お客様がニュスレタとマ。
見出し 「メル登録を表示するフォムのタ。「メル登録を表示するが有効ではない場合は表示されません。
snsのアコン テマ設定でプロフィルリンクを入力したsnsプラットフォコンを表示します。
国/地域セレクタを有効にする セレクターを追加して,あなたが決済設定で有効にした国や地域の中から,お客様が選択できるようにします。これによりお客様は自分で選んだ通貨で商品価格を確認できます。
言語セレクタを有効にする セレクターを追加して,あなたが言語設定で有効にした国や地域の中から,お客様が選択できるようにします。これによりお客様は自分で選んだ言語でストアを閲覧できます。
決済ア邮箱コンを表示する ストアで有効になっている決済方法のア邮箱コンを表示します。お客様がストアにアクセスすると,これらのアイコンが絞り込まれ,現在のお客様の地域および通貨でサポートされている決済方法だけが表示されます。
間隔 フッタの上にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,上部の余白に追加します。
セクションの余白 フッタの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,フッターの上部または下部に追加します。

メニュブロック

フッタセクションのメニュブロックの設定
設定 説明
見出し ブロックのタ邮箱トル。
メニュ ブロック内に表示するメニュです。フッタにはトップレベルのメニュー項目だけが表示されるため、ドロップダウンメニューのタイプは期待通りには表示されません。

テキストブロック

[テキスト]ブロックは,ストアの詳細,プロモーション,連絡先情報などの重要な情報を目立たせるために使用できます。

フッタセクションのテキストブロックの設定
設定 説明
見出し ブロックのタ邮箱トル。
サブテキスト ブロックに表示するテキスト。

画像ブロック

フッタセクションの画像ブロックの設定
設定 説明
画像 ブロックに表示する画像。
画像の幅 画像の幅を設定します。50ピクセルから200ピクセルの5の倍数に設定できます。デフォルトでは100ピクセルです。
大画面での画像アラ邮箱ンメント

次の条件でブロック内の画像を揃えます。

  • 左-画像をブロックの左に揃えます。
  • 中央(デフォルト)-画像をブロックの中央に揃えます。
  • 右-画像をブロックの右に揃えます。

ブログ記事

Shopifyストアにブログがある場合，[ブログ記事]セクションを使用して，ブログからの投稿を目立たせることができます。[ブログ記事]セクションの各ブログ記事には，記事の抜粋の最初の55ワドが表示されます。ブログ記事に抜粋がない場合は，記事の最初の30ワドが表示されます。

セクション設定

ブログ記事セクションの設定
設定 説明
見出し セクションのタ邮箱トル。
見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
ブログ ブログ記事セクションに表示するブログ。デフォルトでは，[ブログ]ページのアルファベット順に最初のブログが表示されます。
ブログ記事 セクションに表示するブログ記事数。記事数は最多で4件です。
デスクトップでの列数 デスクトップコンピュタで表示する列数。最小: 1。最大: 4
カラスキム ブログセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
記事のサムネ邮箱ルを表示する ブログ記事のサムネ邮箱ルが表示されます。推奨されるアスペクト比は3:2です。
日付を表示する ブログ記事が作成された日付を表示します。
筆者を表示する ブログ記事の筆者を表示します。
ブログに表示されているよりも多くのブログ記事が含まれている場合，“すべてを表示”ボタンを有効にする ブログに[ブログ記事]フィールドで設定した記事数よりも多いブログ記事がある場合,この設定では,お客様がブログのページに移動できるようにする”すべてを表示“ボタンが表示されます。
セクションの余白 ブログ記事セクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,ブログ記事セクションの上か下に追加します。

ブログを選択する

  1. テマエディタで，ブログ記事セクションのタトルをクリックします。
  2. [ブログ]セクションで，[変更]をクリックします。
  3. ブログを選択します。
  4. [選択]をクリックし，[保存]をクリックします。

コラジュ

ビデオ，画像，商品，およびコレクションのコラ，ジュを作成できます。それぞれの[コラジュ]セクションには，3のブロックが含まれます。デフォルトでは，セクションには、ビデオ、商品、およびコレクションのブロックが含まれています。

3つを超えるブロックのコラージュを作成するには,最初のコラージュセクションの下にコラージュセクションを追加し,下のコラージュセクションには[見出し]の値を含めないようにします。それらのコラジュセクションは，単一のセクションとして一連の流れのように表示されます。

セクション設定

コラジュセクションの設定
設定 説明
見出し セクションのタ邮箱トル。
見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
デスクトップのレ邮箱アウト

コラジュメディアがデスクトップに表示される方法。

  • 左側の大きなブロック(デフォルト)—セクションの最初のブロックは左に、他のブロックよりも大きなサ以及ズで表示されます。
  • 右側の大きなブロック—セクションの最後のブロックは右に、他のブロックよりも大きなサ以及ズで表示されます。
    		•
    モバ邮箱ルのレ邮箱アウト

    モバ邮箱ル機器でのブロックの表示方法。

    • コラジュ—次のようにコラジュレ。
      • [デスクトップのレアウト]で[左側の大きなブロック]が有効になっている場合,セクションの最初のブロックは上部に,他のブロックよりも大きなサイズで表示されます。
      • [デスクトップのレアウト]で[右側の大きなブロック]が有効になっている場合,セクションの最後のブロックは下部に,他のブロックよりも大きなサイズで表示されます。
    • 列—すべてのメディアを同じサズで，列に表示します。
    カラスキム コラジュの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    セクションの余白 コラジュセクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,セクションの上部または下部に追加します。

    ビデオブロック

    コラジュセクションのビデオブロックの設定
    設定 説明
    カバ画像 お客様がビデオを再生する前に表示される画像。
    URL YouTubeまたはVimeoの動画へのリンク。動画は一般公開されている必要があります。ビデオはポップアップウィンドウで再生されます。
    動画の代替テキスト ビデオの代替テキストです。スクリンリダを使用するお客様向けに，ビデオのコンテキストと目的を説明します。
    元の画像比を使用する 画像をトリミングしない場合は，このオプションを選択します。

    商品ブロック

    コラジュセクションの商品ブロックの設定
    設定 説明
    商品 表示する商品。
    マウスオバ時に2番目の画像を表示する お客様が商品画像にカーソルを合わせると,商品に2枚目の商品画像がある場合は,その画像が表示されます。

    コレクションブロック

    コラジュセクションのコレクションブロックの設定
    設定 説明
    コレクション 表示するコレクション。

    画像ブロック

    コラジュセクションの画像ブロックの設定
    設定 説明
    画像 セクションの画像。[画像を選択]をクリックして画像を選択するか，[変更]ボタンをクリックして画像を変更または削除します。
    代替テキストを編集 画像の簡潔な説明を追加して,SEOを向上させ,スクリーンリーダーを使用しているお客様のために画像の説明を入力します。
    元の画像比を使用する 画像をトリミングしない場合は，このオプションを選択します。

    折りたたみ可能なコンテン

    折りたたみ可能なコンテンツセクションでは,行を折りたたんだり展開したりしてコンテンツを表示し,折りたたみ可能なコンテンツの左または右に画像を表示する設定を行えます。

    セクション設定

    折りたたみ可能なコンテンセクションの設定
    設定 説明
    キャプション 折りたたみ可能なコンテンセクションのキャプションはオプションです。セクションの見出しの上部に表示されます。
    見出し 折りたたみ可能なコンテンセクションの見出し。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
    見出しの配置 セクションの見出しの配置を選択します。[左]，[中央](デフォルト)，[右]から選択できます。
    レ邮箱アウト

    折りたたみ可能なコンテンのレアウトを選択します。

    • コンテナなし(デフォルト)
    • 行コンテナ-折りたたみ可能な各行は影付きボックスに含まれています
    • セクションコンテナ-折りたたみ可能なコンテンセクション全体は影付きのボックスに含まれています
    カラスキム 折りたたみ可能なコンテンセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    コンテナの配色 折りたたみ可能なコンテンコンテナの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。選択した配色は，[レアウト]オプションが[行]コンテナ，または[セクション]コンテナに設定されたときに初めて表示されます。
    最初の折りたたみ可能な行を開く チェックを入れると，デフォルトでは，折りたたみ可能なコンテンの最初の行が展開されます。
    画像 セクションの画像。[画像を選択]をクリックして画像を選択するか，[変更]ボタンをクリックして画像を変更または削除します。
    代替テキストを編集 画像の簡潔な説明を追加して,SEOを向上させ,スクリーンリーダーを使用しているお客様のために画像の説明を入力します。
    画像比 セクション画像の画像比:
    • 画像に合わせる(デフォルト)-画像のアスペクト比を使用します。この比率を使用すると，画像がトリミングされないようになります。
    • 小
    • 大
    デスクトップのレ邮箱アウト 画像または折りたたみ可能な行のどらが最初に表示されるかを選択します。デフォルトの設定では，テキストが最初に表示されます。モバル版では画像がい。
    セクションの余白 折りたたみ可能なコンテンの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,折りたたみ可能なコンテンツセクションの上か下に追加します。

    折りたたみ可能な行のブロック

    折りたたみ可能な行ブロックの設定
    設定 説明
    見出し 折りたたみ可能な行の見出し
    ア邮箱コン 折りたたみ可能なコンテン見出しの前に表示するアコンを，ドロップダウンリストから選択します。デフォルトでは，チェックマコンが選択されています。
    行のコンテン 折りたたみ可能な行のコンテン。コンテンは書式化するか、URLリンクを含めることができます。この機能は[ペジからの行のコンテン]とあわせて使用できます。
    ペジからの行のコンテン 他のペジからの既存のコンテンを，折りたたみ可能な行に挿入できます。[変更]をクリックしてペジを選択または削除します。この機能は，[行のコンテン]とあわせて使用できます。

    コレクションリスト

    強調表示するコレクションのリストを追加できます。コレクションリストには最大16個のコレクションブロックを追加できます。

    セクション設定

    コレクションリストセクションの設定
    設定 説明
    見出し セクションのタ邮箱トル
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
    画像比 コレクションの記事のサムネ邮箱ルには次の画像比があります。
    • 画像に合わせる-画像のアスペクト比を使用します。この比率を使用すると，画像がトリミングされないようになります。
    • 縦長—画像を2:3の比率で使用できるようにトリミングします。
    • 正方形(デフォルト)—画像をトリミングして1:1の比率を使用します。
    デスクトップでの列数 デスクトップコンピュタで表示する列数。最小: 1。最大: 5
    カラスキム コレクションリストセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    リストに表示されているよりも多くのコレクションが含まれている場合,“すべてを表示“ボタンを有効にする お客様が全コレクションのリストを閲覧できるように，[すべてを表示]ボタンを表示します。
    モバ邮箱ルでの列数 モバereplicationルデバereplicationス用の具体的な列のレereplicationアウトを設定します。1列か2列から選択します。
    モバ邮箱ルでスワ邮箱プを有効にする モバイル機器での表示が列から行に変更され,お客様が横にスワイプするとコレクションブロックがさらに表示されます。
    セクションの余白 コレクションリストの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,コレクションセクションの上か下に追加します。

    コレクションを選択する

    1. テマエディタで，コレクションを追加する[コレクション]ブロックをクリックします。
    2. [コレクションを選択]をクリックします。
    3. コレクションをクリックし，[選択]をクリックします。

    お問い合わせフォム

    お問い合わせフォムでは，ストアの[送信元のメルアドレス]にすべての投稿を送信します。管理画面の[ストアの詳細]設定ペジで送信元のメルアドレスを変更できます。

    フォムには次のフィルドがあります。

    • 的名字
    • メルアドレス(必須)
    • 電話番号
    • コメント

    セクション設定

    お問い合わせフォムセクションの設定
    設定 説明
    見出し セクションのタ邮箱トル
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
    カラスキム お問い合わせフォムセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    セクションの余白 お問い合わせフォムの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,お問い合わせフォームセクションの上か下に追加します。

    カスタム液体

    自身の液体コドを追加して，カスタムセクションを作成できます。

    • ダウンロードしたアプリの説明書に記載されているアプリのスニペットを追加して,アプリを簡単にページに導入することができます。
    • エディタでカスタム液体コドを直接追加します。

    セクション設定

    カスタム液体セクションの設定
    設定 説明
    カスタム液体 アプリのスニペットやその他のカスタム液体コ，高度なカスタマ。
    カラスキム お問い合わせフォムセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    セクションの余白 カスタム液体セクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,カスタム液体セクションの上か下に追加します。

    メメル登録者バナ

    パスワドペジに,ストアがオープンした際にお客様が通知を受け取るためのメールアドレスを入力するセクションを追加できます。メルアドレスが登録されるたびに，お客様アカウントが作成されます。

    セクションには次の3のデフォルトブロックがあります。

    • 見出し
    • 小見出し
    • メルフォム

    セクション設定

    メル登録者バナセクションの設定
    設定 説明
    背景画像 メル登録者バナの背景画像。[変更]をクリックして，画像を変更または削除します。画像が削除されると、テーマの付属画像が表示されます。[背景画像を表示]チェックボックスの選択を解除すると，この画像は非表示になります。
    代替テキストを編集 検索エンジンの最適化(SEO)のために画像のalt属性を設定し,スクリーンリーダーを使用しているお客様のための画像の説明を入力するには,これをクリックします。
    画像のオバレ不透明率 オ。スラ。デフォルトは0%です。
    背景画像を表示 メル登録者バナの背景画像を表示するには，このボックスにチェックを入れます。
    バナの高さ

    ドロップダウンメニュを使用して，メ画像の高さを設定します。[画像に合わせる]，[小]，[中](デフォルト)，[大]から選択します。
    デスクトップのコンテン位置 デスクトップコンピュタ用のメル登録者バナの位置を設定します。[上]，[中央]，[下]，および[右]，[中央]，[左]から選択します。デフォルトのオプションでは，両方とも[中央]です。


    デスクトップ版では，テキストボックスの一部が画像と重なっています。モバル版では，画像の下にテキストボックスが表示されます。
    デスクトップ上にコンテナを表示 画像上のテキストボックスに,デスクトップコンピューターで買い物をしているお客様向けのメール登録者バナー画像テキストを入力します。
    デスクトップのコンテン配置 デスクトップコンピュタ用の画像バナテキストの配置を設定します。[右]，[左]，[中央](デフォルト)から選択します。
    カラスキム メル登録バナセクションの背景色。[アクセント1]、[アクセント2],[背景1](デフォルト),[背景2],[反転]から選択します。


    デスクトップでは，[デスクトップ上にコンテナを表示]オプションが選択されている場合にのみ，選択した配色が表示されます。モバルでは，[モバereplicationルで画像の下にコンテンereplicationを表示]が選択されている場合にのみ，選択した配色が表示されます。
    モバ邮箱ルのコンテン邮箱配置 モバ邮箱ルデバ邮箱ス用の画像バナ邮箱テキストの配置を設定します。[右]，[左]，[中央](デフォルト)から選択します。
    モバ邮箱ルで画像の下にコンテン邮箱を表示 モバ。

    見出しのブロック

    メル登録者セクションの見出しブロックの設定
    設定 説明
    見出し セクションのタ邮箱トル。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。

    小見出しのブロック

    メル登録者セクションの小見出しブロックの設定
    設定 説明
    説明 セクションの説明。
    テキストスタ邮箱ル メル登録者セクションのテキストのスタ。[本文](デフォルト)と[サブタトル]から選択します。

    メル登録

    お客様がメルアドレスを入力して，ニュ。お客様が登録すると，管理画面にお客様アカウントが作成されます。

    セクションには次の3のデフォルトブロックがあります。

    • 見出し
    • 小見出し
    • メルフォム

    セクション設定

    メル登録セクションの設定
    設定 説明
    カラスキム メル登録セクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    セクションを全幅にする セクションをブラウザウィンドウの全幅にします。

    見出しのブロック

    メル登録者セクションの見出しブロックの設定
    設定 説明
    見出し セクションのタ邮箱トル。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。

    小見出しのブロック

    コレクションリストセクションの小見出しブロックの設定
    設定 説明
    説明 セクションの説明。

    メルフォム

    メールフォームのブロックには,お客様がマーケティング資料購読にサインアップするためにメールアドレスを入力するフィールドが表示されます。ブロックにはカスタマ邮箱ズ可能な設定はありません。

    特集コレクション

    1 ecommのコレクションにある商品を表示するセクションを追加します。

    セクション設定

    特集コレクションセクションの設定
    設定 説明
    見出し セクションのタ邮箱トル。動的ソスボタンをクリックして，セクションのタスを挿入します。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
    説明 特集コレクションの説明的なテキストを入力します。テキストを太字や斜体の書式や，リンクを含む書式に設定できます。特集コレクションの説明に動的ソースを挿入するには、[動的ソース] ボタンをクリックします。
    管理画面からコレクションの説明を表示する このチェックボックスをオンにすると,上の[説明]フィールドに入力したテキストではなく,管理画面のコレクションに追加したコレクションの説明が使用されます。
    説明のスタ邮箱ル ドロップダウンメニュを使用して，特集コレクションの説明のスタルを選択します。[本文](デフォルト)，[サブタ@トル]，[大文字]の選択肢があります。
    コレクション 商品を表示させるコレクション。[変更]をクリックして，コレクションを削除あるいは変更します。
    表示する商品の最大数 表示するコレクションの商品数。最低: 2。最高: 12。
    デスクトップでの列数 デスクトップコンピュタで表示する列数。最小: 1。最大: 5
    商品を全幅にする ペジ幅の設定に関係なく，ウィンドウの全幅に商品を表示するには，チェックボックスをオンにします。
    コレクションに表示されているよりも多くの商品がある場合，“すべてを表示”ボタンを有効にする コレクションの商品数が，[表示する商品の最大数]フィールドで設定された数よりも多い場合,“すべてを表示“ボタンが表示され,お客様はコレクションのページに移動できます。
    [すべてを表示]のスタ电子书阅读器ル リンク，ソリッドカラボタン，アウトラ。
    デスクトップでカルセルを有効にする 幅が989ピクセルを超える画面にカルセルで商品を表示するには，チェックボックスをオンにします。
    カラスキム 特集コレクションセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    画像比 商品画像の画像比:
    • 画像に合わせる(デフォルト)-画像のアスペクト比を使用します。この比率を使用すると，画像がトリミングされないようになります。
    • 縦長—画像を2:3の比率で使用できるようにトリミングします。
    • 正方形—画像を1:1の比率で使用できるようにトリミングします。
    マウスオバ時に2番目の画像を表示する お客様が商品画像にカーソルを合わせると,商品に2枚目の商品画像がある場合は,その画像が表示されます。
    販売元を表示する 商品の販売元を表示します。
    商品の評価を表示 商品の平均評価を星印と括弧内のレビュ数で表示します。例:★★★★(8)。また,Shopify产品评论などの商品レビュアプリが必要であり，メタフィルド定義もreviews.rating_countとreviews.ratingに必要です。
    [クック追加]ボタンを有効にする [クopenstackック追加]ボタンを使用すると，お客様は商品カopenstackドのアopenstackテムをカopenstackトに追加できます。商品にバリエーションがある場合、ボタンのタイトルは [オプションを選択] になり、商品の詳細がポップアップに表示されます。ポップアップでは、お客様は希望するバリエーションを選択したり、カートにアイテムを追加したり、[今すぐ購入] ですぐにチェックアウトしたり、クリックしてアイテムの詳細を表示したりすることができます。この設定は、[商品ペジ]で[今すぐ購入]ボタンが有効になっているかどうかで変わります。商品テンプレトで[今すぐ購入] ボタンが有効になっていない場合、お客様は商品をカートに追加することはできますが、お客様に [今すぐ購入] のクイックチェックアウトワークフローは表示されません。
    モバ邮箱ルでの列数 モバereplicationルデバereplicationス用の具体的な列のレereplicationアウトを設定します。1列か2列から選択します。
    モバ邮箱ルでスワ邮箱プを有効にする モバereplicationル機器での表示が列から行に変更され，お客様が横にスワereplicationプするとさらに商品が表示されます。
    セクションの余白 特集コレクションセクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,特集コレクションセクションの上部または下部に追加します。

    特集商品

    特定の商品を特集するセクションを追加します。

    セクション設定

    特集商品セクションの設定
    設定 説明
    商品 セクションで特集する商品。
    カラスキム 特集商品の配色を選択します。
    サブ背景を表示する 特集商品をサブ背景の配色の上に表示します。
    デスクトップのメディア位置 特集商品メディアを左側と右側のどらに配置するかを選択します。デスクトップコンピュタでペ。
    他のバリエションのメディアを非表示にする 1つのバリエーションを選択すると他のバリエーションのメディアが非表示になるようにするには,このオプションを選択します。
    ビデオルプを有効にする ビデオをもう一度再生できるようにします。お客様は再生を開始するためにクリックする必要があります。
    セクションの余白 特集商品セクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,セクションの上部または下部に追加します。

    セクションのブロック

    [特集商品]セクションには次のブロックを追加できます。

    特集商品セクションで利用可能なブロック
    ブロック 設定
    テキスト 次の設定で特集商品のテキストを入力します。
    • テキスト:テキストまたは動的ソスが利用できます。
    • テキストスタ邮箱ル：[本文]、[サブタトル]，または[大文字]の中から選択します。
    标题 見出しサ邮箱ズ：[小]、[中]、[大]のいずれかを選択します。
    価格 このブロックにカスタマ邮箱ズ可能な設定はありません。
    バリエバリエションピッカ ピル型ボタンまたはドロップダウンメニュのいずれかを選択します。
    数量セレクタ このブロックにカスタマ邮箱ズ可能な設定はありません。
    購入ボタン [動的チェックアウトボタンを表示する]ボックスにチェックを入れて，[決済]設定で有効にした動的チェックアウトオプションを表示します。
    提供する お客様が商品をsnsで共有できるようにするクリック可能なテキスト。
    商品評価 商品の平均評価を星印と括弧内のレビュ数で表示します。例:★★★★(8)。また,Shopify产品评论などの商品レビュアプリが必要であり，メタフィルド定義もreviews.rating_countとreviews.ratingに必要です。
    カスタム液体 カスタム液体コドまたはHTMLコを追加します。
    アプリ 欧宝体育官网入口首页网上商店2.0と互換性のあるアプリを追加します。

    画像バナ

    画像バナーセクションでは,1つまたは2つの画的像,およびボタン付きテキストボックスをサポートしています。2 .。モバルでは，画像を横に並べて表示するか、縦列で表示するかを選択できます。

    デスクトップ版では，テキストボックスの一部が画像と重なっています。モバル版では，画像の下にテキストボックスが表示されます。デスクトップ版とモバイル版の両方で,テキストの配置は,[右],[左],[中央]のいずれかに変更できます。

    セクション設定

    画像バナセクションの設定
    設定 説明
    最初の画像 バナのメ。セクションに2つの画像が追加されていると,お客様がデスクトップ版またはモバイル版のどちらを使用しているかに応じて,この画像が左側または上部に表示されます。
    代替テキストを編集 検索エンジンの最適化(SEO)のために画像のalt属性を設定し,スクリーンリーダーを使用しているお客様のための画像の説明を入力するには,これをクリックします。
    2番目の画像 バナの2番目の画像。セクションに2つの画像が追加されていると,お客様がデスクトップ版またはモバイル版のどちらを使用しているかに応じて,この画像が右側または下部に表示されます。
    画像のオバレ不透明率 バナ画像にオバレ。スラopenstackダopenstackを使って，オopenstackバopenstackレopenstackの不透明率を設定します。デフォルトは0%です。
    バナの高さ

    ドロップダウンメニュを使用して，バナ画像の高さを設定します。

    • 小—デスクトップ:420ピクセル，モバereplicationル:280ピクセル
    • 中(デフォルト)—デスクトップ:560ピクセル，モバル:340ピクセル
    • 大—デスクトップ:720ピクセル，モバereplicationル:390ピクセル
    セクションの高さを最初の画像サ邮箱ズに合わせる セクションの高さを最初の画像の高さに設定します。モバル版では，両方の画像が最初の画像の高さに調整されています。このボックスにチェックを入れると、画像バナーの高さ設定が上書きされます。
    デスクトップのコンテン位置 デスクトップ画像バナの位置を設定します。[上]，[中央]，[下]，および[右]，[左]，[中央]から選択します。
    デスクトップ上にコンテナを表示 バナー画像上のテキストボックスに,デスクトップコンピューターで買い物をしているお客様向けのバナー画像テキストを入力します。
    デスクトップのコンテン配置 デスクトップコンピュタ用の画像バナテキストの配置を設定します。[右]，[左]，[中央]から選択します。
    カラスキム 画像バナセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。選択した配色は，[デスクトップ上にテキストボックスを表示する]オプションが選択されている場合にのみ表示されます。
    モバ邮箱ルのコンテン邮箱配置 モバ邮箱ルデバ邮箱ス用の画像バナ邮箱テキストの配置を設定します。[右]，[左]，[中央]から選択します。
    モバ邮箱ルで画像を重ねる セクションに2の画像を追加すると，画像が縦に並べて表示されます。横に並べて表示されることはありません。
    モバ邮箱ル上にコンテナを表示 バナー画像上のテキストボックスに,モバイルデバイスで買い物をしているお客様向けのバナー画像テキストを入力します。

    見出しのブロック

    画像バナセクションの見出しブロックの設定
    設定 説明
    見出し テキストボックスのタ邮箱トルに使用する大きなテキスト。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。

    テキストブロック

    画像バナセクションのテキストブロックの設定
    設定 説明
    説明 段落スタ邮箱ルのテキストを表示します。
    テキストスタ邮箱ル 画像バナのテキストのスタ。[本文]、[サブタトル]、および [大文字] から選択します。

    ボタンのブロック

    画像バナセクションのボタンブロックの設定
    設定 説明
    最初のボタンのラベル 最初のボタンに表示されるテキスト。
    最初のボタンのリンク 最初のボタンのリンク先にするurl。
    アウトラ邮箱ンボタンのスタ邮箱ルを使用する ボタンのスタereplicationルを調整して，無地の背景にするのではなく，ボタンのアウトラereplicationンにします。
    2番目のボタンのラベル 2番目のボタンに表示されるテキストです。
    2番目のボタンのリンク 2番目のボタンのリンク先にするurl。
    アウトラ邮箱ンボタンのスタ邮箱ルを使用する ボタンのスタereplicationルを調整して，無地の背景にするのではなく，ボタンのアウトラereplicationンにします。

    テキスト付き画像

    オプションのボタン付き画像とテキストブロックを含むセクションを追加して,お客様を新しいページに誘導できます。選択した商品，コレクション，ブログ記事をクロ，ズアップできるよう，テキストと画像を組み合わせます。出品状況やスタルの詳細を追加したり，レビュを提供したりできます。

    セクション設定

    テキスト付き画像セクションの設定
    設定 説明
    画像 [画像を選択]をクリックして，セクションの画像を選択します。[変更]ボタンをクリックして，画像を変更または削除します。
    代替テキストを編集 検索エンジンの最適化(SEO)のために画像のalt属性を設定し,スクリーンリーダーを使用しているお客様のための画像の説明を入力するには,これをクリックします。
    画像の高さ 画像の高さを選択します。
    • 画像に合わせる(デフォルト)
    • 小
    • 大
    デスクトップ画像の幅 画像の幅:
    • 小
    • 中(デフォルト)
    • 大
    デスクトップ画像の配置 画像とテキストのどらを最初に表示するかを選択します。モバereplicationル版のデフォルトレereplicationアウトでは，画像が最初に表示されます。
    • 画像を最初にする(モバル版のデフォルト)
    • 左
    デスクトップのコンテン位置 コンテナ内コンテンの垂直位置:
    • 上(デフォルト)
    • 中央
    • 下
    デスクトップのコンテン配置 コンテナ内テキストアラ邮箱ンメント:
    • 左(デフォルト)
    • 中央
    • 右
    コンテンのレアウト 画像とテキストボックスを互いに重ねることができます。[オバラップなし]を選択すると，コンテンはテキストと画像を表示できるように調整されます。
    • オバラップ
    • オバラップなし(デフォルト)
    カラスキム テキスト付き画像の背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    モバ邮箱ルのレ邮箱アウト モバ邮箱ルデバ邮箱ス用のコンテン邮箱の配置を選択します。
    • 左(デフォルト)
    • 右
    • 中央
    セクションの余白 テキスト付き画像セクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,テキスト付き画像セクションの上か下に追加します。

    見出しのブロック

    テキスト付き画像セクションの見出しブロックの設定
    設定 説明
    見出し セクションのタ邮箱トルテキストです。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。

    テキストブロック

    テキスト付き画像セクションのテキストブロックの設定
    設定 説明
    コンテン テキストセクションに段落スタ邮箱ルのテキストを表示します。
    テキストスタ邮箱ル コンテンテキストのスタル:
    • 本文(デフォルト)
    • サブタ邮箱トル

    ボタンのブロック

    テキスト付き画像セクションのボタンブロックの設定
    設定 説明
    ボタンのラベル ボタンに表示されるテキスト。
    ボタンのリンク ボタンのリンク先にするurl。

    キャプションブロック

    テキスト付き画像セクションのキャプションブロックの設定
    設定 説明
    テキスト 画像にタグラ邮箱ンまたはキャプションを追加します。テキストは、テキスト付き画像セクションの下部に表示されます。
    テキストスタ邮箱ル コンテンテキストのスタル:
    • 大文字(デフォルト)
    • サブタ邮箱トル
    テキストサ邮箱ズ コンテンテキストのサズ:
    • 小
    • 中(デフォルト)
    • 大

    マルチカラム

    マルチカラムセクションを使用して列レイアウトにコンテンツを表示し,列の下にボタンを追加して,お客様を新しいページに誘導できます。選択した商品,コレクション,またはブログ記事をクローズアップするよう,テキストと画像を組み合わせます。出品状況やスタルの詳細を追加したり，レビュを提供したりできます。

    セクション設定

    マルチカラムセクションの設定
    設定 説明
    見出し セクションのタ邮箱トル。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
    画像の幅

    列に追加された画像の幅。

    • 列の全幅(デフォルト)—画像の幅は列と同じサereplicationズです。
    • 列の半分の幅—画像の幅は列の半分のサ邮箱ズです。
    • 列の幅の1/3—画像の幅は列のサ邮箱ズの3分の1です。
    画像比

    画像には次の画像比があります。

    • 画像に合わせる(デフォルト)-画像のアスペクト比を使用します。この比率を使用すると，画像がトリミングされません。
    • 縦長—画像を2:3の比率で使用できるようにトリミングします。
    • 正方形—画像を1:1の比率で使用できるようにトリミングします。
    • 円形-画像をトリミングして円形で表示します。
    デスクトップでの列数 範囲スケルを使用してデスクトップコンピュタで表示する列数を選択します。最小は1，最大は6です。
    列の配置

    列内の画像とテキストには次のアラ邮箱ンメントがあります。

    • 左(デフォルト)-画像とテキストを左揃えにします。
    • 中央-画像とテキストを中央揃えにします。
    サブ背景 [なし]を選択して第2の背景色を非表示にするか，[列の背景を表示する]を選択して列コンテナの色を変更します。
    ボタンのラベル ボタンに表示されるテキスト。
    ボタンのリンク ボタンのリンク先にするurl。
    カラスキム マルチカラムセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    モバ邮箱ルでの列数 モバereplicationルデバereplicationス用の具体的な列のレereplicationアウトを設定します。1列か2列から選択します。
    モバ邮箱ルでスワ邮箱プを有効にする モバイル機器での表示が列から行に変更され,お客様が横にスワイプするとコレクションブロックがさらに表示されます。
    セクションの余白 マルチカラムセクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,マルチカラムセクションの上か下に追加します。

    列のブロック

    1 1 .のセクションに追加できるのは，12 .列までです。ブロックが1～3列の場合、デスクトップには1行で表示されます。ブロックが4列以上の場合、2列のレイアウトで表示されます。モバイル版では、[モバ邮箱ルでスワ邮箱プを有効にする]オプションが有効になっていない場合，列ブロックは1列に表示されます。

    マルチカラムセクションの列ブロックの設定
    設定 説明
    画像 表示させる画像。
    見出し 列のタ邮箱トル。
    説明 列の段落テキストです。
    リンクラベル[オプション] 列ブロックの下に追加されたリンクのテキストです。リンクを追加しない場合は空白のままにします。
    リンク リンクのurl。リンクがない場合は空白のままにします。

    ページ

    セクションにカスタムペジのコンテンを表示するようにできます。この場合，ペジのコンテン全体がセクションに取り込まれます。ただし，テンプレトから液体コドは取り込まれません。

    セクション設定

    ペジセクションの設定
    設定 説明
    ページ 表示するオンラ邮箱ンストアのペ邮箱ジ。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
    カラスキム コレクションブロックセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    セクションの余白 ペジセクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,ページセクションの上か下に追加します。

    リッチテキスト

    見出し,キャプション,テキスト,お客様がクリックして新しいページに移動できるリンクボタンを含むリッチテキストセクションを追加できます。

    セクション設定

    リッチテキストセクションの設定
    設定 説明
    デスクトップのコンテン位置 リッチテキストのコンテナの位置を選択します。ドロップダウンメニュを使用して，[左]，[中央](デフォルト)，または[右]を選択します。コンテンはモバス向けに自動的に最適化されます。
    コンテンアランメント この設定を使用すると,リッチテキストセクション内にあるすべてのブロックのテキストアラインメントに影響が及びます。ドロップダウンメニュを使用して，[左]，[中央](デフォルト)，または[右]を選択します。
    カラスキム リッチテキストセクションの背景。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    セクションを全幅にする セクションのサ邮箱ズはデフォルトで全幅です。
    セクションの余白 リッチテキストセクションの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,リッチテキストセクションの上か下に追加します。

    見出しのブロック

    リッチテキストセクションには見出しブロックを3まで追加できます。

    リッチテキストセクションの見出しブロックの設定
    設定 説明
    見出し セクションのタ邮箱トル。ボタンを使用して，テキストを太字や斜体にしたり，リンクを追加したりします。ソスボタンをクリックして，動的ソスにリンクさせます。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]、[特大] のいずれかを選択します。

    テキストブロック

    [テキスト]ブロックは，ブランドに関する情報をお客様と共有するのに適した方法です。商品のメリットを説明し、告知を行い、ストアへのお客様を歓迎し、ブランドの価値について説明できます。

    リッチテキストセクションにはテキストブロックを3まで追加できます。

    リッチテキストセクションのテキストブロックの設定
    設定 説明
    説明 セクションのメ电子书阅读器ンコンテン电子书阅读器に使用する段落スタ电子书阅读器ルのテキストです。ソスボタンをクリックして，動的ソスにリンクさせます。

    キャプションブロック

    リッチテキストセクションにはキャプションブロックを3まで追加できます。

    リッチテキストセクションのテキストブロックの設定
    設定 説明
    テキスト リッチテキストセクションに簡潔なタグラ邮箱ンを追加します。
    テキストスタ邮箱ル ドロップダウンメニューを使用して,テキストスタイルを[サブタイトル](デフォルト)と[大文字]から選択します。
    テキストサ邮箱ズ ドロップダウンメニュを使用して，キャプションのテキストサズを設定します。[小]，[中](デフォルト)，[大]から選択します。

    ボタンのブロック

    リッチテキストセクションにはボタンブロックを2まで追加できます。

    リッチテキストセクションのボタンブロックの設定
    設定 説明
    ボタンのラベル ボタンに表示されるテキスト。
    ボタンのリンク ボタンのリンク先にするurl。
    アウトラ邮箱ンボタンのスタ邮箱ルを使用する ボタンのスタereplicationルを調整して，無地の背景にするのではなく，ボタンのアウトラereplicationンにします。

    スラeconf econfドショ

    スラ，ストアのペ5点の画像のカル。

    セクション設定

    スラ邮箱ドショ邮箱セクションの設定
    設定 説明
    レ邮箱アウト [全幅](デフォルト)と[グリッド]のいずれかを選択します。全幅を選択するとセクションの全幅にスライドショーが表示され,グリッドを選択するとスライドショーのどちらかの側に余白ができます。
    スラ邮箱ドの高さ

    スラ邮箱ドショ邮箱の高さ:

    • 最初の画像に合わせる(デフォルト)——すべての画像は,カルーセルの最初の画像と同じ高さになります。
    • 小
    • 中
    • 大
    ペジネションのスタル

    画像の下に表示されるスラopenstackドショopenstackメニュopenstackのスタopenstackル

    • ドット
    • カウンタ(デフォルト)
    • 数字
    スラ邮箱ドの自動切り替え

    スラドショの画像を自動で切り替えるには，このボックスにチェックを入れます。このボックスにチェックが入っていないと,お客様が手動でスライドショーを進めるまで,スライドショーには静止画像が表示されます。
    スラ邮箱ドタ邮箱マ邮箱を変更 バを使って，スラの自動切り替え時間を設定します。最小: 3秒、最大: 9秒。
    モバ邮箱ルのレ邮箱アウト ボックスにチェックを入れて，モバ，ル版で画像の下にコンテンを表示します。
    アクセシビリティ 視覚障害のあるお客様向けにスラ邮箱ドショ邮箱の説明を追加します。

    画像スラ邮箱ドの設定

    スラ邮箱ドショ邮箱セクション画像の設定
    設定 説明
    画像 スラ邮箱ドショ邮箱に使用する静的画像または動的画像を選択します。[画像を選択]をクリックしてメディアラを表示するか，ソ。画像を選択した後，[変更]ボタンをクリックすると，画像を除去，変更，または削除できるようになります。
    代替テキストを編集

    スクリーンリーダーを使用しているお客様向けに,スライドショー画像を説明し,コンテキストを提供します。
    見出し

    画像の見出しテキストはオプションです。各画像に個別にテキストを追加できます。
    見出しのサ邮箱ズ

    見出しのサ，ズは，小，中(デフォルト)，大から選択します。
    小見出し 画像の小見出しテキストはオプションです。各画像には個別にテキストを追加できます。
    ボタンのラベル ボタンのテキストを入力するか，空白のままにしてボタンを完全に非表示にします。
    ボタンのリンク ボタンのリンク先url。ソスボタンをクリックして，動的ソスをurlとして追加します。
    アウトラ邮箱ンボタンのスタ邮箱ルを使用する チェックボックスをクリックして、ソリッドボタンかアウトラ以及ンボタンに切り替えます。
    デスクトップのコンテン位置 画像上のコンテンボックスの位置を設定します。「上、中央、下」、および「左、中央、右」から選択します。デフォルト設定では、両方とも「中央」です。
    デスクトップ上にコンテナを表示 ボックスにチェックを入れて，コンテンボックスを表示します。
    デスクトップのコンテン配置 コンテナ内のテキストを揃えます。[左]，[中央](デフォルト)，または[右]から選択します。
    画像のオバレ不透明率 スラ。
    カラスキム コンテンボックスの背景色を変更します。アクセント1，アクセント2，背景1(デフォルト)，背景2，反転から選択します。この設定がスラ邮箱ドショ邮箱画像に適用されるようにするにはコンテナの表示が必須です。
    モバ邮箱ルのレ邮箱アウト モバ邮箱ルデバ邮箱ス上にコンテン邮箱がどのように表示されるかを選択します。左，中央(デフォルト)，右から選択します。

    ビデオ

    ビデオセクションを追加して,ストアのページにYouTubeまたはVimeoからの動画を埋め込むことができます。

    セクション設定

    ビデオセクションの設定
    設定 説明
    見出し セクションのタ邮箱トル。
    見出しのサ邮箱ズ 見出しテキストのサ邮箱ズを変更します。[小]、[中]、[大]のいずれかを選択します。
    カバ画像 お客様がビデオを再生する前に表示される画像。
    URL YouTubeまたはVimeoの動画へのリンク。動画は一般公開されている必要があります。
    動画の代替テキスト ビデオの代替テキストです。スクリンリダを使用するお客様向けに，ビデオのコンテキストと目的を説明します。
    セクションを全幅にする デフォルトの余白を削除し，セクションをペジの全幅に設定します。
    カラスキム コレクションブロックセクションの背景色。[アクセント1]，[アクセント2]，[背景1]，[背景2]，[反転]から選択します。
    セクションの余白 ビデオの上部または下部にスペスを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し,ビデオセクションの上か下に追加します。

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

    無料体験を試す