Express向けのセクション

このページはMar 08, 2021に印刷されています。最新のバージョンについては、https://help.shopify.com/ja/manual/online-store/os/using-themes/themes-by-shopify/express/sectionsをご覧ください。

テーマコンテンツはセクションを使用して作成されます。セクションは、オンラインストアのさまざまなページのレイアウトと外観を決定するカスタマイズ可能なコンテンツブロックです。

静的セクションは、オンラインストアの所定のロケーションに表示されるセクションです。これらのセクションを削除または再配置することはできません。静的セクションには、商品ページやコレクションページなどのページ上で、ヘッダー、フッター、ナビゲーションセクション、またはコンテンツセクションが含まれる場合があります。たとえば、商品セクションでは、オンラインストアの各商品ページの外観を決定します。

動的セクションはオプションセクションで、ホームページのレイアウトをカスタマイズするために使用することができます。ストアのホームページで、動的セクションを追加、再配置、また削除してページレイアウトを作成することができます。ホームページには最大25個の動的セクションを追加できます。

Express独自のセクションの選択、およびビジネスに適したカスタマイズ方法を詳しく知ることができます。

静的セクション

Expressには次の静的セクションが含まれます。

動的セクション

Expressには次の動的セクションが含まれます。

ヘッダー

テーマのヘッダーは、ストアの各ページの上部に表示されるセクションです。

ヘッダーで次のアイテムをカスタマイズできます。

  • ロゴ
  • 告知バー
  • メニュー
  • 検索

カスタムロゴを追加する

あなたの会社のロゴを、ストアのヘッダー部分に追加することができます。最適なフォーマットは、背景を透明にした.pngファイルです。ロゴ画像の最大幅は180ピクセルです。幅を調整することで、ロゴ画像のサイズを変更できます。

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. [ヘッダー] をクリックします。
  2. ロゴ画像エリアで [画像を選択する] をクリックのうえ、次のいずれかの操作を行います。 - 管理画面にアップロードした画像を選択するには、[ライブラリー] タブをクリックします。
    • ローカルコンピューターから画像を選択する場合は、[ライブラリー] > [アップロードする] をクリックします。
  3. ロゴの幅をカスタマイズするには、ロゴの幅をカスタマイズするスライダーを使用します。
  4. [保存] をクリックします。

告知バーを追加する

ヘッダーに告知バーを追加してお客様にメッセージを表示できます。メッセージはカスタマイズ可能で、連絡先情報、ストアのイベントや販売に関する情報、またはストアのスローガンを含めることが可能です。

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. [ヘッダー] をクリックします。
  2. 告知エリアで、[告知を表示する] にチェックを入れます。
  3. 告知のテキストを入力します。
  4. オプション: URLを入力して告知へのリンクを追加します。
  5. オプション: アイコンメニューから、告知バーに表示するアイコンを選択します。アイコンには告知のテキストと同じ色が使われます。
  6. 告知バーの背景色を変更するには、バーの色見本をクリックして色を選択します。
  7. 告知のテキストの配色を変更するには、テキストの色見本をクリックして配色を選択します。
  8. [保存] をクリックします。

メニューを追加する

ヘッダーにメニューを追加できます。ヘッダーにすべてのメニューのリンクが表示されるので、お客様がアクセスする共通のページを強調することができます。たとえば、コレクションへのリンクを含むメニューを追加できます。

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。

  1. [ヘッダー] をクリックします。

  2. メニューを選択するには、[変更する] をクリックします。リストからメニューを選択するか、[メニューを作成する] をクリックして新しいメニューを作成します。

  3. メニューを編集するには、[メニューを編集する] をクリックします。

  4. [保存] をクリックします。

検索を有効にする

ヘッダーに検索オプションを追加できます。そうすることにより、お客様はストア内のアイテムをすぐに見つけることができます。

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. [ヘッダー] をクリックします。
  2. [検索を表示する] をオンにします。
  3. [保存] をクリックします。

フッター

テーマのフッターは、ストアの各ページの下部に表示されるセクションです。 以下の機能をフッターに追加できます。

  • 決済アイコン
  • メニュー
  • ニュースレターの登録
  • あなたのビジネスに関する情報を含むテキストセクション
  • SNSのアイコン
  • 言語セレクター

決済アイコンを追加する

フッターには、対応している決済方法のアイコンを表示することができます。このエリアには、管理画面の決済設定セクションで有効にした決済サービスに関連付けられているアイコンが表示されます。

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。

  1. [フッター] をクリックします。

  2. [決済アイコンを表示する] にチェックを入れます。

  3. [保存] をクリックします。

メニュー、ニュースレターの登録、またはテキストを追加する

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。

  1. [フッター] をクリックします。

  2. コンテンツエリアの [コンテンツを追加する] をクリックして、コンテンツブロックを追加します。次の選択肢からブロックの種類を選択します。

- [Menu](/manual/online-store/os/menus-and-links)

- [Newsletter](/manual/online-store/os/using-themes/change-the-layout/theme-settings/theme-newsletter)

- Text

最大4つのコンテンツブロックを追加することができます。

コンテンツブロックを削除するには、ブロックをクリックしてから [コンテンツを削除] をクリックします。

コンテンツブロックをカスタマイズするには、ブロックをクリックしてから設定を編集します。

  1. [保存] をクリックします。

ヒント: このセクションのブロックを再配置するには、各ブロックのドラッグアンドドロップハンドル⋮⋮を使用することができます。

SNSのアイコンを追加する

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。

  1. [テーマ設定] をクリックします。

  2. [SNS] をクリックします。

  3. ソーシャルメディアで共有する画像をアップロードするには、ソーシャルメディアで共有する画像エリアで、[画像を選択する] または [無料の画像を探す] をクリックします。

  4. 商品やブログ記事にソーシャルメディアでの共有ボタンを追加するには、以下のオプションのいずれかまたはすべてを確認してください。

- Facebookでシェアする - Twitterにツイートする - Pinterestでピンする (ブログ記事共有には使用できません)

  1. SNSアカウントへのリンクを追加するには、アカウントの下のフィールドにアカウントへのリンクを入力します。https://instagram.com/shopify、またはhttps://twitter.com/shopifyなどの完全なリンクを入力します。

  2. 共有ボタンのスタイルを変更するには、ボタンのスタイルメニューから [ブランド化されました] または [ロゴのみ] を選択します。

  3. [保存] をクリックします。

言語セレクターを追加する

複数のストアの言語を有効にしている場合にのみ、言語セレクターを追加する必要があります。

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。

  1. [セクション] をクリックします。

  2. [フッター] をクリックします。

  3. [言語セレクター] で、[言語セレクターを表示する] を選択します。

  4. [保存] をクリックします。

商品

購入者が特集コレクションから商品をクリックすると、商品ページが表示されます。商品ページには商品の説明、価格、バリエーション、画像が表示されます。新たなページにユーザーを誘導するか、ホームページ上にオーバーレイで商品の詳細を表示するかを選択することができます。この設定はテーマ設定で管理されます。[商品ページをオーバーレイで表示する] を有効にすると、特集コレクションから商品が選択されたとき、商品ページはオーバーレイとして表示されます。

商品セクションには、以下の設定が含まれます。

  • 数量セレクターを表示する - ユーザーがカートに追加する数量を指定することができます。
  • 販売元を表示する - 商品のブランドまたは販売元を商品ページに表示します。ブランドや販売元を表示するには、商品に販売元を追加する必要があります。
  • 動的チェックアウトボタンを表示する - お客様がカートをスキップして、特集商品セクションから直接チェックアウトに進むことができます。
  • オーバーレイで商品ページを表示する: このオプションを選択すると、現在のページ上にオーバーレイ形式で商品の詳細を表示できます。オーバーレイは、特集コレクションから商品が選択されている場合に表示されます。
  • SNSでの共有ボタンを表示する - お客様が商品をSNSで共有できるようボタンを表示します。これらのボタンはテーマ設定で管理されます。

商品の設定を編集する

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  3. ページ上部のドロップダウンメニューを開きます。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [テンプレート] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [テンプレート] をタップします。
  1. [商品] をクリックします。
  2. 設定を使用して、商品ページをカスタマイズします。
  3. [保存] をクリックします。

商品の推奨

お客様が興味のある可能性がある他の商品を見つけやすくするために、商品ページにおすすめ商品を表示できます。

[オーバーレイで商品ページを表示する] が商品ページに対して有効になっている場合に、このセクションからアクセスすると、現在のページ上にオーバーレイ形式で商品の詳細を表示できます。

商品のおすすめを有効にする

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  3. ページ上部のドロップダウンメニューを開きます。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [テンプレート] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [テンプレート] をタップします。

  1. [商品ページ] を選択します。

  2. [商品のおすすめ] セクションをクリックします。

  3. 商品ページに商品のおすすめを表示するには、[ダイナミックレコメンデーションを表示する] にチェックを入れます。

  4. オプション: おすすめ商品の上に表示されるタイトルを変更するには、[見出し] フィールドに新しいタイトルを入力します。

5.オプション: お客様が商品のおすすめセクションから商品をカートに直接追加できるようにするには、[「クイック購入」ボタンを有効にする] を選択します。

  1. オプション: 商品説明で販売元を表示または非表示にするには、販売元を表示するチェックボックスを使用します。

  2. [保存] をクリックします。

特集コレクション

ホームページの1つのセクションで、複数のコレクションを特集することができます。コレクションはタブとして表示され、お客様がコレクション間を移動できるようになっています。

お客様が特集コレクションからカートに1個以上の商品を追加すると、カートに追加された商品の数量が商品のバッジとして表示されます。

複数のコレクションを含む特集コレクションセクションです。コレクション名は、クリック可能なタブとしてセクション上部に表示されます。

特集コレクションセクションには次の設定が含まれます。

  • コレクション - 特集コレクションセクションに含めるコレクションを選択します。

  • コレクションリストのサイズ - デフォルトで表示する商品の数を選択します。この設定は、特集コレクションセクションのすべてのコレクションに適用されます。 - 小 - 6商品

    • 中 - 18商品
    • 大 - 36商品

  • 画像スタイル - コレクション内の商品画像のトリミングスタイルを選択します。この設定は、セクション内のすべてのコレクションに適用されます。

ヒント: お客様が特集コレクションセクションから商品をクリックしたとき、ホームページ上にオーバーレイで開くようにすることができます。詳細については、「商品ページのスタイルを変更する」を参照してください。

ホームページに特集コレクションセクションを追加する

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. [セクションを追加する] をクリックします。
  2. [特集コレクション] をクリックして、[選択] をクリックします。
  3. コンテンツエリアで、[コレクション] ブロックを選択するか [コレクションを追加する] をクリックします。
  4. [コレクションを選択] をクリックします。

  5. コレクションリストから、タブで表示するコレクションを選択し、[選択] をクリックします。

    コレクションを追加するには、[コレクションを追加] リンクをクリックして、新しいタブでコレクションを作成するページを開きます。

    選択したコレクションの商品を追加または削除する場合は、[コレクションを編集する] リンクをクリックし、新しいタブでコレクションページを開きます。

  6. セクションに他にもコレクションを追加するには、手順3から5を繰り返します。

  7. [保存] をクリックします。

ヒント: セクション内のコレクションタブの並び順を変更するには、コンテンツエリアでコレクションを再配置します。コレクションのドラッグアンドドロップハンドル [⋮⋮] をクリックして、ブロックを別の場所にドラッグします。

特集商品

ホームページで商品を特集できます。商品の特集は、新しい商品やセール中の商品を宣伝するのに最適な方法です。お客様は、商品画像の下にある左右の矢印を使用して、画像をさらに表示できます。

特集商品セクションには、以下の設定が含まれます。

  • 商品 - ホームページで特集する商品を選択します。
  • 数量セレクターを表示する - ユーザーがカートに追加する数量を指定することができます。
  • 販売元を表示する - 商品のブランド名または販売元をおすすめの商品セクションに表示します。ブランド名や販売元を表示するには、商品に販売元を追加する必要があります。
  • 動的チェックアウトボタンを表示する - お客様がカートをスキップして、特集商品セクションから直接チェックアウトに進むことができます。
  • SNSでの共有ボタンを表示する - お客様が商品をSNSで共有できるようボタンを表示します。これらのボタンはテーマ設定で管理されます。
  • 画像スタイル - 特集商品の画像を正方形または円形にトリミングするかどうかを選択します。

おすすめ商品セクションを追加する

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. [セクションを追加する] をクリックします。
  2. [特集商品] をクリックし、[選択] をクリックします。
  3. 設定で特集商品セクションをカスタマイズします。
  4. [保存] をクリックします。

コンテンツをカスタムする

カスタムコンテンツセクションでは、いくつかのコンテンツブロックをグループ化することができます。各ブロックの幅と配置を調整して、カスタムレイアウトを構築することができます。

カスタムコンテンツ セクションには、以下の設定が含まれています。

  • 見出し - セクションのタイトルです。

  • モバイルレイアウト - ストアがモバイルデバイスで表示される際のブロックのレイアウトです。次のオプションから選択します。

    • グリッド - 同じ行に表示される最大50%の幅のブロックです。50%の幅を超えるコンテナーはそれぞれの行に専有表示されます。
    • スタック - 各ブロックはそれぞれの行に専有表示されます。
    • スライダー - ブロックは、単一のスライドショースタイルセクションに折りたたまれています。お客様はメニューの矢印をクリックして、追加のブロックを表示することができます。

次のブロックタイプから選択することができます。

ヒント: このセクションのブロックを再配置するには、各ブロックのドラッグアンドドロップハンドル⋮⋮を使用することができます。

カスタムコンテンツブロックのタイプ
ブロックのタイプ 設定
テキスト

見出し - テキストブロックに見出しを追加します。

テキスト - カスタムテキストを追加して書式設定します。

ボタンのラベル - テキストラベル付きボタンをブロックに追加します。

ボタンのリンク - ボタンに表示するテキストを追加します。

テキストサイズ - テキストのサイズを設定します。

コンテナーの幅 - ブロックの幅を設定します。

垂直アラインメント - ブロック内コンテンツの垂直方向位置を設定します。

水平アラインメント - ブロック内のコンテンツの水平方向位置を設定します。
画像

画像 - ブロックに表示する画像を追加します。画像をアップロードしたり、以前アップロードした画像を使用したりするほか、Burstから無料のストック画像を選択したりすることができます。

コンテナーの幅 - ブロックの幅を設定します。

垂直アラインメント - ブロック内コンテンツの垂直方向位置を設定します。
商品

商品: ブロック内に掲載する商品を選択します。商品名、画像、価格が表示されます。商品に画像が含まれていない場合、商品名がブロックに表示されます。

コンテナーの幅 - ブロックの幅を設定します。

垂直アラインメント - ブロック内コンテンツの垂直方向位置を設定します。

[オーバーレイで商品ページを表示する] が商品ページに対して有効になっている場合に、このセクションからアクセスすると現在のページ上にオーバーレイ形式で商品の詳細を表示できます。
コレクション

コレクション: ブロック内で掲載するコレクションを選択します。コレクションのタイトルと記事のサムネイルが表示されます。記事のサムネイルがない場合は、コレクションの最初の商品画像が表示されます。コレクション内の商品に画像が含まれていない場合、コレクションタイトルがブロック内に表示されます。

コンテナーの幅 - ブロックの幅を設定します。

垂直アラインメント - ブロック内コンテンツの垂直方向位置を設定します。
メニュー

メニュー - ブロックに表示するメニューを選択します。

見出し - メニューの見出しを追加します。

コンテナーの幅 - ブロックの幅を設定します。

垂直アラインメント - ブロック内コンテンツの垂直方向位置を設定します。

水平アラインメント - ブロック内のコンテンツの水平方向位置を設定します。

ホームページにカスタムのコンテンツを追加する

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。

  1. [セクションを追加] をクリックします。

  2. [カスタムコンテンツ] をクリックし、[選択] をクリックします。

  3. セクションに含めるコンテンツブロックを選択して設定します。

  4. [保存] をクリックします。

テキスト付き画像

Expressではテキスト付き画像を追加し、画像の左右いずれかに表示することができます。また、別ページにリンクするボタンを追加することも可能です。

テキスト付き画像のセクションを使用して、特定の商品またはコレクションを宣伝することもできます。

テキスト付き画像セクションには、以下の設定が含まれます。

  • 画像 - セクションに含める画像を追加します。画像をアップロードしたり、以前にアップロードした画像を使用したりするほか、Burstから無料のストック画像を選択したりすることができます。
  • 見出し - 画像とペアリングするメインのテキストを追加します。
  • テキスト - 画像とペアリングするサブテキストを追加します。このテキストは見出しテキストの下に表示されます。
  • ボタンのラベル - ボタンに表示するテキストを追加します。
  • ボタンのリンク - ボタンのリンク先となるURLまたはページを設定します。URLに貼り付けるか、メニューからページを選択します。セクションにボタンを含めない場合は、このフィールドを空白のままにします。

レイアウトオプション

  • デスクトップ - デスクトップコンピューターから閲覧するときにセクションの画像を左または右のどちらに表示させるかを選択します。左に画像を表示するには、[1つ目の画像] を選択します。
  • モバイル - モバイルデバイスで閲覧するときにセクション内の画像を最初または2番目のどちらに表示させるかを選択します。
  • サブ背景 - セクションにサブ背景の配色を追加するかどうかを選択します。セクションの上から5分の3の位置まで背景色を追加するには、[一部分] を選択します。この配色は、テーマ設定で変更することができます。
  • テキストサイズ - セクションの見出しとテキストの相対的なサイズを選択します。
  • 画像比を維持する - 選択した画像がトリミングされないようにするには、このオプションを選択します。このオプションのチェックを外したままにすると、画像が正方形にトリミングされます。
  • 二次テキストの配色を有効にする - 見出しとテキストにサブ背景用のテキストの配色を使用するには、このオプションを選択します。この配色は、テーマ設定で変更することができます。

ホームページにテキスト付き画像セクションを追加する

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. [セクションを追加する] をクリックします。
  2. [テキスト付き画像] をクリックし、[選択] をクリックします。
  3. 画像エリアで [画像を選択する] をクリックし、次のいずれかを実施します。- 管理画面にアップロード済みの画像を選択するには、[ライブラリー] タブをクリックします。
  4. Burstからストック画像を選択するには、[無料の画像] タブをクリックします。ここで検索ワードを入力するか、画像カテゴリーを閲覧することができます。

  5. ローカルコンピューターから画像を選択する場合は、[ライブラリー] タブをクリックし、次に [アップロード] をクリックします。

  6. 設定でセクションをカスタマイズします。

  7. [保存] をクリックします。

ページ

バージョン 1.10.0+

ホームページ上で、ページのリッチテキストコンテンツ機能を使用することができます。このセクションを使用して、ストアポリシーページまたは会社概要ページのコンテンツを装飾することができます。

このセクションは、異なるテンプレートが適用されている場合でも、常にデフォルトのページテンプレートを使用しています。たとえば、page.contactテンプレートを使用しているお問い合わせページをセクションに追加した場合、そのテンプレートのインタラクティブフィールドは、ホームページに表示されません。ページのタイトルとコンテンツのボックスに追加する情報は、全てセクションに表示されます。

ホームページにページセクションを追加する

  1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
  2. Express向けのセクションの隣にある [カスタマイズする] をクリックします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. Shopifyアプリから [Store] をタップします。
  2. [販売チャネル] セクションで、[オンラインストア] をタップします。
  3. [テーマを管理する] をタップします。
  4. Express向けのセクションの横にある [カスタマイズ] をタップします。
  5. [編集] をタップします。
  1. [セクションを追加する] をクリックします。
  2. [ページ]をクリックし、[選択]をクリックします。
  3. ページエリアで、[ページを選択する] をクリックします。
  4. 表示するコンテンツを含むページを選択し、[選択] をクリックします。現在公開されているページからのみ選択できます。新しいページを作成する必要がある場合は、[ページを作成する] を選択します。
  5. [保存] をクリックします。

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

無料体験を試す