テンプレート

テンプレートとは、オンラインストアに統一感のある見た目と雰囲気をもたらすよう設定されたセクションのコレクションのことです。テンプレートで利用可能なセクションは、ご利用のテーマによって異なります。テーマエディターでは、どのテンプレートがどのページに適用されているかを確認し、それらを編集してお客様に表示する情報をカスタマイズできます。

テンプレートを編集すると、そのページテンプレートを使用しているすべてのページに、その変更が適用されます。たとえば、コレクションテンプレートにニュースレターの登録フォームを追加すると、デフォルトのコレクションテンプレートを使用するすべてのコレクションページでは、ニュースレターの登録フォームが表示されるようになります。

カテゴリーごとに最大50個のテンプレートを使用できます。

テンプレートを編集する

テンプレートを編集して、オンラインストアにセクションを追加することができます。一部のセクションでは、さらにカスタマイズ可能なブロックを追加できますが、すべてのセクションやブロックに編集可能な設定やコンテンツがあるわけではありません。テンプレートを編集すると、その変更内容はテーマのプレビューウィンドウにリアルタイムで表示されます。

メモ

1600ピクセルよりも広い幅の画面で、ブラウザーのウィンドウが完全に展開されている場合、またはブラウザーのウィンドウが少なくとも1600ピクセルの幅まで展開されている場合、2つのサイドバーが表示されます。左側のサイドバーにはメニューパネル、右側のサイドバーには設定パネルが表示されます。

手順:

デスクトップ

1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
2. 編集するテーマを見つけて、[カスタマイズする] をクリックします。
3. ページ上部のドロップダウンメニューを開きます。

iPhone

1. Shopifyアプリから [ストア] をタップします。
2. 販売チャネルセクションで、[オンラインストア] をタップします。
3. [テーマを管理する] をタップします。
4. 編集するテーマを見つけて、[カスタマイズする] をタップします。
5. [テンプレート] をタップします。

Android

1. Shopifyアプリから [ストア] をタップします。
2. 販売チャネルセクションで、[オンラインストア] をタップします。
3. [テーマを管理する] をタップします。
4. 編集するテーマを見つけて、[カスタマイズする] をタップします。
5. [テンプレート] をタップします。

1. ドロップダウンメニューで、編集するテンプレートを選択します。
2. [+ セクションを追加] をクリックして、テンプレートの新しいセクションを選択します。
3. 新しいセクションをクリックして、設定とオプションを表示します。
4. セクションまたはセクション内のブロックに変更を加えます。
5. セクション内容に問題がなければ、[保存] をクリックします。

新しいテンプレートを作成する

メモ

新しいテンプレートの作成は、Online Store 2.0のみで行うことができます。

一部のテンプレートタイプは、ストアのリソースを使用して複数のページを表示するために使用できます。これらには、次のテンプレートタイプが含まれます。

• コレクション
• 商品
• ブログ
• ブログ記事
• ページ

すべてのテーマには、タイプごとにデフォルトのテンプレートが用意されています。このデフォルトのテンプレートは、代替テンプレートが明示的に設定されていない場合にリソースが使用するテンプレートです。

テンプレートに変更を加えると、そのテンプレートを使用するページすべてに影響が及びます。そのタイプのページの一部を異なる方法で表示したい場合、テーマにすでに存在しているテンプレートを基にして、新しいテンプレートを作成することができます。既存のテンプレートから新しいテンプレートを作成すると、同じセクションが新しいテンプレートに自動的に入力されます。同じタイプの他のテンプレートの表示に影響を与えることなく、新しいテンプレートを編集して、適宜、セクションを削除、追加、または非表示にすることができます。

手順:

デスクトップ

1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
2. 編集するテーマを見つけて、[カスタマイズする] をクリックします。
3. ページ上部のドロップダウンメニューを開きます。

iPhone

1. Shopifyアプリから [ストア] をタップします。
2. 販売チャネルセクションで、[オンラインストア] をタップします。
3. [テーマを管理する] をタップします。
4. 編集するテーマを見つけて、[カスタマイズする] をタップします。
5. [テンプレート] をタップします。

Android

1. Shopifyアプリから [ストア] をタップします。
2. 販売チャネルセクションで、[オンラインストア] をタップします。
3. [テーマを管理する] をタップします。
4. 編集するテーマを見つけて、[カスタマイズする] をタップします。
5. [テンプレート] をタップします。

1. ドロップダウンメニューを使用してテンプレートを選択します。[+ テンプレートを作成する] をクリックします。
2. テンプレートに固有の名前を付けます。
3. ドロップダウンメニューを使用して、新しいテンプレートのベースにする既存のテンプレートを選択します。
4. [テンプレートを作成する] をクリックします。

テンプレートのプレビュー

テンプレートプレビューでは、テンプレートを保存または公開したときに、異なるリソースがお客様にどのように表示されるかを確認できます。テンプレートプレビューを使用し、異なるテンプレートを適用したページや商品がどのように表示されるかをプレビューすることができます。

テンプレートは、ページレベルまたは商品レベルで割り当てられます。テンプレートの作成や編集はテーマエディターで行いますが、ページまたは商品に割り当てられたテンプレートは管理画面で変更します。ページと商品には複数のテンプレートを使用できます。

代替テンプレートをプレビューする

別のテンプレートが適用されたページや商品がどのように表示されるかをプレビューすることができます。

手順:

デスクトップ

1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
2. 編集するテーマを見つけて、[カスタマイズする] をクリックします。
3. ページ上部のドロップダウンメニューを開きます。

iPhone

1. Shopifyアプリから [ストア] をタップします。
2. 販売チャネルセクションで、[オンラインストア] をタップします。
3. [テーマを管理する] をタップします。
4. 編集するテーマを見つけて、[カスタマイズする] をタップします。
5. [テンプレート] をタップします。

Android

1. Shopifyアプリから [ストア] をタップします。
2. 販売チャネルセクションで、[オンラインストア] をタップします。
3. [テーマを管理する] をタップします。
4. 編集するテーマを見つけて、[カスタマイズする] をタップします。
5. [テンプレート] をタップします。

1. ドロップダウンメニューを使用してテンプレートを選択します。
2. サイドバーで [変更] をクリックします。
3. 選択したテンプレートでプレビューする商品またはページを選択します。

新しいテンプレートを適用する

次の項目に割り当てられたテンプレートを変更できます。

• ページ
• 商品
• コレクション
• ブログ
• ブログ記事

管理画面で、割り当てられたテンプレートを変更します。テンプレートは、個々のアイテムレベルで、または [一括操作] を使用して複数のアイテムに割り当てることができます。この操作はテーマエディターでは行いません。

手順:

デスクトップ

1. 管理画面からオンラインストア > ページに移動します。

iPhone

1. Shopifyアプリから [ストア] をタップします。
2. [販売チャネル] セクションで、[オンラインストア] をタップします。
3. [ページ] をタップします。

Android

1. Shopifyアプリから [ストア] をタップします。
2. [販売チャネル] セクションで、[オンラインストア] をタップします。
3. [ページ] をタップします。

1. ストアページのタイトルをクリックします。
2. [オンラインストア] セクションで、ドロップダウンメニューを使用して、選択したページに適用する新しいテーマテンプレートを選択します。
3. [保存] をクリックします。

商品に新しいテンプレートを適用する

1. 管理画面から商品に移動します。

2. 絞り込み検索を使用して変更する商品を見つけるか、既存の商品のリストから商品をクリックします。

3. [オンラインストア] セクションで、ドロップダウンメニューを使用して、選択した商品に適用する新しいテーマテンプレートを選択します。

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

コレクションに新しいテンプレートを適用する

1. 管理画面から、[商品管理] > [コレクション] の順に移動します。
2. 絞り込み検索を使用して、変更するコレクションを見つけるか、既存のコレクションリストからコレクションをクリックします。
3. [オンラインストア] セクションで、ドロップダウンメニューを使用して新しいテーマテンプレートを選択し、選択したコレクションに適用します。
4. [保存] をクリックします。

ブログ記事に新しいテンプレートを適用する

デスクトップ

1. 管理画面から、オンラインストア > ブログ記事に移動します。

iPhone

1. Shopifyアプリで [ストア] をタップします。
2. [販売チャネル] セクションで、[オンラインストア] をタップします。
3. [ブログ記事] をタップします。

Android

1. Shopifyアプリで [ストア] をタップします。
2. [販売チャネル] セクションで、[オンラインストア] をタップします。
3. [ブログ記事] をタップします。

1. 絞り込み検索を使用して変更するブログ記事を見つけるか、既存のブログ記事のリストから商品をクリックします。
2. [オンラインストア] セクションで、ドロップダウンメニューを使用して新しいテーマテンプレートを選択し、選択したブログ記事に適用します。
3. [保存] をクリックします。

ブログに新しいテンプレートを適用する

デスクトップ

1. 管理画面から、オンラインストア > ブログ記事に移動します。
2. [ を管理] をクリックします。

iPhone

1. Shopifyアプリから [ストア] をタップします。
2. [販売チャネル] セクションで、[オンラインストア] をタップします。
3. [ブログ記事] をタップします。
4. ブログ記事の横にある [...] ボタンをタップし、次に [を管理] を選択します。

Android

1. Shopifyアプリから [ストア] をタップします。
2. [販売チャネル] セクションで、[オンラインストア] をタップします。
3. [ブログ記事] をタップします。
4. [ブログ記事] の横にある [⋮] ボタンをタップし、[ を管理] を選択します。

1. 絞り込み検索を使用して変更するブログを見つけるか、既存のブログのリストから商品をクリックします。
2. [オンラインストア] セクションで、ドロップダウンメニューを使用して新しいテーマテンプレートを選択し、選択したブログに適用します。
3. [保存] をクリックします。

テンプレートの一括変更

[一括編集] を使用して、複数のページ、商品、コレクション、ブログ記事に新しいテンプレートを一度に適用することができます。

商品を一括編集する

1. 管理画面から商品に移動します。
2. 絞り込み検索を使用して、変更する商品を見つけます。

3. 複数の商品を同時に更新するには、次のショートカットを使用します。

   • 複数の商品を同時に選択して編集するには、編集するアイテムのチェックボックスをクリックします。
   • 商品を範囲選択するには、チェックボックスをクリックし、Shiftキーを押しながら別の商品のチェックボックスをクリックします。
   • 隣接する複数の商品を選択するには、アイテムをクリックして選択し、Shiftキーを押しながら別のアイテムのチェックボックスをクリックします。

4. [商品を編集] をクリックします。

5. [一括編集] で [フィールドを追加する] ドロップダウンメニューをクリックし、[一般] > [テンプレート] の順に選択します。

6. 最初の行のテンプレートフィールドをクリックし、Shiftキーを押しながら最後の行のテンプレートフィールドをクリックします。選択したアイテムの周りに細長いボックスが表示されます。

7. ドロップダウンメニューを使用して、選択したアイテムの新しいテンプレートを選択します。

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

コレクションを一括編集する

1. 管理画面から、[商品管理] > [コレクション] の順に移動します。
2. 絞り込み検索を使用して、変更するコレクションを見つけます。

3. 複数のコレクションを同時に更新するには、次のショートカットを使用します。

   • 複数のコレクションを同時に選択して編集するには、編集するアイテムのチェックボックスをクリックします。
   • コレクションを範囲選択するには、チェックボックスをクリックし、Shiftキーを押しながら別のコレクションのチェックボックスをクリックします。
   • 隣接する複数のコレクションを選択するには、アイテムをクリックして選択し、Shiftキーを押しながら別のアイテムのチェックボックスをクリックします。

4. [商品を編集] または [コレクションを編集] をクリックします。

5. [一括編集] で [フィールドを追加する] ドロップダウンメニューをクリックし、[一般] > [テンプレート] の順に選択します。

6. 最初の行のテンプレートフィールドをクリックし、Shiftキーを押しながら最後の行のテンプレートフィールドをクリックします。選択したアイテムの周りに細長いボックスが表示されます。

7. ドロップダウンメニューを使用して、選択したアイテムの新しいテンプレートを選択します。

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

ページやブログ記事を一括編集する

1. 管理画面から [オンラインストア] に移動し、[ページ] または [ブログ記事] をクリックします。
2. 絞り込み検索を使用して、変更するページやブログ記事を見つけます。

3. 複数のページやブログ記事を同時に更新するには、次のショートカットを使用します。

   • 複数のページやブログ記事を同時に選択して編集するには、編集するアイテムのチェックボックスをクリックします。
   • ページやブログ記事の一部分を選択するには、チェックボックスをクリックし、Shiftキーを押しながら別のページやブログ記事のチェックボックスをクリックします。
   • 隣接する複数のページやブログ記事を選択するには、クリックしてアイテムを選択し、Shiftキーを押しながら別のアイテムのチェックボックスをクリックします。

4. [ページを編集] または [ブログ記事を編集] をクリックします。

5. [一括編集] で [フィールドを追加する] ドロップダウンメニューをクリックし、[一般] > [テンプレート] の順に選択します。

6. 最初の行のテンプレートフィールドをクリックし、Shiftキーを押しながら最後の行のテンプレートフィールドをクリックします。選択したアイテムの周りに細長いボックスが表示されます。

7. ドロップダウンメニューを使用して、選択したアイテムの新しいテンプレートを選択します。

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

ブログを一括編集する

デスクトップ

1. 管理画面から、オンラインストア > ブログ記事に移動します。
2. [ を管理] をクリックします。

iPhone

1. Shopifyアプリから [ストア] をタップします。
2. [販売チャネル] セクションで、[オンラインストア] をタップします。
3. [ブログ記事] をタップします。
4. ブログ記事の横にある [...] ボタンをタップし、次に [を管理] を選択します。

Android

1. Shopifyアプリから [ストア] をタップします。
2. [販売チャネル] セクションで、[オンラインストア] をタップします。
3. [ブログ記事] をタップします。
4. [ブログ記事] の横にある [⋮] ボタンをタップし、[ を管理] を選択します。

1. 複数のブログを同時に更新するには、次のショートカットを使用します。

   • 複数のブログを同時に選択して編集するには、編集するアイテムのチェックボックスをクリックします。
   • ブログの一部分を選択するには、チェックボックスをクリックし、Shiftキーを押しながら別のブログのチェックボックスをクリックします。
   • 隣接する複数のブログを選択するには、クリックしてアイテムを選択し、Shiftキーを押しながら別のアイテムのチェックボックスをクリックします。

2. [ブログを編集] をクリックします。

3. [一括編集] で [フィールドを追加する] ドロップダウンメニューをクリックし、[一般] > [テンプレート] の順に選択します。

4. 最初の行のテンプレートフィールドをクリックし、Shiftキーを押しながら最後の行のテンプレートフィールドをクリックします。選択したアイテムの周りに細長いボックスが表示されます。

5. ドロップダウンメニューを使用して、選択したアイテムの新しいテンプレートを選択します。

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

テンプレートに関するよくある質問

テンプレートを削除するにはどうすればよいですか?

テンプレートを削除するには、コードエディターを使用する必要があります。

手順:

1. 管理画面から [オンラインストア] > [テーマ] の順に移動します。
2. テンプレートを削除するテーマを見つけて、[アクション] > [コードを編集] の順にクリックします。
3. コードエディターで、テンプレートフォルダを見つけます。削除するテンプレートの名前をクリックし、[ファイルを削除] をクリックします。そのテンプレートに割り当てられたリソースがある場合、別のテンプレートを割り当てるまではデフォルトのテンプレートで表示されます。

テンプレートの名前を変更するにはどうすればよいですか?

テンプレートを作成した後に、その名前を変更することはできません。新しい名前のテンプレートが必要な場合は、既存のテンプレートを基にして新しいテンプレートを作成し、元のテンプレートを削除する前に任意の名前を付けます。