オンラインストアの機能

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

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

告知バー

告知バーを使用して、どのページからでもお客様に重要な情報をお伝えすることができます。また。さまざまな告知ブロックを最大12個カスタマイズできます。告知バーに言語セレクター、国/地域セレクター、およびSNSのアイコンを追加することもできます。

複数の告知がある場合、告知を自動で入れ替えるようにするか、お客様がシェブロンボタンを使用して手動で告知を切り替えるようにするかを選択できます。

セクション設定

告知バーセクションの設定

設定	説明
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
区切り線を表示する	告知バーとページのコンテンツを視覚的に区切る線を表示します。
SNSのアイコン	SNSアカウントにリンクするSNSのアイコンを表示します。
自動切り替えの告知	有効にすると告知が自動で入れ替わります。
スライドを変更する間隔	告知が入れ替わる速度を選択します。
国/地域セレクターを有効にする	セレクターを追加して、あなたが決済設定で有効にした国や地域の中から、お客様が選択できるようにします。これによりお客様は自分で選んだ通貨で商品価格を確認できます。
言語セレクターを有効にする	セレクターを追加して、あなたが言語設定で有効にした国や地域の中から、お客様が選択できるようにします。これによりお客様は自分で選んだ言語でストアを閲覧できます。

告知ブロック

告知ブロックにテキストとリンクを追加し、お客様がクリックして特定のページに移動できるようにします。

告知バーセクションの告知ブロックの設定

設定	説明
テキスト	お客様に表示する告知。
リンク	告知バーをクリックしたお客様をリダイレクトするリンクです。

ヘッダー

ヘッダーは、オンラインストアのすべてのページに表示されます。

セクション設定

見出しセクションの設定

設定	説明
デスクトップのロゴ位置	お客様が大画面でサイトを表示する際、ヘッダー上のロゴが表示される場所。モバイルの場合、ロゴの位置は自動的に最適化されます。 左中央 - ロゴは垂直方向に中央揃えし、左端揃えにして、メインメニューと並ぶように表示します。 左上 - ロゴはメインメニューの上に表示し、ロゴとメニュー項目を左端揃えにします。 中央上 (デフォルト) - ロゴをメインメニューの上に表示し、ロゴとメニュー項目を中央揃えにします。
メニュー	メインメニューとして使用するメニュー。[変更] をクリックして、別のメニューを選択します。
デスクトップのメニュータイプ	ドロップダウンメニューを使用して、以下のデスクトップメニューのタイプを選択します。 ドロップダウン - 2番目のレベルのメニューコンテンツが表示され、3番目のレベルのメニューコンテンツは、対応する2番目のレベルのアイテムがクリックされるまで折りたたまれています。メニュータイプはモバイル用に自動で最適化されます。 メガメニュー - 最初のクリック時に2番目と3番目のレベルのメニューコンテンツがすべて表示されます。メニュータイプはモバイル用に自動で最適化されます。 ドロワー - ハンバーガーメニューアイコンを使用してドロワーメニューを表示します。クリックすると1番目のレベルのメニューアイテムがすべて表示されます。それをクリックすると、さらに別のメニューの層 (2番目と3番目のレベル) が開きます。
常時表示のヘッダー	常時表示のヘッダーを使用するかどうか、およびその表示方法を選択します。 なし - ヘッダーとお客様のスクロールは無関係です。 スクロールアップ時 - お客様がページを上にスクロールするとヘッダーが表示されます。 常時 - お客様がページを上または下にスクロールすると、ヘッダーが常に表示されます。 ロゴのサイズを常に小さくする - ヘッダーはお客様がページを上または下にスクロールすると常に表示されます。ロゴのサイズはお客様がページをスクロールすると25%小さくなります。
区切り線を表示する	ヘッダーとページのコンテンツを視覚的に区切る線を表示します。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
国/地域セレクターを有効にする	セレクターを追加して、あなたが決済設定で有効にした国や地域の中から、お客様が選択できるようにします。これによりお客様は自分で選んだ通貨で商品価格を確認できます。
言語セレクターを有効にする	セレクターを追加して、あなたが言語設定で有効にした国や地域の中から、お客様が選択できるようにします。これによりお客様は自分で選んだ言語でストアを閲覧できます。
モバイルのロゴの位置	モバイルで操作する際のロゴの表示位置を選択します。 中央 - ヘッダーの中央にロゴが表示されます。 左 - ヘッダーの左側にロゴが表示されます。
間隔	ヘッダーの下にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、下部の余白に追加します。
セクションの余白	ヘッダーの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、ヘッダーの上部または下部に追加します。

ヘッダーブロック

[ヘッダー] セクションに以下のブロックを追加できます。

ヘッダーセクションのアプリブロックの設定

設定	説明
アプリ	Online Store 2.0と互換性のあるアプリを追加します。最大3個のアプリを追加できます。アプリはカートアイコンの左側に配置され、最大サイズは44 × 44ピクセルになります。

フッター

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

セクション設定

フッターセクションの設定

設定	説明
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
メール登録を表示する	お客様がニュースレターとマーケティングに登録できるメール登録フォームを追加します。
見出し	「メール登録を表示する」フォームのタイトル。「メール登録を表示する」が有効でない場合は表示されません。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
Shopでフォロー	Shopアプリのストアフロントでフォローボタンを表示します。Shopでフォローに関して詳しくはこちらをご覧ください。
SNSのアイコン	テーマ設定でプロフィールリンクを入力したSNSプラットフォームのアイコンを表示します。
国/地域セレクターを有効にする	セレクターを追加して、あなたが決済設定で有効にした国や地域の中から、お客様が選択できるようにします。これによりお客様は自分で選んだ通貨で商品価格を確認できます。
言語セレクターを有効にする	セレクターを追加して、あなたが言語設定で有効にした国や地域の中から、お客様が選択できるようにします。これによりお客様は自分で選んだ言語でストアを閲覧できます。
決済アイコンを表示する	ストアで有効になっている決済方法のアイコンを表示します。決済サービスによってアイコンが登録されていない場合、決済方法でアイコンが表示されない場合があります。お客様がストアにアクセスすると、アイコンが絞り込まれ、お客様の現在の地域と通貨に対応している決済方法だけが表示されます。
ポリシーリンクを表示	著作権情報の横にポリシーリンクのアイコンを表示します。ポリシーリンクは、管理画面の [設定] > [ポリシー] で生成されます。ストアポリシーの追加について詳しくは、こちらをご覧ください。
間隔	フッターの上にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、上部の余白に追加します。
セクションの余白	フッターの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、フッターの上部または下部に追加します。

メニューブロック

フッターセクションのメニューブロックの設定

設定	説明
見出し	ブロックのタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
メニュー	ブロック内に表示するメニューです。フッターにはトップレベルのメニュー項目だけが表示されるため、ドロップダウンメニューのタイプは期待通りには表示されません。

ブランド情報ブロック

ブランド情報はテーマ設定で管理されています。ブランド情報について詳しくはこちらをご覧ください。

フッターセクションにあるブランド情報ブロックの設定

設定	説明
SNSのアイコンを表示する	テーマ設定でプロフィールリンクを入力したSNSプラットフォームのアイコンを表示します。

テキストブロック

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

フッターセクションのテキストブロックの設定

設定	説明
見出し	ブロックのタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
サブテキスト	ブロックに表示するテキスト。

画像ブロック

フッターセクションの画像ブロックの設定

設定	説明
画像	ブロックに表示する画像。
画像の幅	画像の幅を設定します。50ピクセルから200ピクセルの5の倍数に設定できます。デフォルトでは100ピクセルです。
大画面での画像アラインメント	次の条件でブロック内の画像を揃えます。 左 - 画像をブロックの左に揃えます。 中央 (デフォルト) - 画像をブロックの中央に揃えます。 右 - 画像をブロックの右に揃えます。

ブログ記事

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

セクション設定

ブログ記事セクションの設定

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

ブログを選択する

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

コラージュ

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

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

このセクションのすべての画像で推奨されるアスペクト比は2:3または1:1です。

セクション設定

コラージュセクションの設定

設定	説明
見出し	セクションのタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。
デスクトップのレイアウト	コラージュメディアがデスクトップに表示される方法。 左側の大きなブロック (デフォルト) - セクションの最初のブロックは左に、他のブロックよりも大きなサイズで表示されます。 右側の大きなブロック - セクションの最後のブロックは右に、他のブロックよりも大きなサイズで表示されます。
モバイルのレイアウト	モバイル機器でのブロックの表示方法。 コラージュ - 次のようにコラージュレイアウトで画像を表示します。 [デスクトップのレイアウト] で [左側の大きなブロック] が有効になっている場合、セクションの最初のブロックは上部に、他のブロックよりも大きなサイズで表示されます。 [デスクトップのレイアウト] で [右側の大きなブロック] が有効になっている場合、セクションの最後のブロックは下部に、他のブロックよりも大きなサイズで表示されます。 列 - すべてのメディアを同じサイズで、列に表示します。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
セクションの余白	コラージュセクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、セクションの上部または下部に追加します。

ビデオブロック

コラージュセクションのビデオブロックの設定

設定	説明
カバー画像	お客様がビデオを再生する前に表示される画像。管理画面からカスタムのカバー画像をアップロードできます。
URL	YouTubeまたはVimeoの動画へのリンク。動画は一般公開されている必要があります。ビデオはポップアップウィンドウで再生されます。
動画の代替テキスト	ビデオの代替テキストです。スクリーンリーダーを使用するお客様向けに、ビデオのコンテキストと目的を説明します。

商品ブロック

コラージュセクションの商品ブロックの設定

設定	説明
商品	表示する商品。
マウスオーバー時に2番目の画像を表示する	お客様が商品画像にカーソルを合わせると、商品に2枚目の商品画像がある場合は、その画像が表示されます。

コレクションブロック

コラージュセクションのコレクションブロックの設定

設定	説明
コレクション	表示するコレクション。

画像ブロック

コラージュセクションの画像ブロックの設定

設定	説明
画像	セクションの画像。[画像を選択] をクリックして画像を選択するか、[変更] ボタンをクリックして画像を変更または削除します。
代替テキストを編集	画像の簡潔な説明を追加して、SEOを向上させ、スクリーンリーダーを使用しているお客様のために画像の説明を入力します。

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

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

セクション設定

折りたたみ可能なコンテンツセクションの設定

設定	説明
キャプション	折りたたみ可能なコンテンツセクションのキャプションはオプションです。セクションの見出しの上部に表示されます。
見出し	折りたたみ可能なコンテンツセクションの見出し。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。
見出しの配置	セクションの見出しの配置を選択します。[左]、[中央] (デフォルト)、[右] から選択できます。
レイアウト	折りたたみ可能なコンテンツのレイアウトを選択します。 コンテナなし (デフォルト) 行コンテナ - 折りたたみ可能な各行は影付きボックスに含まれています セクションコンテナ - 折りたたみ可能なコンテンツセクション全体は影付きのボックスに含まれています
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
コンテナの配色	コンテナーに適用することができる配色です。カラースキームについて詳しくはこちらをご覧ください。選択したカラースキームは、レイアウトオプションが行またはセクションコンテナーに設定されている場合にのみ表示されます。
最初の折りたたみ可能な行を開く	チェックを入れると、デフォルトでは、折りたたみ可能なコンテンツの最初の行が展開されます。
画像	セクションの画像。[画像を選択] をクリックして画像を選択するか、[変更] ボタンをクリックして画像を変更または削除します。
代替テキストを編集	画像の簡潔な説明を追加して、SEOを向上させ、スクリーンリーダーを使用しているお客様のために画像の説明を入力します。
画像比	セクション画像の画像比: 画像に合わせる (デフォルト) - 画像のアスペクト比を使用します。この比率を使用すると、画像がトリミングされないようになります。 小 大
デスクトップのレイアウト	画像または折りたたみ可能な行のどちらが最初に表示されるかを選択します。デフォルトの設定では、テキストが最初に表示されます。モバイル版では画像がいつも最初に表示されます。
セクションの余白	折りたたみ可能なコンテンツの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、折りたたみ可能なコンテンツセクションの上か下に追加します。

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

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

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

コレクションリスト

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

セクション設定

コレクションリストセクションの設定

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

コレクションを選択する

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

お問い合わせフォーム

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

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

• Name
• メールアドレス (必須)
• 電話番号
• コメント

セクション設定

お問い合わせフォームセクションの設定

設定	説明
見出し	セクションのタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
セクションの余白	お問い合わせフォームの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、お問い合わせフォームセクションの上か下に追加します。

カスタムLiquid

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

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

セクション設定

カスタムLiquidセクションの設定

設定	説明
カスタムLiquid	アプリのスニペットやその他のカスタムLiquidコードを追加して、高度なカスタマイズを作成します。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
セクションの余白	カスタムLiquidセクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、カスタムLiquidセクションの上か下に追加します。

メール登録者バナー

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

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

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

セクション設定

メール登録者バナーセクションの設定

設定	説明
背景画像	メール登録者バナーの背景画像。[変更] をクリックして、画像を変更または削除します。画像が削除されると、テーマの付属画像が表示されます。[背景画像を表示] チェックボックスの選択を解除すると、この画像は非表示になります。
代替テキストを編集	検索エンジンの最適化 (SEO) のために画像のalt属性を設定し、スクリーンリーダーを使用しているお客様のための画像の説明を入力するには、これをクリックします。
画像のオーバーレイ不透明率	オーバーレイでメール登録者バナー画像をぼやかします。スライダーを使ってオーバーレイの不透明率を設定します。デフォルトは0％です。
背景画像を表示	メール登録者バナーの背景画像を表示するには、このボックスにチェックを入れます。
バナーの高さ	ドロップダウンメニューを使用して、メール登録者バナー画像の高さを設定します。[画像に合わせる]、[小]、[中] (デフォルト)、[大] から選択します。
デスクトップのコンテンツ位置	デスクトップコンピューター用のメール登録者バナーの位置を設定します。[上]、[中央]、[下]、および [右]、[中央]、[左] から選択します。デフォルトのオプションでは、両方とも [中央] です。 デスクトップ版では、テキストボックスの一部が画像と重なっています。モバイル版では、画像の下にテキストボックスが表示されます。
デスクトップ上にコンテナを表示	画像上のテキストボックスに、デスクトップコンピューターで買い物をしているお客様向けのメール登録者バナー画像テキストを入力します。
デスクトップのコンテンツ配置	デスクトップコンピューター用の画像バナーテキストの配置を設定します。[右]、[左]、[中央] (デフォルト) から選択します。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。 デスクトップでは、[デスクトップ上にコンテナを表示] オプションが選択されている場合にのみ、選択したカラースキームが表示されます。モバイルでは、[モバイルで画像の下にコンテンツを表示] が選択されている場合にのみ、選択したカラースキームが表示されます。
モバイルのコンテンツ配置	モバイルデバイス用の画像バナーテキストの配置を設定します。[右]、[左]、[中央] (デフォルト) から選択します。
モバイルで画像の下にコンテンツを表示	モバイルデバイスのメール登録者バナー画像の下にコンテンツが表示されます。

見出しのブロック

メール登録者セクションの見出しブロックの設定

設定	説明
見出し	セクションのタイトル。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。

小見出しのブロック

メール登録者セクションの小見出しブロックの設定

設定	説明
説明	セクションの説明。
テキストスタイル	メール登録者セクションのテキストのスタイルを変更します。[本文] (デフォルト) と [サブタイトル] から選択します。

メール登録者

お客様がメールアドレスを入力して、ニュースレターやマーケティングに登録するセクションを追加します。お客様が登録すると、管理画面にお客様アカウントが作成されます。

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

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

セクション設定

メール登録セクションの設定

設定	説明
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
セクションを全幅にする	セクションをブラウザウィンドウの全幅にします。

見出しのブロック

メール登録者セクションの見出しブロックの設定

設定	説明
見出し	セクションのタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。

小見出しのブロック

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

設定	説明
説明	セクションの説明。

メールフォーム

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

特集コレクション

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

セクション設定

特集コレクションセクションの設定

設定	説明
見出し	セクションのタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。動的ソースボタンをクリックして、セクションのタイトルとして動的ソースを挿入します。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。
説明	特集コレクションの説明的なテキストを入力します。テキストを太字や斜体の書式や、リンクを含む書式に設定できます。特集コレクションの説明に動的ソースを挿入するには、[動的ソース] ボタンをクリックします。
管理画面からコレクションの説明を表示する	このチェックボックスをオンにすると、上の [説明] フィールドに入力したテキストではなく、管理画面のコレクションに追加したコレクションの説明が使用されます。
説明のスタイル	ドロップダウンメニューを使用して、特集コレクションの説明のスタイルを選択します。[本文] (デフォルト)、[サブタイトル]、[大文字] の選択肢があります。
コレクション	商品を表示させるコレクション。[変更] をクリックして、コレクションを削除あるいは変更します。
表示する商品の最大数	表示するコレクションの商品数。最小数は2個で最大数は25個です。
デスクトップでの列数	デスクトップコンピューターで表示する列数。最小: 1。最大: 5
商品を全幅にする	ページ幅の設定に関係なく、ウィンドウの全幅に商品を表示するには、チェックボックスをオンにします。
コレクションに表示されているよりも多くの商品がある場合、「すべてを表示」ボタンを有効にする	コレクションの商品数が、[表示する商品の最大数] フィールドで設定された数よりも多い場合、「すべてを表示」ボタンが表示され、お客様はコレクションのページに移動できます。
[すべてを表示] のスタイル	リンク、ソリッドカラーボタン、アウトラインボタンの中から選択します。
デスクトップでカルーセルを有効にする	幅が989ピクセルを超える画面にカルーセルで商品を表示するには、チェックボックスをオンにします。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
画像比	商品画像の画像比: 画像に合わせる (デフォルト) - 画像のアスペクト比を使用します。この比率を使用すると、画像がトリミングされないようになります。 縦長 - 画像を2:3の比率で使用できるようにトリミングします。 正方形 - 画像を1:1の比率で使用できるようにトリミングします。
画像の形状	商品画像の形状を次から1つ選択します。 デフォルト - 商品画像を長方形に変更します。 アーチ ‐ 商品画像の上部に丸みを持たせます。 ブロブ ‐ 商品画像を6つの不揃いな形状 (ブロブ) の1つに変更します。マウスオーバーするとユニークなアニメーションが表示されます。 左向き山形印 - 商品画像を左側に尖りがある山形に変更します。 右向き山形印 - 商品画像を右側に尖りがある山形に変更します。 ひし形 - 商品画像をひし形に変更します。 平行四辺形 - 商品画像を向かい合う2辺が平行な平行四辺形に変更します。 丸形 - 商品画像を円形または楕円形に変更します。マウスオーバーするとユニークなアニメーションが表示されます。
マウスオーバー時に2番目の画像を表示する	お客様が商品画像にカーソルを合わせると、商品に2枚目の商品画像がある場合は、その画像が表示されます。
販売元を表示する	商品の販売元を表示します。
商品の評価を表示	商品の平均評価を星印と括弧内のレビュー数で表示します。例：★★★★★ (8)。また、Shopify Product Reviewsなどの商品レビューアプリが必要であり、メタフィールド定義もreviews.rating_countとreviews.ratingに必要です。
[クイック追加] ボタンを有効にする	[クイック追加] ボタンを使用すると、お客様は商品カードのアイテムをカートに追加できます。商品にバリエーションがある場合、ボタンのタイトルは [オプションを選択] になり、商品の詳細がポップアップに表示されます。ポップアップでは、お客様は希望するバリエーションを選択したり、カートにアイテムを追加したり、[今すぐ購入] ですぐにチェックアウトしたり、クリックしてアイテムの詳細を表示したりすることができます。この設定は、[商品ページ] で [今すぐ購入] ボタンが有効になっているかどうかで変わります。商品テンプレートで [今すぐ購入] ボタンが有効になっていない場合、お客様は商品をカートに追加することはできますが、お客様に [今すぐ購入] のクイックチェックアウトワークフローは表示されません。
モバイルでの列数	モバイルデバイス用の具体的な列のレイアウトを設定します。1列か2列から選択します。
モバイルでスワイプを有効にする	モバイル機器での表示が列から行に変更され、お客様が横にスワイプするとさらに商品が表示されます。
セクションの余白	特集コレクションセクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、特集コレクションセクションの上部または下部に追加します。

特集商品

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

セクション設定

特集商品セクションの設定

設定	説明
商品	セクションで特集する商品。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
サブ背景を表示する	特集商品をサブ背景の配色の上に表示します。
デスクトップメディアの幅	[小]、[中]、[大] いずれかのメディアサイズを選択します。画像はモバイル用に自動で最適化されます。
メディアを画面の高さに制限する	このオプションを選択すると、ブラウザウィンドウの高さに基づいてメディアの最大の高さが設定されます。
適合したメディア	メディアのオリジナルのアスペクト比を維持する場合は [オリジナル] を選択し、メディアを枠に合わせる場合は [枠に合わせる] を選択します。
デスクトップのメディア位置	特集商品メディアを左側と右側のどちらに配置するかを選択します。デスクトップコンピューターでページにアクセスするユーザーにのみ適用されます。
画像ズーム	デスクトップで画像を拡大する方法を選択します。 Lightboxを開く - 大型画像を開きます。モバイル版のデフォルトです。 拡大なし - 画像の拡大を無効にします。高画質ではない画像の場合におすすめです。 クリックしてカーソルを合わせる - クリックして画像を拡大してから、拡大した他のセクションにカーソルを合わせて表示します。拡大された画像を再度クリックしたとき、またはマウスを画像のコンテナーから離したとき、マウスオーバー時のズームは無効になります。この設定が有効になっており、ユーザーがモバイルデバイスを使用している場合、画像はデフォルトでモーダル (Lightbox) で開きます。
他のバリエーションのメディアを非表示にする	1つのバリエーションを選択した後、他のバリエーションのメディアが非表示になるようにするには、このオプションを選択します。
ビデオループを有効にする	ビデオをもう一度再生できるようにします。お客様は再生を開始するためにクリックする必要があります。
セクションの余白	特集商品セクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、セクションの上部または下部に追加します。

セクションブロック

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

特集商品セクションで利用可能なブロック

ブロック	設定
テキスト	次の設定で特集商品のテキストを入力します。 テキスト: テキストまたは動的ソースが利用できます。 テキストスタイル: [本文]、[サブタイトル]、または [大文字] の中から選択します。
Title	見出しサイズ: [小]、[中]、[大] のいずれかを選択します。
価格	このブロックにカスタマイズ可能な設定はありません。
バリエーションピッカー	ピル型ボタンまたはドロップダウンメニューのいずれかを選択します。
数量セレクター	このブロックにカスタマイズ可能な設定はありません。
購入ボタン	[動的チェックアウトボタンを表示する] ボックスにチェックを入れて、[決済] 設定で有効にした動的チェックアウトオプションを表示します。
提供する	お客様が商品をSNSで共有できるようにするクリック可能なテキスト。
商品評価	商品の平均評価を星印と括弧内のレビュー数で表示します。例：★★★★★ (8)。また、Shopify Product Reviewsなどの商品レビューアプリが必要であり、メタフィールド定義もreviews.rating_countとreviews.ratingに必要です。
カスタムLiquid	カスタムLiquidコードまたはHTMLコードを追加します。
アプリ	Online Store 2.0と互換性のあるアプリを追加します。
テキスト付きアイコン	このブロックには、プリインストールされたアイコンのリストまたはアップロードした画像から選択できる最大3個のアイコンが表示されます。画像をアップロードすることを選択した場合、アップロードされた画像によりアイコンのドロップダウン選択が上書きされます。アイコンのレイアウトについては、垂直または水平の方向を選択できます。アイコンを削除するには、見出しフィールドをクリアします。3個を超えるアイコンを表示するには、別の **[テキスト付きアイコン]** ブロックを追加します。
SKU	バリエーションに関連付けられたSKUがある場合、このブロックには、商品に関連付けられたSKU (最小管理単位) が表示されます。[管理画面から商品バリエーションにSKU番号を追加する](/manual/online-store/themes/themes-by-shopify/vintage-themes/customizing-vintage-themes/show-sku#add-sku-numbers-to-your-product-variants-from-the-admin-sectioned%20themes-specific) についての詳細をご覧ください。

画像バナー

画像バナーセクションでは、1つまたは2つの画像、およびボタン付きテキストボックスをサポートしています。2つの画像を使用すると、デスクトップでは2つの画像が並んで表示されます。モバイルでは、画像を横に並べて表示するか、縦列で表示するかを選択できます。

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

セクション設定

画像バナーセクションの設定

設定	説明
最初の画像	バナーのメイン画像。セクションに2つの画像が追加されていると、お客様がデスクトップ版またはモバイル版のどちらを使用しているかに応じて、この画像が左側または上部に表示されます。
代替テキストを編集	検索エンジンの最適化 (SEO) のために画像のalt属性を設定し、スクリーンリーダーを使用しているお客様のための画像の説明を入力するには、これをクリックします。
2番目の画像	バナーの2番目の画像。セクションに2つの画像が追加されていると、お客様がデスクトップ版またはモバイル版のどちらを使用しているかに応じて、この画像が右側または下部に表示されます。
画像のオーバーレイ不透明率	バナー画像にオーバーレイを追加します。スライダーを使って、オーバーレイの不透明率を設定します。デフォルトは0％です。
バナーの高さ	ドロップダウンメニューを使用して、バナー画像の高さを設定します。 最初の画像に対応 - セクションの高さを最初の画像の高さに設定します。 小 - デスクトップ: 420ピクセル、モバイル: 280ピクセル 中 (デフォルト) - デスクトップ: 560ピクセル、モバイル: 340ピクセル 大 - デスクトップ: 720ピクセル、モバイル: 390ピクセル
デスクトップのコンテンツ位置	デスクトップ画像バナーの位置を設定します。[上]、[中央]、[下]、および [右]、[左]、[中央] から選択します。
デスクトップ上にコンテナを表示	バナー画像上のテキストボックスに、デスクトップコンピューターで買い物をしているお客様向けのバナー画像テキストを入力します。
デスクトップのコンテンツ配置	デスクトップコンピューター用の画像バナーテキストの配置を設定します。[右]、[左]、[中央] から選択します。
カラースキーム	そのセクションに適用することができる配色です。カラースキームについて詳しくはこちらをご覧ください。選択したカラースキームは、[デスクトップ上にテキストボックスを表示する] オプションが選択されている場合にのみ表示されます。
アニメーション	画像のアニメーションを選択します。 なし (デフォルト) 周囲の挙動 - コンテナー内で画像の位置をゆっくり移動させる。 背景位置の固定 - お客様がページをスクロールすると、テキストやボタンなどのフォアグラウンドの要素が同じ速度で移動し、背景は固定されます。 スクロールで拡大する - お客様がページをスクロールすると、テキストやボタンなどのフォアグラウンドの要素が同じ速度で移動し、背景は固定され、画像が拡大されます。
モバイルのコンテンツ配置	モバイルデバイス用の画像バナーテキストの配置を設定します。[右]、[左]、[中央] から選択します。
モバイルで画像を重ねる	セクションに2つの画像を追加すると、画像が縦に並べて表示されます。横に並べて表示されることはありません。
モバイル上にコンテナを表示	バナー画像上のテキストボックスに、モバイルデバイスで買い物をしているお客様向けのバナー画像テキストを入力します。

見出しのブロック

画像バナーセクションの見出しブロックの設定

設定	説明
見出し	テキストボックスのタイトルに使用する大きなテキスト。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。

テキストブロック

画像バナーセクションのテキストブロックの設定

設定	説明
説明	段落スタイルのテキストを表示します。
テキストスタイル	画像バナーのテキストのスタイルを変更します。[本文]、[サブタイトル]、および [大文字] から選択します。

ボタンのブロック

画像バナーセクションのボタンブロックの設定

設定	説明
最初のボタンのラベル	最初のボタンに表示されるテキスト。
最初のボタンのリンク	最初のボタンのリンク先にするURL。
アウトラインボタンのスタイルを使用する	ボタンのスタイルを調整して、無地の背景にするのではなく、ボタンのアウトラインにします。
2番目のボタンのラベル	2番目のボタンに表示されるテキストです。
2番目のボタンのリンク	2番目のボタンのリンク先にするURL。
アウトラインボタンのスタイルを使用する	ボタンのスタイルを調整して、無地の背景にするのではなく、ボタンのアウトラインにします。

テキスト付き画像

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

セクション設定

テキスト付き画像セクションの設定

設定	説明
画像	[画像を選択] をクリックして、セクションの画像を選択します。[変更] ボタンをクリックして、画像を変更または削除します。
代替テキストを編集	検索エンジンの最適化 (SEO) のために画像のalt属性を設定し、スクリーンリーダーを使用しているお客様のための画像の説明を入力するには、これをクリックします。
画像の高さ	画像の高さを選択します。 画像に合わせる (デフォルト) 小 中 大
デスクトップ画像の幅	画像の幅: 小 中 (デフォルト) 大
デスクトップ画像の配置	画像とテキストのどちらを最初に表示するかを選択します。モバイル版のデフォルトレイアウトでは、画像が最初に表示されます。 画像を最初にする (モバイル版のデフォルト) 左
デスクトップのコンテンツ位置	コンテナー内コンテンツの垂直位置: 上 (デフォルト) 中央 下
デスクトップのコンテンツ配置	コンテナー内テキストアラインメント: 左 (デフォルト) 中央 右
コンテンツのレイアウト	画像とテキストボックスを互いに重ねることができます。[オーバーラップなし] を選択すると、コンテンツはテキストと画像を表示できるように調整されます。 オーバーラップ オーバーラップなし (デフォルト)
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
アニメーション	画像のアニメーションを選択します。 なし (デフォルト) 周囲の挙動 - コンテナー内で画像の位置をゆっくり移動させる。 スクロールで拡大する - お客様がページをスクロールすると、テキストやボタンなどのフォアグラウンドの要素が同じ速度で移動し、背景は固定され、画像が拡大されます。
モバイルのレイアウト	モバイルデバイス用のコンテンツの配置を選択します。 左 (デフォルト) 右 中央
セクションの余白	テキスト付き画像セクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、テキスト付き画像セクションの上か下に追加します。

見出しのブロック

テキスト付き画像セクションの見出しブロックの設定

設定	説明
見出し	セクションのタイトルテキストです。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。

テキストブロック

テキスト付き画像セクションのテキストブロックの設定

設定	説明
コンテンツ	テキストセクションに段落スタイルのテキストを表示します。
テキストスタイル	コンテンツテキストのスタイル: 本文 (デフォルト) サブタイトル

ボタンのブロック

テキスト付き画像セクションのボタンブロックの設定

設定	説明
ボタンのラベル	ボタンに表示されるテキスト。
ボタンのリンク	ボタンのリンク先にするURL。

キャプションブロック

テキスト付き画像セクションのキャプションブロックの設定

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

マルチカラム

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

セクション設定

マルチカラムセクションの設定

設定	説明
見出し	セクションのタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。
画像の幅	列に追加された画像の幅。 列の全幅 (デフォルト) - 画像の幅は列と同じサイズです。 列の半分の幅 - 画像の幅は列の半分のサイズです。 列の幅の1/3 - 画像の幅は列のサイズの3分の1です。
画像比	画像には次の画像比があります。 画像に合わせる (デフォルト) - 画像のアスペクト比を使用します。この比率を使用すると、画像がトリミングされません。 縦長 - 画像を2:3の比率で使用できるようにトリミングします。 正方形 - 画像を1:1の比率で使用できるようにトリミングします。 円形 - 画像をトリミングして円形で表示します。
デスクトップでの列数	範囲スケールを使用してデスクトップコンピューターで表示する列数を選択します。最小は1、最大は6です。
列の配置	列内の画像とテキストには次のアラインメントがあります。 左 (デフォルト) - 画像とテキストを左揃えにします。 中央 - 画像とテキストを中央揃えにします。
サブ背景	[なし] を選択して第2の背景色を非表示にするか、[列の背景を表示する] を選択して列コンテナーの色を変更します。
ボタンのラベル	ボタンに表示されるテキスト。
ボタンのリンク	ボタンのリンク先にするURL。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
モバイルでの列数	モバイルデバイス用の具体的な列のレイアウトを設定します。1列か2列から選択します。
モバイルでスワイプを有効にする	モバイル機器での表示が列から行に変更され、お客様が横にスワイプするとコレクションブロックがさらに表示されます。
セクションの余白	マルチカラムセクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、マルチカラムセクションの上か下に追加します。

列のブロック

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

マルチカラムセクションの列ブロックの設定

設定	説明
画像	表示させる画像。
見出し	列のタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
説明	列の段落テキストです。
リンクラベル [オプション]	列ブロックの下に追加されたリンクのテキストです。リンクを追加しない場合は空白のままにします。
リンク	リンクのURL。リンクがない場合は空白のままにします。

複数行

各行に画像、テキスト、オプションのボタンがある複数の行を含むセクションを追加できます。選択した商品、コレクション、またはブログ記事を目立たせるため、テキストと画像を組み合わせます。出品状況、スタイル、場合によってはレビュー提供についての詳細を追加します。

また、動的ソースを使用してメタオブジェクトのコンテンツを表示することもできます。メタオブジェクトの内容を表示するには、メタオブジェクトを作成して内容を作成し、メタオブジェクトにストアフロントへのアクセス権を付与します。そうすると、複数行セクションでその内容を使用できるようになります。

セクション設定

複数行セクションの設定

設定	説明
画像の高さ	画像の高さを選択します。 画像に対応 小 中 (デフォルト) 大
デスクトップ画像の幅	画像の幅: 小 中 (デフォルト) 大
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。
テキストスタイル	テキストのスタイルを変更します。[本文] (デフォルト) と [サブタイトル] から選択します。
ボタンのスタイル	ソリッドカラーボタン、アウトラインボタンから選択します。
デスクトップのコンテンツ位置	コンテナー内コンテンツの垂直位置: 上位 中央 (デフォルト) 下
デスクトップのコンテンツ配置	コンテナー内テキストアラインメント: 左 (デフォルト) 中央 右
デスクトップ画像の配置	画像の位置を選択します。配置はモバイル用に自動で最適化されます。 左から交互に (デフォルト) 右から交互に 左寄せ 右寄せ
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
コンテナの配色	コンテナに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
モバイルのレイアウト	モバイルデバイス用のコンテンツの配置を選択します。 左 (デフォルト) 右 中央
セクションの余白	複数行のセクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、テキスト付き画像セクションの上か下に追加します。

行ブロック

複数行セクションの行ブロックの設定

設定	説明
画像	[画像を選択] をクリックして行の画像を選択します。[変更] ボタンをクリックして画像を変更または削除します。ソースボタンをクリックして動的ソースにリンクします。
代替テキストを編集	検索エンジンの最適化 (SEO) のために画像のalt属性を設定し、スクリーンリーダーを使用しているお客様のための画像の説明を入力するには、これをクリックします。
キャプション	画像にタグラインまたはキャプションを追加します。
見出し	行のタイトルテキストです。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
テキスト	行に段落スタイルのテキストを表示します。
ボタンのラベル	ボタンに表示されるテキスト。
ボタンのリンク	ボタンのリンク先にするURL。

ページ

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

セクション設定

ページセクションの設定

設定	説明
ページ	表示するオンラインストアのページ。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
セクションの余白	ページセクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、ページセクションの上か下に追加します。

リッチテキスト

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

セクション設定

リッチテキストセクションの設定

設定	説明
デスクトップのコンテンツ位置	リッチテキストのコンテナーの位置を選択します。ドロップダウンメニューを使用して、[左]、[中央] (デフォルト)、または [右] を選択します。コンテンツはモバイルデバイス向けに自動的に最適化されます。
コンテンツアラインメント	この設定を使用すると、リッチテキストセクション内にあるすべてのブロックのテキストアラインメントに影響が及びます。ドロップダウンメニューを使用して、[左]、[中央] (デフォルト)、または [右] を選択します。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
セクションを全幅にする	セクションのサイズはデフォルトで全幅です。
セクションの余白	リッチテキストセクションの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、リッチテキストセクションの上か下に追加します。
動的ソースへの接続	リッチテキストセクションの動的ソースを使用して、メタフィールドやメタオブジェクトなどの情報を参照します。リスト参照を使用して、テーマ内のテキストのリストを出力することもできます。たとえば、メタフィールドリスト (参照されているメタオブジェクトで利用可能場合でも) を使用して、テーマ内でリッチテキストの設定がなされているテキストのリストを出力することができます。

見出しのブロック

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

リッチテキストセクションの見出しブロックの設定

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

テキストブロック

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

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

リッチテキストセクションのテキストブロックの設定

設定	説明
説明	セクションのメインコンテンツに使用する段落スタイルのテキストです。ソースボタンをクリックして、動的ソースにリンクさせます。

キャプションブロック

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

リッチテキストセクションのテキストブロックの設定

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

ボタンのブロック

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

リッチテキストセクションのボタンブロックの設定

設定	説明
ボタンのラベル	ボタンに表示されるテキスト。
ボタンのリンク	ボタンのリンク先にするURL。
アウトラインボタンのスタイルを使用する	ボタンのスタイルを調整して、無地の背景にするのではなく、ボタンのアウトラインにします。

スライドショー

スライドショーセクションを追加して、ストアのページに最大5点の画像のカルーセルを表示します。

セクション設定

スライドショーセクションの設定

設定	説明
レイアウト	[全幅] (デフォルト) と [グリッド] のいずれかを選択します。全幅を選択するとセクションの全幅にスライドショーが表示され、グリッドを選択するとスライドショーのどちらかの側に余白ができます。
スライドの高さ	スライドショーの高さ: 最初の画像に合わせる - すべての画像は、カルーセルの最初の画像と同じ高さになります。 小 中 (デフォルト) 大
ページネーションのスタイル	画像の下に表示されるスライドショーメニューのスタイル ドット カウンター (デフォルト) 数字
スライドの自動切り替え	スライドショーの画像を自動で切り替えるには、このボックスにチェックを入れます。このボックスにチェックが入っていないと、お客様が手動でスライドショーを進めるまで、スライドショーには静止画像が表示されます。
スライドタイマーを変更	バーを使って、スライドショーの自動切り替え時間を設定します。最小: 3秒、最大: 9秒。
アニメーション	画像のアニメーションを選択します。 なし (デフォルト) 周囲の挙動 - コンテナー内で画像の位置をゆっくり移動させる
モバイルのレイアウト	ボックスにチェックを入れて、モバイル版で画像の下にコンテンツを表示します。
アクセシビリティ	視覚障害のあるお客様向けにスライドショーの説明を追加します。

画像スライドの設定

スライドショーセクション画像の設定

設定	説明
画像	スライドショーに使用する静的画像または動的画像を選択します。[画像を選択] をクリックしてメディアライブラリーを表示するか、ソースボタンをクリックして動的ソースを接続します。画像を選択した後、[変更] ボタンをクリックすると、画像を除去、変更、または削除できるようになります。
代替テキストを編集	スクリーンリーダーを使用しているお客様向けに、スライドショー画像を説明し、コンテキストを提供します。
見出し	画像の見出しテキストは任意です。各画像には個別にテキストを追加できます。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しのサイズは、小、中 (デフォルト)、大から選択します。
小見出し	画像の小見出しテキストは任意です。各画像には個別にテキストを追加できます。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
ボタンのラベル	ボタンのテキストを入力するか、空白のままにしてボタンを完全に非表示にします。
ボタンのリンク	ボタンのリンク先URL。ソースボタンをクリックして、動的ソースをURLとして追加します。
アウトラインボタンのスタイルを使用する	チェックボックスをクリックして、ソリッドボタンかアウトラインボタンに切り替えます。
デスクトップのコンテンツ位置	画像上のコンテンツボックスの位置を設定します。「上、中央、下」、および「左、中央、右」から選択します。デフォルト設定では、両方とも「中央」です。
デスクトップ上にコンテナを表示	ボックスにチェックを入れて、コンテンツボックスを表示します。
デスクトップのコンテンツ配置	コンテナー内のテキストを揃えます。[左]、[中央] (デフォルト)、または [右] から選択します。
画像のオーバーレイ不透明率	スライダーを使って画像オーバーレイの不透明率を調整します。
カラースキーム	そのセクションに適用することができる配色です。カラースキームについて詳しくはこちらをご覧ください。この設定がスライドショー画像に適用されるようにするにはコンテナーの表示が必須です。
モバイルのレイアウト	モバイルデバイス上にコンテンツがどのように表示されるかを選択します。左、中央 (デフォルト)、右から選択します。

ビデオ

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

セクション設定

ビデオセクションの設定

設定	説明
見出し	セクションのタイトル。ボタンを使用して、テキストを太字や斜体にしたり、リンクを追加したりします。
見出しのサイズ	見出しテキストのサイズを変更します。[小]、[中]、[大] のいずれかを選択します。
ビデオをループ再生する	オンにすると、ビデオは終了後に最初から再生されます。
ビデオ	自分のビデオを選択するか、セクションに追加します。ビデオを編集してカスタムのカバー画像を使用したり、代替テキストを追加したりできます。Shopifyがホストするビデオが追加されている場合、そのビデオは、以下の設定のURLのビデオよりも優先して使用されます。
URL	ビデオに対するYouTubeまたはVimeoのリンク。ビデオは一般公開されている必要があり、Shopifyがホストするビデオが上述の設定に追加されていない場合に限り表示されます。
カバー画像	お客様がビデオを再生する前に表示される画像。
動画の代替テキスト	ビデオの代替テキストです。スクリーンリーダーを使用するお客様向けに、ビデオのコンテキストと目的を説明します。
セクションを全幅にする	デフォルトの余白を削除し、セクションをページの全幅に設定します。
カラースキーム	このセクションに適用する色のセットです。カラースキームについて詳しくはこちらをご覧ください。
セクションの余白	ビデオの上部または下部にスペースを追加します。範囲スライダーを使用してスペースを0ピクセルから100ピクセルの間で設定し、ビデオセクションの上か下に追加します。