Be Yours では、任意のページにセクションを追加できます。各ページには、アナウンス バー、ヘッダー、フッターなど、いくつかのデフォルト セクションが表示されます。
このページでは
アナウンスバー
お知らせバーを使用すると、どのページからでも重要な情報を顧客に伝えることができます。表示するアナウンス ブロックを最大 6 つまでカスタマイズできます。アナウンス バーにリンクを追加してクリック可能にし、顧客を特定のページに誘導できます。
セクション設定
| 設定 | 説明 |
|---|---|
| ホームページのみに表示 | アナウンスメッセージをホームページにのみ表示します。 |
| デスクトップでカルーセル スタイルを使用する | お知らせをデスクトップに 1 項目のスライダー スタイルで表示します。モバイルでは、このスタイルがデフォルトのレイアウトです。 |
カルーセル スタイルの設定
| 設定 | 説明 |
|---|---|
| 自動回転アナウンス | カルーセルが自動的に再生されるように設定します。これにより、再生切り替えボタンも追加されます。 |
| アナウンスを変更する間隔 | アナウンスを変更する頻度を選択します。 |
| ナビゲーションを表示 | ナビゲーションボタンを表示します。 |
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | アナウンスのテキストの色を変更します。 |
| 背景 | アナウンスバーの背景の色を変更します。 |
アナウンスブロック
| 設定 | 説明 |
|---|---|
| 文章 | 顧客に表示するアナウンス。 |
| リンク | 顧客がアナウンス バーをクリックした場合に移動するリンク。 |
ヘッダ
ヘッダーはテーマ内のすべてのページに表示されます。
セクション設定
| 設定 | 説明 |
|---|---|
| ロゴイメージ | あなたの店のロゴ。 |
| カスタムロゴの高さ | ロゴの高さ (ピクセル単位)。 30 ピクセルから 120 ピクセルまで。デフォルトは 50 ピクセルです。 |
| デスクトップのロゴの位置 | 顧客がデスクトップなどの大画面でサイトを表示するときに、ヘッダー内のロゴが表示される場所。
|
| メニュー | メインメニューに使用するメニュー。 |
| ドロップダウンメニューを有効にする | メニューをドロップダウン形式で表示します。メガメニューの設定方法については、この記事を参照してください。 |
| 区切り線を表示する | ヘッダーとページのコンテンツを視覚的に分離するための線を表示します。 |
| スティッキーヘッダーを有効にする | 顧客が上にスクロールすると、ヘッダーが再表示されます。顧客が下にスクロールすると表示されなくなります。 |
| アイコンの重み | ヘッダー アイコンをどのくらいの太さで表示するかを設定します。エクストラライトからエクストラボールドに合わせて厚みが増しています |
透過ヘッダーの設定
| 設定 | 説明 |
|---|---|
| ホームページで有効にする | ホームページで透明ヘッダーを有効にします。 |
| コレクションページで有効にする | コレクション ページで透明なヘッダーを有効にします。 |
| カスタムページ | 透明ヘッダーを有効にするページにリンクされている項目を含むメニュー。さらに詳しい手順については、 この記事に従ってください。 |
| 区切り線を表示する | ヘッダーとページのコンテンツを視覚的に分離するための線を表示します。 |
| 文字の色 | 透明ヘッダーのテキストの色を変更します。 |
| ロゴイメージ | 透明ヘッダーが有効になっているページでこのロゴを使用します。 |
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | ヘッダーテキストの色を変更します。この設定は透過ヘッダーには適用されません。 |
| ライン | セパレータを含むヘッダー行の色を変更します。この設定は透過ヘッダーには適用されません。 |
| 背景 | ヘッダーの背景の色を変更します。この設定は透過ヘッダーには適用されません。 |
フッター
フッターはテーマのすべてのページに表示されます。
セクション設定
| 設定 | 説明 |
|---|---|
| 電子メールのサインアップを表示 | 顧客がニュースレターやマーケティングを購読できる電子メール登録フォームが含まれています。 |
| 見出し | 電子メールのサインアップ フォームを表示するためのタイトル。 [メール サインアップを表示する]が有効になっていない場合、これは表示されません。 |
| 小見出し | 電子メールのサインアップ フォームを表示するための 2 番目のテキスト。 [メール サインアップを表示する]が有効になっていない場合、これは表示されません。 |
| ソーシャルメディアアイコンを表示する | テーマ設定でプロフィール リンクを入力したソーシャル メディア プラットフォームのアイコンを表示します。 |
| 見出し | ソーシャル メディア アイコンのタイトル。 [ソーシャル メディア アイコンを表示]が有効になっていない場合、これは表示されません。 |
| 国/地域セレクターを有効にする | 支払い設定で有効にした国と地域を顧客が選択できるセレクターを追加し、顧客が選択した通貨で商品価格を表示できるようにします。 |
| 言語セレクターを有効にする | 言語設定で有効にした国と地域を顧客が選択できるセレクターを追加し、顧客が選択した言語でストアを閲覧できるようにします。 |
| 支払いアイコンを表示する | ストアで有効になっているすべての支払い方法のアイコンが表示されます。 |
| 追加の著作権テキスト | このテキストは、ストアが著作権によって保護されていることを一般に通知します。 |
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | フッターテキストの色を変更します。 |
| 見出し | フッターの見出しの色を変更します。 |
| リンク | フッターリンクの色を変更します。 |
| ライン | フッター線の色を変更します。 |
| 背景 | フッターの背景の色を変更します。 |
メニューブロック
| 設定 | 説明 |
|---|---|
| 見出し | ブロックのタイトル。 |
| メニュー | ブロック内に表示するメニュー。 |
テキストブロック
テキストブロックを使用して、店舗の詳細、プロモーション、連絡先情報などの重要な情報を強調表示できます。
| 設定 | 説明 |
|---|---|
| 見出し | ブロックのタイトル。 |
| サブテキスト | ブロック内に表示するテキスト。 |
画像ブロック
| 設定 | 説明 |
|---|---|
| 画像 | ブロック内に表示する画像。 |
| 画像の幅 | 画像の幅を設定します。 50 ピクセルから 200 ピクセルまでの 5 の倍数を指定できます。デフォルトは 100 ピクセルです。 |
| 大画面での画像の配置 | ブロック内の画像を位置合わせします。
|
| リンク | 顧客が画像をクリックした場合に移動するリンク。 |
| 説明 | 画像の説明。 |
ブログ投稿
Shopify ストアにブログがある場合は、ブログ投稿セクションを使用して、そのブログの投稿をハイライト表示できます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| ブログ | ブログ投稿を表示したいブログ。デフォルトは、ブログページのアルファベット順の最初のブログです。 |
| ブログ投稿 | セクションに表示するブログ投稿の数。最大: 4 ポスト。 |
| ブログに表示されているよりも多くのブログ投稿が含まれている場合は、「すべて表示」ボタンを有効にします | ブログに[ブログ投稿]フィールドに設定されているよりも多くのブログ投稿がある場合、顧客をブログのページに誘導する [すべて表示] ボタンが表示されます。 |
モバイルレイアウト設定
| 設定 | 説明 |
|---|---|
| モバイルでスワイプを有効にする | モバイル表示を 1 行のみに変更し、顧客が横にスワイプして他のブログ投稿を表示できるようにします。 |
| モバイルで 1 列を有効にする | モバイル表示を 1 行に 1 つのブログ投稿に変更します。 |
ブログカードの設定
| 設定 | 説明 |
|---|---|
| 注目の画像を表示 | ブログ投稿の注目の画像を表示します。推奨される画像アスペクト比: 2:3。 |
| 画像比率 | ブログ投稿画像の画像比率:
|
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
タイトルブロック
| 設定 | 説明 |
|---|---|
| 上映日 | ブログ投稿が公開された日付が表示されます。 |
| 著者を表示 | ブログ投稿の作成者を表示します。 |
| コメント数を表示 | ブログ投稿の公開されたコメントの数を表示します。 |
抜粋ブロック
このブロックには、ブログ投稿の抜粋が表示されます。調整可能な設定はありません。
「ブログ投稿」セクションの各ブログ投稿には、投稿の抜粋の最初の 55 単語が表示されます。ブログ投稿に抜粋がない場合は、代わりに投稿の最初の 30 単語が表示されます。
続きを読むブロック
このブロックには、ブログ投稿に移動するリンクが表示されます。調整可能な設定はありません。
ブログを選択してください
- テーマ エディターで、ブログ投稿セクションのタイトルをクリックします。
- [ブログ]セクションで、 [変更] をクリックします。
- ブログを選択します。
- [選択]をクリックし、 [保存]をクリックします。
コラージュ
ビデオ、画像、製品、コレクションのコラージュを作成できます。各コラージュセクションには 3 つのブロックが含まれています。デフォルトでは、セクションにはビデオ、製品、およびコレクションのブロックが含まれています。
3 つ以上のブロックからなるコラージュを作成するには、最初のブロックの下に追加のコラージュ セクションを追加し、下のコラージュ セクションには見出し値を含めないでください。コラージュ セクションは 1 つのセクションとして流れているように見えます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| デスクトップのレイアウト | デスクトップ上でのブロックの表示方法。
|
| モバイルレイアウト | モバイルでのブロックの表示方法。
|
| 画像にオーバーレイを適用する | 画像にオーバーレイを追加することでテキストの読みやすさが向上します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
ビデオブロック
| 設定 | 説明 |
|---|---|
| 表紙画像 | 顧客がビデオを再生する前に表示される画像。 |
| URL | ビデオへの YouTube または Vimeo リンク。ビデオは一般公開されている必要があります。 |
| 動画の代替テキスト | スクリーン リーダーを使用している顧客がビデオにアクセスできるように、ビデオについて説明します。 |
| ビデオの見出し | ビデオブロックの見出し。 |
製品ブロック
| 設定 | 説明 |
|---|---|
| 製品 | 表示したい商品です。 |
| ホバー時に 2 番目の画像を表示 | 顧客が製品画像の上にカーソルを置くと、製品に 2 番目の製品画像がある場合は 2 番目の製品画像が表示されます。 |
| クイックビューを有効にする | すべての重要な製品の詳細を表示するポップアップを開くボタンを追加します。 |
コレクションブロック
| 設定 | 説明 |
|---|---|
| コレクション | 表示したいコレクション。 |
画像ブロック
| 設定 | 説明 |
|---|---|
| 画像 | 表示したい画像。 |
| 見出し | コラムのタイトル。 |
| リンク | 顧客が画像をクリックした場合に移動するリンク。 |
コレクションリスト
強調表示するコレクションのリストを追加できます。コレクション リストには、最大 12 個のコレクション ブロックを追加できます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| 画像比率 | コレクションの注目画像の画像比率:
|
| 画像にオーバーレイを適用する | 画像にオーバーレイを追加することでテキストの読みやすさが向上します。 |
| リストに含まれるコレクションがストア全体よりも少ない場合は、「すべて表示」ボタンを有効にします | コレクション リストのコレクションがストア全体よりも少ない場合は、顧客をコレクションのリストに誘導する [すべて表示] ボタンが表示されます。 |
モバイルレイアウト設定
| 設定 | 説明 |
|---|---|
| モバイルでスワイプを有効にする | モバイル表示を 1 行のみに変更し、顧客が横にスワイプしてさらに多くのコレクション ブロックを表示できるようにします。 |
| モバイルで 1 列を有効にする | モバイル表示を行ごとに 1 つのコレクションに変更します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
コレクションを選択する
- テーマ エディターから、コレクションを追加するコレクションブロックをクリックします。
- [コレクションの選択]をクリックします。
- コレクションをクリックし、 [選択] をクリックします。
お問い合わせフォーム
お問い合わせフォームでは、すべての送信内容がストアの送信者メールアドレスに送信されます。送信者のメールアドレスは、管理者の 一般設定で変更できます。
フォームには次のフィールドがあります。
- 名前
- メールアドレス(必須)
- コメント
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 電話番号を表示 | 電話番号の入力画面が表示されます。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
コンタクトプレスブロック
| 設定 | 説明 |
|---|---|
| 見出し | コラムのタイトル。 |
| サブテキスト | ブロック内に表示するテキスト。 |
| リンク | 顧客がテキストをクリックした場合に移動するリンク。 |
ソーシャルメディアアイコンのブロック
テーマ設定でプロフィール リンクを入力したソーシャル メディア プラットフォームのアイコンを表示します。
| 設定 | 説明 |
|---|---|
| 見出し | コラムのタイトル。 |
カウントダウンタイマー
このセクションには、特定の時刻に期限切れになるように設定されているアクティブなカウントダウン クロックが表示されます。セール開始、出店、限定特典の終了など幅広くご利用いただけます。これは、特定の製品の週間売上カウントダウン タイマーのサンプルです。
セクション設定
| 設定 | 説明 |
|---|---|
| 画像 | セクションの画像。 |
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップのレイアウト | デスクトップ上のセクションのレイアウト:
|
| デスクトップのコンテンツの位置 | デスクトップ上のコンテンツの垂直位置を設定します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップ上で表示されるときの画像の高さを決定します。
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
| モバイルレイアウト | デスクトップ上のセクションのレイアウト:
|
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときの画像の高さを決定します。
|
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | テキストボックスの色を変更します。 |
| 背景 | テキストボックスの背景の色を変更します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトルの大きなテキスト。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
テキストブロック
| 設定 | 説明 |
|---|---|
| 説明 | セクションに段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
カウントダウンブロック
| 設定 | 説明 |
|---|---|
| 終了日 | カウントダウンを終了したい日付を入力します。形式はmm-dd-yyyyである必要があります。サンプルとして、カウントダウンを 2022 年 10 月 9 日に終了する場合、値は10-09-2022である必要があります。 |
| 数字のサイズ | 数値テキストのサイズ:
|
| メッセージ | タイマーがゼロになったときに表示するメッセージを設定するだけです。 |
| メッセージサイズ | メッセージのサイズ:
|
カスタムリキッド
独自の Liquid コードを追加してカスタム セクションを作成できます。
- ダウンロードしたアプリの手順に記載されているアプリ スニペットを追加すると、ページにアプリを簡単に導入できます。
- カスタムの Liquid コードをエディターに直接追加します。
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
メール登録
顧客が電子メール アドレスを入力してニュースレターやマーケティングを購読できるセクションを追加できます。顧客が購読すると、管理画面に顧客アカウントが作成されます。
このセクションには 3 つのデフォルト ブロックが付属しています。
- 見出し
- 小見出し
- メールフォーム
セクション設定
| 設定 | 説明 |
|---|---|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
小見出しブロック
| 設定 | 説明 |
|---|---|
| 説明 | セクションの説明。 |
メールフォーム
電子メール フォーム ブロックには、顧客がマーケティングにサインアップするために電子メール アドレスを入力できるフィールドが表示されます。ブロックにはカスタマイズ可能な設定はありません。
空きスペース
このセクションを使用すると、セクション間の垂直スペースの高さをさまざまなデバイスに合わせてカスタマイズできます。
セクション設定
| 設定 | 説明 |
|---|---|
| デスクトップの高さ | デスクトップ上で表示されるときの空きスペースの高さを決定します。 0 ピクセルから 200 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。デフォルトは 40 ピクセルです。 |
| モバイルの高さ | モバイルで表示するときの空きスペースの高さを決定します。 0 ピクセルから 200 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。デフォルトは 28 ピクセルです。 |
よくある質問
FAQ (よくある質問) セクションには、動的なアコーディオン スタイルのレイアウトを使用して、顧客からのよくある質問と回答が表示されます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| セクションを狭くする | 容器が狭くなります。 |
| 二次背景を有効にする | 背景に色を追加します。色はテキストの色から補間されます。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
リッチテキストブロック
このブロックを使用して、質問の別のセクションを作成します。
| 設定 | 説明 |
|---|---|
| 見出し | ブロックのタイトル。 |
| コンテンツ | ブロック内に表示するテキスト。 |
クエスチョンブロック
this ブロックを使用して、展開可能な回答ボックスを追加します。
| 設定 | 説明 |
|---|---|
| 質問 | ブロックの質問です。 |
| 答え | ブロックの答え。 |
注目の製品
特定の製品を紹介するセクションを追加できます。
セクション設定
| 設定 | 説明 |
|---|---|
| 製品 | このセクションで取り上げたい製品。 |
| デスクトップのレイアウト | デスクトップ上のセクションのレイアウト:
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
| バリアントを選択した後、他のバリアントのメディアを非表示にする | バリアントが選択されると、他のバリアントの画像が表示されなくなります。バリアントの選択を解除すると、画像が再表示されます。 |
| 画像ズームを有効にする | メイン画像のズーム機能をオンにします。 |
| ビデオループを有効にする | ビデオを再度再生できるようにします。顧客はクリックして再生を開始する必要があります。 |
| 画像比率 | この設定は、[レイヤー画像を有効にする]が有効な場合にのみ有効です。 商品画像の画像比率：
|
| 画像の焦点 | この設定は、[レイヤー画像を有効にする]が有効な場合にのみ有効です。 ビュー内でレイヤー化された画像の最も重要な領域を選択します。 |
| レイヤー化された画像を有効にする | 絶対位置の画像を重ねます。商品に4枚以上ある場合は最初の4枚の画像が使用されます。他のメディア タイプは無視されます。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
セクションブロック
Be Yours では、注目の製品セクションに次のブロックを追加できます。
| ブロック | 設定 | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| 文章 | 注目の製品のテキストを入力してください:
| ||||||||||
| タイトル | 製品のタイトルを表示します。
| ||||||||||
| 説明 | 商品の説明を表示します。調整可能な設定はありません。 | ||||||||||
| 価格 | 価格や価格での比較など、製品の価格情報を表示します。調整可能な設定はありません。 | ||||||||||
| バリアントピッカー | 製品のバリアント オプションを表示します。
| ||||||||||
| 購入ボタン | このブロックには、「カートに追加」ボタンと店舗受け取り情報が表示されます。動的チェックアウト ボタンを表示することもできます。
| ||||||||||
| 在庫状況 | 製品の在庫状況を顧客にタイムリーに知らせるメッセージを表示します。
| ||||||||||
| 画像 | 信頼バッジの画像に最適なカスタム画像を表示します。
| ||||||||||
| 続きを読む | 顧客を製品詳細ページに誘導するリンクを追加します。 | ||||||||||
| 共有 | 顧客が製品をソーシャル メディアで共有できるようにします。調整可能な設定はありません。 | ||||||||||
| 製品の評価 | 製品の平均評価を星で表示し、括弧内にレビュー数を表示します (例: ★★★★★ (8))。また、 Shopify Product Reviewsなどの製品レビュー アプリと、 reviews.rated_count および reviews.rated のメタフィールド定義も必要です。 | ||||||||||
| カスタムリキッド | カスタムの Liquid または HTML コードを追加します。 | ||||||||||
| 折りたたみ可能なタブ | このブロックには、タイトル付きの折りたたみ可能なタブが表示されます。顧客がタイトルをクリックすると、タブが展開されて追加のコンテンツが表示されます。
| ||||||||||
| ポップアップ | このブロックには、クリックするとポップアップ ウィンドウが開くクリック可能なテキストが表示されます。このポップアップには、ページの 1 つのコンテンツが表示されます。
| ||||||||||
| 空きスペース | ブロック間にカスタムの高さの空きスペースをさまざまなデバイスに追加します。 |
注目のコレクション
1 つのコレクションに商品を表示するセクションを追加できます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| コレクション | どのコレクションから商品を表示するか。 |
| 展示できる最大の商品数 | コレクションから表示する製品の数。偶数である必要があります。最小値: 2。最大値: 12。 |
| コレクションに表示されている以上の製品がある場合は、「すべて表示」ボタンを有効にします | コレクションに「表示する製品の最大数」フィールドに設定されている製品よりも多くの製品がある場合、顧客をコレクション ページに移動する「すべて表示」ボタンが表示されます。 |
モバイルレイアウト設定
| 設定 | 説明 |
|---|---|
| モバイルでスワイプを有効にする | モバイル表示を 1 行のみに変更し、顧客が横にスワイプしてより多くの製品を表示できるようにします。 |
| モバイルでは 1 列を表示 | モバイル表示を 1 行に 1 つの製品に変更します。 |
プロダクトカードの設定
| 設定 | 説明 |
|---|---|
| 画像比率 | 商品画像の画像比率：
|
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| ホバー時に 2 番目の画像を表示 | 顧客が製品画像の上にカーソルを置くと、製品に 2 番目の製品画像がある場合は 2 番目の製品画像が表示されます。 |
| カートにクイック追加ボタンを表示する | 顧客が製品画像の上にカーソルを置くと、カートにクイック追加ボタンが表示されます。製品にバリエーションがある場合、ボタンは製品詳細ページにリンクします。 |
| ベンダーを表示 | 製品の販売元を表示します。 |
| 製品の評価を表示する | 製品の平均評価を星で表示し、括弧内にレビュー数を表示します (例: ★★★★★ (8))。また、 Shopify Product Reviewsなどの製品レビュー アプリと、 reviews.rated_count および reviews.rated のメタフィールド定義も必要です。 |
| クイックビューを有効にする | すべての重要な製品の詳細を表示するポップアップを開くボタンを追加します。 |
| 色見本を有効にする | スウォッチを表示すると、色をすばやく選択できます。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
保証
このセクションには、顧客を尊重するための取り組みが表示されます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| レイアウト | これは、セクション上にブロックがどのように表示されるかです。サイドバーオプションを使用すると、デフォルトではヘッダーが上部に配置されるのではなく、左側にヘッダーが配置されるレイアウトが作成されます。 |
| 列の配置 | 列内の画像とテキストの配置:
|
| 二次背景を有効にする | 背景色を追加します。色はテキストの色から補間されます。 |
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
保証ブロック
| 設定 | 説明 |
|---|---|
| アイコン | メッセージに対応する既製の SVG アイコンを選択します。 [なし]オプションを選択すると、アイコンが無効になります。 |
| 見出し | テキスト ボックスのタイトルの大きなテキスト。 |
| コンテンツ | 列内の段落テキスト。 |
イメージバナー
画像バナー セクションは、1 つまたは 2 つの画像と、ボタン付きのテキスト ボックスをサポートします。 2 つの画像が使用されている場合、デスクトップ上に並べて表示されます。モバイルでは、画像を横に並べて表示するか縦列に表示するかを選択できます。
デスクトップでは、テキスト ボックスが画像の一部を覆います。モバイルでは、テキスト ボックスが画像の下に表示されます。
セクション設定
| 設定 | 説明 |
|---|---|
| 最初の画像 | バナーのメイン画像。セクションに 2 つの画像が追加された場合、この画像は、顧客がデスクトップを使用しているかモバイルを使用しているかに応じて、左側または上部に表示されます。 |
| 2番目の画像 | バナーの二次画像。セクションに 2 つの画像が追加された場合、この画像は、顧客がデスクトップを使用しているかモバイルを使用しているかに応じて、右側または下部のいずれかに表示されます。 |
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップのコンテンツの位置 | 画像バナーを基準にしてコンテンツを配置します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップ上で表示されるときの画像の高さを決定します。
|
| デスクトップにコンテナを表示する | 読みやすくするために、背景が暗いテキスト部分のコンテナを追加します。 |
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
モバイルレイアウト設定
| 設定 | 説明 |
|---|---|
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときの画像の高さを決定します。
|
| モバイルで画像をスタックする | モバイルでは画像を縦一列に表示します。 |
| 画像の下にテキストを表示 | テキストは画像の上ではなく、画像の下に表示されます。 |
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | テキストボックスの色を変更します。 |
| かぶせる | オーバーレイの色を変更します。 |
| オーバーレイの不透明度 | オーバーレイを使用してバナー画像を暗くします。スライダーを使用してオーバーレイの不透明度を設定します。デフォルトは 30% です。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | テキスト ボックスのタイトルの大きなテキスト。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
テキストブロック
| 設定 | 説明 |
|---|---|
| 説明 | 段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
テキスト付きの画像
画像とテキスト ブロックを含むセクションを追加し、顧客を新しいページにリンクするオプションのボタンを追加できます。テキストと画像を組み合わせて、選択した製品、コレクション、またはブログ投稿に焦点を当てます。在庫状況、スタイルに関する詳細を追加したり、レビューを提供したりすることもできます。
セクション設定
| 設定 | 説明 |
|---|---|
| 画像 | セクションの画像。 |
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップのレイアウト | デスクトップ上のセクションのレイアウト:
|
| デスクトップのコンテンツの位置 | デスクトップ上のコンテンツの垂直位置を設定します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップ上で表示されるときの画像の高さを決定します。
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときの画像の高さを決定します。
|
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトルの大きなテキスト。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
テキストブロック
| 設定 | 説明 |
|---|---|
| 説明 | セクションに段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
| 二次色を有効にする | 文字の色に基づいて少し明るい色を適用します。 |
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
テキストオーバーレイを含む画像
カスタム テキスト オーバーレイを備えた大きな画像を顧客に紹介できます。メッセージには、製品について説明したり、お知らせを共有したり、店舗への顧客を歓迎したりすることができます。
セクション設定
| 設定 | 説明 |
|---|---|
| 画像 | セクションの画像。 |
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップのコンテンツの位置 | デスクトップ上のコンテンツの垂直位置を設定します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップ上で表示されるときの画像の高さを決定します。
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
| モバイルレイアウト | デスクトップ上のセクションのレイアウト:
|
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときの画像の高さを決定します。
|
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | テキストボックスの色を変更します。 |
| かぶせる | オーバーレイの色を変更します。 |
| オーバーレイの不透明度 | オーバーレイを使用してバナー画像を暗くします。スライダーを使用してオーバーレイの不透明度を設定します。デフォルトは 30% です。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトルの大きなテキスト。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
テキストブロック
| 設定 | 説明 |
|---|---|
| 説明 | セクションに段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
| 二次色を有効にする | 文字の色に基づいて少し明るい色を適用します。 |
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
テキストを含むレイヤー画像
4 つの画像とテキスト ブロックを含むセクションを追加し、顧客を新しいページにリンクするオプションのボタンを追加できます。テキストと 4 つの画像を組み合わせて、選択した製品、コレクション、またはブログ投稿に焦点を当てます。在庫状況、スタイルに関する詳細を追加したり、レビューを提供したりすることもできます。
セクション設定
| 設定 | 説明 |
|---|---|
| 最初の画像 | セクションのメイン画像。 |
| 2番目の画像 | セクションの 2 番目のイメージ。 |
| 3枚目の画像 | セクションの 3 番目のイメージ。 |
| 4枚目の画像 | セクションの 4 番目のイメージ。 |
| 画像比率 | 商品画像の画像比率：
|
| 画像の焦点 | 表示されている画像の中で最も重要な領域を選択します。 |
| デスクトップのレイアウト | デスクトップ上のセクションのレイアウト:
|
| デスクトップのコンテンツの位置 | デスクトップ上のコンテンツの垂直位置を設定します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトルの大きなテキスト。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
テキストブロック
| 設定 | 説明 |
|---|---|
| 説明 | セクションに段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
| 二次色を有効にする | 文字の色に基づいて少し明るい色を適用します。 |
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
ルックブック
このセクションでは、画像ボード上に製品のピンを作成し、各ピンが顧客を製品の詳細に誘導します。
| 設定 | 説明 |
|---|---|
| 画像 | セクションの画像。 |
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
ルックブロック
1 つのセクションに最大 6 つのルックを含めることができます。
| 設定 | 説明 |
|---|---|
| 製品 | 表示したい商品です。 |
| クイックビューを有効にする | 顧客を製品詳細ページに誘導する代わりに、すべての重要な製品詳細を表示するポップアップを開きます。 |
| 色 | ホットスポットの色を設定します。 |
| 水平位置 | スポットと画像の左端の間の距離を指定します。 |
| 縦位置 | スポットと画像の上端の間の距離を指定します。 |
地図
このセクションには、ビジネスの場所を示す Google マップが表示されます。
| 設定 | 説明 |
|---|---|
| 地図の住所 | Google はこの値に基づいて場所を検索するため、できるだけ詳細な住所を入力する必要があります。 |
| Google マップ API キー | 地図を機能させるには、Google Maps API キーを独自に登録する必要があります。お持ちでない場合は、この手順に従って登録し、API キーをコピーしてここに貼り付けてください。 |
| 地図のズーム | 現在のビューの解像度。許可されるズーム レベルは 12 ～ 20 です。これが何を意味するかを理解するには、値を 0 にすると、世界全体が地図上に表示されます。 |
| マップスタイル | 標準の Google マップ スタイル。プレビューについては、このスタイリング ウィザードを確認してください。 |
| 画像 | Google マップの読み込みに失敗した場合、画像が地図を置き換えます。 |
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップのコンテンツの位置 | デスクトップ上のコンテンツの垂直位置を設定します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップ上で表示されるときの画像の高さを決定します。
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
| モバイルレイアウト | デスクトップ上のセクションのレイアウト:
|
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときの画像の高さを決定します。
|
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | テキストボックスの色を変更します。 |
| かぶせる | オーバーレイの色を変更します。 |
| オーバーレイの不透明度 | オーバーレイを使用してバナー画像を暗くします。スライダーを使用してオーバーレイの不透明度を設定します。デフォルトは 30% です。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトルの大きなテキスト。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
テキストブロック
| 設定 | 説明 |
|---|---|
| 説明 | セクションに段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
| 二次色を有効にする | 文字の色に基づいて少し明るい色を適用します。 |
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
複数列
マルチカラム セクションを使用して、コンテンツを列レイアウトで表示し、列の下にボタンを追加して顧客を新しいページに移動できます。テキストと画像を組み合わせて、選択した製品、コレクション、ブログ投稿に焦点を当てます。可用性、スタイルに関する詳細を追加するか、レビューを提供します。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| 画像比率 | 商品画像の画像比率：
|
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップコンテンツの配置 | デスクトップ上の列内の画像とテキストの配置:
|
モバイルレイアウト設定
| 設定 | 説明 |
|---|---|
| モバイルコンテンツの調整 | モバイルでの列内の画像とテキストの配置:
|
| モバイルでスワイプを有効にする | モバイル表示を 1 行のみに変更します。顧客は横にスワイプして、より多くの列ブロックを表示できます。 |
| モバイルで 1 列を有効にする | モバイル表示を 1 行あたり 1 列に変更します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
コラムブロック
1 つのセクションには最大 12 列を含めることができます。 1 列、2 列、または 3 列のブロックがある場合、それらはデスクトップ上で 1 行に表示されます。 4 つ以上の列ブロックがある場合、それらは 2 列のレイアウトで表示されます。
| 設定 | 説明 |
|---|---|
| 画像 | 表示したい画像。 |
| 見出し | コラムのタイトル。 |
| 説明 | 列内の段落テキスト。 |
| ボタンラベル | ボタンに表示されるテキスト。列にボタンを含めたくない場合は、このフィールドを空のままにしておきます。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
ページ
カスタム ページのコンテンツをセクションに表示するように選択できます。これにより、ページのコンテンツ全体がセクションに取り込まれますが、テンプレートからの Liquid コードは取り込まれません。
このセクションの配色では次の設定が使用されます。
- デフォルトでは、テキストはTextの色です。ページ上のテキストに適用される特定のスタイルはセクションに反映されます。
- ハイパーリンクはアウトラインボタンの色です。
セクション設定
| 設定 | 説明 |
|---|---|
| ページ | 表示するオンライン ストアのページ。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| セクションを狭くする | 容器が狭くなります。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
引用
見積もりは、販売者が以前の顧客やブランド サポーターからの肯定的なメッセージを表示することで顧客との信頼を築くことができるため、重要です。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
引用ブロック
このブロックを使用して、質問の別のセクションを作成します。
| 設定 | 説明 |
|---|---|
| アイコン | 引用テキストのすぐ上に表示される既製のアイコンを選択します。 [なし]オプションを選択すると、アイコンが無効になります。
|
| 引用 | カスタム テキスト。顧客からのレビューやブランド パートナーからのメッセージが考えられます。 |
| 著者 | カスタム テキスト。これは顧客の名前またはブランド パートナーの名前です。 |
バナーを明らかにする
このセクションには、スクロール動作に基づいてコンテンツを自動的に非表示または表示するバナーが表示されます。
セクション設定
| 設定 | 説明 |
|---|---|
| 画像 | セクションの画像。 |
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップ上で表示されるときの画像の高さを決定します。
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときの画像の高さを決定します。
|
| 画像の下にテキストを表示 | テキスト部分をモバイル上に重ねるのではなく、画像の下に配置します。 |
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | テキストボックスの色を変更します。 |
| かぶせる | オーバーレイの色を変更します。 |
| オーバーレイの不透明度 | オーバーレイを使用してバナー画像を暗くします。スライダーを使用してオーバーレイの不透明度を設定します。デフォルトは 30% です。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションとペアになる主テキストを追加します。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
小見出しブロック
| 設定 | 説明 |
|---|---|
| 小見出し | セクションとペアになる 2 番目のテキストを追加します。 |
| 小見出しのサイズ | 小見出しテキストのサイズ:
|
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| ビデオボタンのラベル | ビデオボタンに表示されるテキスト。 |
| 動画のURL | ビデオへの YouTube または Vimeo リンク。ビデオは一般公開されている必要があります。 |
| 動画の代替テキスト | スクリーン リーダーを使用している顧客がビデオにアクセスできるように、ビデオについて説明します。 |
テキストスライドブロック
お客様が一番下までスクロールすると、テキスト スライドブロックが表示されます。
| 設定 | 説明 |
|---|---|
| 見出し | ブロックのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| 説明 | テキスト ブロックに段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
| 文字の色 | テキストボックスの色を変更します。 |
| 背景色 | テキストボックスの背景の色を変更します。 |
リッチテキスト
ヘッダー、段落コンテンツ、および顧客を新しいページにリンクするボタンを含むリッチ テキスト セクションを追加できます。
セクション設定
| 設定 | 説明 |
|---|---|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| セクションを狭くする | 容器が狭くなります。 |
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
テキストブロック
テキストブロックは、ブランドに関する情報を顧客と共有するための良い方法です。製品の利点を説明したり、お知らせをしたり、店舗への顧客を歓迎したり、ブランド価値について話したりすることができます。
| 設定 | 説明 |
|---|---|
| 説明 | セクションのメインコンテンツの段落スタイルのテキスト。 |
| 記載サイズ | 説明テキストのサイズ:
|
| 二次色を有効にする | 文字の色に基づいて少し明るい色を適用します。 |
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
スライドショー
画像のスライドショーをホームページに追加できます。スライドショー セクションでは、スライドの高さを設定したり、テキストやボタンを追加したり、スライドショーを自動的に再生するかどうかを選択したりできます。スムーズなトランジション効果を得るには、通常、少なくとも 3 つのスライドを使用することをお勧めします。
セクション設定
| 設定 | 説明 |
|---|---|
| スライドショーの種類 | スライドショーの外観を決定します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップ上で表示されるときの画像の高さを決定します。
|
| スライドの自動回転 | スライドショーが自動的に再生されるように設定します。 |
| スライドを切り替える間隔 | スライドを変更する頻度を選択します。 |
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときの画像の高さを決定します。
|
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | テキストボックスの色を変更します。 |
| 背景 | 背景の色を変更します。 |
| かぶせる | レガシータイプでは、画像上のオーバーレイの色を変更します。モダンタイプでは、テキストのコンテナの色が変更されます。 |
| オーバーレイの不透明度 | レガシータイプでは、バナー画像をオーバーレイで薄暗くします。モダンタイプでは、テキストのコンテナーが薄暗くなります。 |
| ナビゲーションボタンのテキスト | ナビゲーション上の矢印アイコンの色を変更します。 |
| ナビゲーション ボタンの背景 | ナビゲーションの背景色を変更します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
画像スライドブロック
1 つのセクションには最大 6 つの画像スライドを含めることができます。
| 設定 | 説明 |
|---|---|
| 画像 | 表示したい画像。 |
| モバイル画像 | オプションで、モバイル用の画像を設定できます。 |
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップのコンテンツの位置 | デスクトップ上の画像を基準にしてコンテンツを配置します。
|
| 小見出し | 画像とペアになるセカンダリ テキストを追加します。このテキストは見出しテキストの上に表示されます。 |
| 小見出しのサイズ | 小見出しテキストのサイズ:
|
| 見出し | 画像と組み合わせるメインのテキストを追加します。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| 説明 | 画像と組み合わせる段落テキストを追加します。このテキストは見出しテキストの下に表示されます。 |
| 記載サイズ | 説明テキストのサイズ:
|
| ボタンラベル | ボタンに表示されるテキスト。セクションにボタンを含めたくない場合は、このフィールドを空のままにしておきます。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
タブコラージュ
ビデオ、画像、製品、コレクションのコラージュをタブ スタイルで作成できます。各タブ コラージュセクションには最大 6 つのブロックが含まれます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| デスクトップのレイアウト | デスクトップ上のセクションのレイアウト:
|
| デスクトップのコンテンツの位置 | デスクトップ上のコンテンツの垂直位置を設定します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップ上で表示されるときの画像の高さを決定します。
|
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
| モバイルレイアウト | デスクトップ上のセクションのレイアウト:
|
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときの画像の高さを決定します。
|
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | テキストボックスの色を変更します。 |
| 背景 | テキストボックスの背景の色を変更します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
ビデオブロック
| 設定 | 説明 |
|---|---|
| 表紙画像 | 顧客がビデオを再生する前に表示される画像。 |
| URL | ビデオへの YouTube または Vimeo リンク。ビデオは一般公開されている必要があります。 |
| 見出し | コラムのタイトル。 |
| 説明 | コラムの説明。 |
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
製品ブロック
| 設定 | 説明 |
|---|---|
| 製品 | 表示したい商品です。 |
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
コレクションブロック
| 設定 | 説明 |
|---|---|
| コレクション | 表示したいコレクション。 |
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
画像ブロック
| 設定 | 説明 |
|---|---|
| 画像 | 表示したい画像。 |
| 見出し | コラムのタイトル。 |
| 説明 | コラムの説明。 |
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
お客様の声
オンラインで購入を決定する場合、顧客レビューや消費者の声が販売の成否を左右します。このセクションは、専用のページ セクションを使用して社会的証明を構築し、コンバージョンを増やすのに役立ちます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| 推薦文の自動ローテーション | 推薦文が自動的に再生されるように設定します。 |
| 紹介文を変更する間隔 | 推薦を変更する頻度を選択します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
お客様の声ブロック
このブロックを使用して、質問の別のセクションを作成します。
| 設定 | 説明 |
|---|---|
| アイコン | 紹介文のすぐ上に表示される既製のアイコンを選択します。 [なし]オプションを選択すると、アイコンが無効になります。
|
| 証言 | カスタム テキスト。これは顧客からのレビューである可能性があります。 |
| 作者のイメージ | これは、お客様の声をより信頼できるものにするための顧客のイメージである可能性があります。 |
| 著者 | カスタム テキスト。これは顧客の名前である可能性があります。 |
ビデオ
ビデオ セクションを追加して、YouTube または Vimeo のビデオをストアのページに埋め込むことができます。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
| 表紙画像 | 顧客がビデオを再生する前に表示される画像。 |
| URL | ビデオへの YouTube または Vimeo リンク。ビデオは一般公開されている必要があります。 |
| 動画の代替テキスト | スクリーン リーダーを使用している顧客がビデオにアクセスできるように、ビデオについて説明します。 |
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
ポップアップ
訪問者/クライアントに電子メール購読を行うよう求めるオンサイトメッセージをポップアップで表示します。
このセクションには 6 つのブロックが含まれています。
- 見出し
- 小見出し
- 文章
- ボタン
- ソーシャルメディアアイコン
- ニュースレター
- フローティングバー
セクション設定
| 設定 | 説明 |
|---|---|
| 表示モード | ニーズに合ったモードを選択してください。
|
| ホームページのみに表示 | ホーム ページにのみポップアップを表示します。 |
| 訪問者のみに表示 | 訪問者のみにポップアップを表示します。登録ユーザーには非表示になります。 |
| 遅れ | ポップアップが表示されるまでの遅延時間 (秒)。 |
| 頻度 | 閉じられたポップアップが再表示されるまでの日数。 |
| ポップアップの幅 | ポップアップの幅 (ピクセル単位)。 |
| コンテンツのパディング | ポップアップの内部空間のピクセル単位の厚さ。 |
| コンテンツの配置 | コンテンツの配置を設定します。
|
| 画像 | ポップアップ用の画像です。 SEO を改善するための Google のインタースティシャル ガイドラインを満たすため、画像はモバイルでは表示されません。 |
| デスクトップの位置 | ポップアップ コンテンツに対する画像の位置:
|
| 色:テキスト | 文字の色を変更します。 |
| 色:ボーダー | ボタンの枠線や下線などの枠線の色を変更します。 |
| 色:背景 | ポップアップの背景の色を変更します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル |
| 見出しのサイズ | 見出しテキストのサイズ:
|
小見出しブロック
| 設定 | 説明 |
|---|---|
| 小見出し | セクションのタイトル |
| 小見出しのサイズ | 小見出しテキストのサイズ:
|
テキストブロック
| 設定 | 説明 |
|---|---|
| 説明 | セクションに段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
| 二次色を有効にする | 文字の色に基づいて少し明るい色を適用します。 |
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。ボタンを非表示にするには、ラベルを空白のままにします。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
ソーシャルメディアアイコンのブロック
テーマ設定でプロフィール リンクを入力したソーシャル メディア プラットフォームのアイコンを表示します。調整可能な設定はありません。
ニュースレターブロック
ニュースレター ブロックには、顧客がマーケティングにサインアップするために電子メール アドレスを入力できるフィールドが表示されます。
| 設定 | 説明 |
|---|---|
| 説明 | セクションに段落スタイルのテキストを表示します。 |
| アウトラインボタンスタイルを使用する | ボタンにアウトライン スタイルを使用します。 |
| ボタンを全幅にする | ボタンをテキスト ボックスの横に配置するのではなく、ポップアップの幅全体に拡張します。 |
フローティングバーブロック
フローティング バー ブロックでは、画面の左側または右側に粘着性の垂直バーが表示され、買い物客はバーをクリックしてポップアップを開くことができます。
| 設定 | 説明 |
|---|---|
| 見出し | バーの見出し。クリックしてポップアップを開くことができます。 |
| ソーシャルメディアアイコンを表示する | テーマ設定でプロフィール リンクを入力したソーシャル メディア プラットフォームのアイコンが含まれます。 |
| コンテンツの位置 | ツールバーの位置を設定します。
|
| 色 | 見出しとソーシャルメディアアイコンの色を変更します。 |
| モバイルで無効にする | ツールバーをデスクトップのみに表示します。 |
最近見た商品
顧客が以前にアクセスしたことのある製品を見つけて購入を促すのに役立ちます。これにより、顧客はナビゲーション メニューから道を見つけるよりも、再度見つけやすくなります。
セクション設定
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトル。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
モバイルレイアウト設定
| 設定 | 説明 |
|---|---|
| モバイルでスワイプを有効にする | モバイル表示を 1 行のみに変更し、顧客が横にスワイプしてより多くの製品を表示できるようにします。 |
| モバイルでは 1 列を表示 | モバイル表示を 1 行に 1 つの製品に変更します。 |
プロダクトカードの設定
| 設定 | 説明 |
|---|---|
| 画像比率 | 商品画像の画像比率：
|
| 画像の焦点 | 表示されている画像の最も重要な領域を選択します。 |
| ホバー時に 2 番目の画像を表示 | 顧客が製品画像の上にカーソルを置くと、製品に 2 番目の製品画像がある場合は 2 番目の製品画像が表示されます。 |
| カートにクイック追加ボタンを表示する | 顧客が製品画像の上にカーソルを置くと、カートにクイック追加ボタンが表示されます。製品にバリエーションがある場合、ボタンは製品詳細ページにリンクします。 |
| ベンダーを表示 | 製品の販売元を表示します。 |
| 製品の評価を表示する | 製品の平均評価を星で表示し、括弧内にレビュー数を表示します (例: ★★★★★ (8))。また、 Shopify Product Reviewsなどの製品レビュー アプリと、 reviews.rated_count および reviews.rated のメタフィールド定義も必要です。 |
| クイックビューを有効にする | すべての重要な製品の詳細を表示するポップアップを開くボタンを追加します。 |
| 色見本を有効にする | スウォッチを表示すると、色をすばやく選択できます。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
ビデオヒーロー
背景のビデオとボタン付きのテキスト ボックスで構成される大きなバナーを表示します。
セクション設定
| 設定 | 説明 |
|---|---|
| URL | ビデオへの YouTube または Vimeo リンク。ビデオは一般公開されている必要があります。 MP4 ビデオ ファイルへの直接リンクを置くこともできます。 |
| デスクトップのコンテンツの位置 | 画像バナーを基準にしてコンテンツを配置します。
|
| デスクトップコンテンツの配置 | デスクトップ上のコンテンツの配置を設定します。
|
| デスクトップの高さ | デスクトップで表示するときのビデオの高さを決定します。
|
| デスクトップにコンテナを表示する | デスクトップでは、ビデオ オーバーレイを縮小してテキスト コンテンツのコンテナにし、読みやすくします。 |
| セクションを全幅にする | セクションをブラウザ ウィンドウの全幅にします。 |
モバイルレイアウト設定
| 設定 | 説明 |
|---|---|
| モバイルコンテンツの調整 | モバイルでのコンテンツの配置を設定します。
|
| モバイルの高さ | モバイルで表示するときのビデオの高さを決定します。
|
| 画像の下にテキストを表示 | テキストはビデオの上に横たわるのではなく、ビデオの下に表示されます。 |
セクションの色の設定
| 設定 | 説明 |
|---|---|
| 文章 | テキストボックスの色を変更します。 |
| かぶせる | オーバーレイの色を変更します。 |
| オーバーレイの不透明度 | オーバーレイの不透明度を設定します。 |
セクションのパディング設定
| 設定 | 説明 |
|---|---|
| 上部のパディング | セクションの上部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
| 底部のパディング | セクションの下部内部空間の高さを決定します。 0 ピクセルから 100 ピクセルの範囲で、算術的に 4 ピクセルずつ増加します。 |
見出しブロック
| 設定 | 説明 |
|---|---|
| 見出し | セクションのタイトルの大きなテキスト。 |
| 見出しのサイズ | 見出しテキストのサイズ:
|
テキストブロック
| 設定 | 説明 |
|---|---|
| 説明 | セクションに段落スタイルのテキストを表示します。 |
| 記載サイズ | 説明テキストのサイズ:
|
| 二次色を有効にする | 文字の色に基づいて少し明るい色を適用します。 |
ボタンブロック
| 設定 | 説明 |
|---|---|
| ボタンラベル | ボタンに表示されるテキスト。 |
| ボタンリンク | ボタンのリンク先となる URL。 |
| 下線ボタンのスタイルを使用する | ボタンに下線スタイルを使用します。 |
