テーマの追加、プレビュー、購入

オンラインストアを始めるにあたり管理画面のテーマページには、Shopifyのアカウント開設時、デフォルトテーマで設定されています。別のテーマをカスタマイズしてオンラインストアに利用する場合、管理画面にテーマを追加する必要があります。

テーマを追加できる方法は以下のとおりです。

• 自分の言葉でビジネスを説明し、AI を使って無料でパーソナライズされたテーマを生成できます。
• 管理画面から無料のテーマを追加できます。
• Shopify テーマストアで有料テーマを試してみることができます。任意のテーマをプレビューし、テーマエディタを使用してそのテーマをカスタマイズできます。そのテーマをオンラインストアに公開するには、その前に購入する必要があります。
• ZIPファイルに格納されているテーマがすでにある場合は、そのテーマをアップロードできます。

あなたが開発者である場合、またはShopify パートナーまたは代理店と連携している場合は、以下の方法でストアにテーマを追加することもできます。

• Shopify GitHub統合を使用して、GitHubでホストされているテーマをストアに追加できます。
• Shopify CLIを使用して、ストアにテーマをプッシュできます。

メモ

Shopifyテーマストアからテーマを購入する場合、そのテーマは、最初に購入したストアにのみライセンスが付与されます。ライセンスがないテーマは、サポート対象外および新機能リリース時のアップデート対象外となります。

アカウントに複数のテーマを追加して、新しいテーマを試したり、公開されているテーマの季節バージョンを維持したり、公開されたテーマのコピーに対して変更をテストしたりすることができます。これらのテーマはどれでもプレビューできますが、一度に公開できるテーマはいつでも1つだけです。新しいテーマに切り替えても、Shopifyのテーマページで以前のテーマにアクセスできます。

テーマを追加した後にリンクを作成して、他の人と未公開のテーマのプレビューを共有することができます。これは、新しいテーマの公開前やオンラインストアの開設前にフィードバックを求めている場合に役立ちます。公開済みのテーマのプレビューを共有することはできません。

テーマの資格要件

ストアまたは組織にテーマを追加するための以下の資格要件を確認してください。

• 追加できるテーマの最大数は、料金プランによって異なります。 - Shopify Starterプランのストアは、Spotlightテーマのみを追加できます。 - Basicプラン、Shopifyプラン、Advancedプランのストアと組織は、最大20個のテーマを追加できます。 - Shopify Plusプランのストアと組織は、最大100個のテーマを追加できます。

利用しているプランのテーマ上限数に達した場合、新しいテーマを追加するには、テーマを削除する必要があります。追加ストアでは、公開されている追加ストアごとにテーマライセンスが必要です。

AIで無料のテーマを生成

プラン要件

この機能は、無料体験、 Basic Shopify 、 Grow 、またはAdvanced Shopifyプランを利用していて、ストアフロントが英語に設定されている場合にのみ利用できます。 Shopify Starterプランをご利用の場合は、 Spotlightテーマのみを使用でき、無料のパーソナライズされたテーマを生成することはできません。

AI を使用して、Shopify 管理画面の テーマ ページから無料のパーソナライズされたテーマを生成できます。無料テーマのカスタマイズのヘルプページはShopifyによりサポートされています。

手順

デスクトップ

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

2. [ストアを数秒でデザイン] セクションで、ビジネスの説明を記入し、 [テーマを生成] をクリックして、最大3つの無料のパーソナライズされたテーマを生成します。

3. 興味のあるテーマをクリックし、次に [テーマを試す] をクリックして、そのテーマをストアに適用します。

4. 管理画面の [テーマ] ページの [テーマライブラリー] セクションに、テーマが追加されます。

iPhone

1. Shopifyアプリから、 ボタンをタップします。

2. 販売チャネルセクションで、[オンラインストア] をタップします。

3. [テーマを管理する] をタップします。

4. ページの下部近くにある [ストアを数秒でデザインする] セクションで、ビジネスの内容を記入し、[テーマを生成] をタップして、最大3つの無料のパーソナライズされたテーマを生成します。

5. 興味のあるテーマをタップし、次に [テーマを試す] をタップして、そのテーマをストアに適用します。

6. 管理画面の [テーマ] ページの [テーマライブラリー] セクションに、テーマが追加されます。

Android

1. Shopifyアプリから、 ボタンをタップします。

2. 販売チャネルセクションで、[オンラインストア] をタップします。

3. [テーマを管理する] をタップします。

4. ページの下部近くにある [ストアを数秒でデザインする] セクションで、ビジネスの内容を記入し、[テーマを生成] をタップして、最大3つの無料のパーソナライズされたテーマを生成します。

5. 興味のあるテーマをタップし、次に [テーマを試す] をタップして、そのテーマをストアに適用します。

6. 管理画面の [テーマ] ページの [テーマライブラリー] セクションに、テーマが追加されます。

管理画面に無料のテーマを追加

無料テーマはShopifyによって開発されています。無料テーマのカスタマイズのヘルプページはShopifyによりサポートされています。

メモ

Starterプランに加入している場合は、Spotlightテーマのみを使用できます。

無料テーマはShopifyによって開発されています。無料テーマのカスタマイズのヘルプページはShopifyによりサポートされています。

手順

デスクトップ

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

2. ページの下部近くにある [人気のある無料のテーマ] セクションで、Shopify Theme Storeの最も人気のある無料のテーマを表示するか、[テーマストアにアクセス] をクリックして利用可能なすべてのテーマを閲覧します。

3. テーマ名をクリックして、Shopify テーマストアでテーマに関する詳細を表示します。

4. テーマの [追加] ボタンをクリックします。管理画面の [テーマ] ページの [テーマライブラリー] セクションに、テーマが追加されます。

iPhone

1. Shopifyアプリから、 ボタンをタップします。

2. 販売チャネルセクションで、[オンラインストア] をタップします。

3. [テーマを管理する] をタップします。

4. ページの下部近くにある [人気のある無料のテーマ] セクションで、Shopify Theme Storeの最も人気のある無料のテーマを表示するか、[テーマストアにアクセス] をタップして利用可能なすべてのテーマを閲覧します。

5. テーマ名をタップして、Shopify Theme Storeでテーマに関する詳細を表示します。

6. テーマの [追加] ボタンをタップします。管理画面の [テーマ] ページの [テーマライブラリー] セクションに、テーマが追加されます。

Android

1. Shopifyアプリから、 ボタンをタップします。

2. 販売チャネルセクションで、[オンラインストア] をタップします。

3. [テーマを管理する] をタップします。

4. ページの下部近くにある [人気のある無料のテーマ] セクションで、Shopify Theme Storeの最も人気のある無料のテーマを表示するか、[テーマストアにアクセス] をタップして利用可能なすべてのテーマを閲覧します。

5. テーマ名をタップして、Shopify Theme Storeでテーマに関する詳細を表示します。

6. テーマの [追加] ボタンをタップします。管理画面の [テーマ] ページの [テーマライブラリー] セクションに、テーマが追加されます。

Shopifyテーマストアで有料テーマを試す

有料テーマの購入を約束する前に、管理画面でテーマをプレビューして試すことができます。テーマエディタを使用して、プレビューされたテーマをカスタマイズできます (ブランドカラー、ブランドスタイル、商品を使用するように変更するなど)。テーマを購入すると、行ったカスタマイズがすべて保存されます。

最多19個の有料テーマを同時にプレビューすることができます。そうすることで、テーマの購入前にさまざまなテーマを比較することができます。試している有料テーマには、トライアル中のテーマのラベルが付きます。

有料テーマについてサポートを受けるには、テーマ開発者にお問い合わせください。

手順

1. Shopify テーマストアにアクセスし、有料テーマを選択します。
2. [テーマを試す] をクリックして、テーマをオンラインストアに追加します。
3. 管理画面で、[オンラインストア] > [テーマ] の順にクリックします。
4. [テーマライブラリー] セクションで、[] ボタンをクリックして、プレビューするテーマの横にあるアクションメニューを開きます。
5. [プレビュー] をクリックします。

プレビューしているテーマをカスタマイズすることもできます。テーマにご満足いただける場合は、テーマを購入できます。テーマに対して行ったカスタマイズはすべて保存されます。

Shopifyテーマストアからテーマを購入する

以下のストアレベルの権限を持つすべてのユーザーのみが、Shopify Theme Storeからテーマを購入できます。

• テーマ
• アプリとチャネルを管理およびインストールする
• アプリ料金を承認する

有料テーマはオンラインストアで試した後、購入することができます。オンラインストアで公開できるテーマは、購入したテーマのみです。Shopify Theme Storeからテーマを購入した場合、その使用ライセンスは、購入元のストアにのみ付与されます。そのテーマを別のストアで使用したいと思う場合、条件によってはそのテーマを移行をできる可能性があります。

有料テーマは、サードパーティのテーマ開発者によって作成されます。外部サービスのテーマの全般的なサポートと更新は、テーマ開発者によって提供されます。高度なカスタマイズが必要で、HTML、CSS、JavaScriptによるウェブサイトの開発経験がない場合は、Shopifyパートナーを雇うことを検討してください。

注意

Shopifyテーマストアからサードパーティのテーマを購入する場合、これらの取引は最終的な販売と見なされます。そのため、テーマ開発者は返金を行うことができません。

手順

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

2. [テーマを追加] > [テーマストアにアクセス] の順にクリックします。

3. 購入するテーマを検索し、[テーマを試す] をクリックします。

4. [テーマライブラリー] セクションで、購入を希望するテーマにある [購入] をクリックして取引を開始します。

コンピューターからテーマをアップロードする

コンピューター上に、ZIPファイルに格納されているテーマがある場合は、管理画面の [テーマ] ページにアップロードできます。

アップロードする前に、複数のテーマファイルが1つのZIPファイルに圧縮されて格納されているかを確認してください。

ZIPファイルをアップロードすると、管理画面の [テーマ] ページにテーマが追加されます。

手順

デスクトップ

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

2. [テーマライブラリー] セクションで、[テーマを追加] > [Zipファイルをアップロード] の順にクリックします。

3. [テーマをアップロードする] ダイアログで、[ファイルを選択] をクリックして、アップロードするZIPファイルを選択します。

4. [アップロード] をクリックします。

iPhone

1. Shopifyアプリから、 ボタンをタップします。

2. 販売チャネルセクションで、[オンラインストア] をタップします。

3. [テーマを管理する] をタップします。

4. [テーマライブラリー] セクションで、[テーマを追加] > [Zipファイルをアップロード] の順にタップします。

5. [テーマをアップロードする] ダイアログで、[ファイルを選択] をタップして、アップロードするZIPファイルを選択します。

6. [アップロード] をタップします。

Android

1. Shopifyアプリから、 ボタンをタップします。

2. 販売チャネルセクションで、[オンラインストア] をタップします。

3. [テーマを管理する] をタップします。

4. [テーマライブラリー] セクションで、[テーマを追加] > [Zipファイルをアップロード] の順にタップします。

5. [テーマをアップロードする] ダイアログで、[ファイルを選択] をタップして、アップロードするZIPファイルを選択します。

6. [アップロード] をタップします。

テーマの切り替え

ストアに新しいテーマを追加すると、Shopifyの [テーマ] ページの [テーマライブラリー] セクションに表示されます。オンラインストアに公開することにより、新しいテーマに切り替えることができます。新しいテーマを公開した後でも、以前のテーマはテーマライブラリーで使用できます (必要に応じて元に戻すことが可能)。

テーマを手動で更新した場合、更新されたバージョンのテーマはテーマライブラリーに別個のバージョンとして表示されます。更新されたバージョンに切り替えた後でも、テーマの以前のバージョンはテーマライブラリーで引き続き利用可能です。詳細については、「テーマの更新」を参照してください。

テーマを切り替える準備をする

テーマライブラリーにテーマを追加する場合、テーマを公開する前にカスタマイズできます。これは、既存のテーマを置き換える前に、新しいテーマを確認し、設定とコンテンツを調整してビジネスに反映させる良い機会となります。準備しておいた複数のテーマを再設定することなく切り替えることもできます。

ストアの商品、コレクション、メニュー、ページ、ブログ記事は、テーマとは別に管理画面で管理されているため、新しいテーマに切り替えても、変更または削除されません。ただし、テーマエディタ、テーマコードエディタ、および言語エディタを使用して管理されるコンテンツと設定は、アップロードするそれぞれのテーマとテーマバージョンに固有のものです。

テーマは、オンラインストアの以下の部分に関連付けられています。オンラインストアのこれらの部分は、使用するテーマごとにカスタマイズする必要があります。

• ストアのセクションとブロックに適用される設定
• 全体的なテーマ設定 (オンラインストアに適用される色やフォントなど)
• テキストと文言
• コードのカスタマイズ (アプリにより追加されたコードのカスタマイズなど)
• 利用可能なテーマテンプレート

すべてのテーマが、Shopifyのすべての機能をサポートしているわけではありません。テーマの機能リストで、必要な機能があることを確認する必要があります。

テーマのプレビュー

オンラインストアの [テーマ] セクションで任意のテーマをプレビューできます。プレビューでは、オンラインストアのプレビューされたテーマが、オンラインストアのプレビューバーを備えたブラウザタブに表示されます。

オンラインストアのプレビューバーに、テーマに関する次の情報が表示されます。

• テーマ名。
• テーマのステータス。公開済みのテーマのステータスは [公開] です。未公開のテーマのステータスは [下書き] です。

プレビューは、次のアクションでカスタマイズできます。

• [表示形式] セクションでは、プレビューする別の国または言語を選択できます。国際Markets および テーマに言語を追加するについての詳細をご覧ください。
• ボタンをクリックしてテーマのプレビューを共有します。
• [プレビューを閉じる] をクリックしてプレビューを閉じ、公開済みのテーマを表示します。
• [テーマのカスタマイズ] をクリックしてテーマエディタを開き、テーマをカスタマイズします。
• プレビューバーの上部付近をクリックして折りたたみます。もう一度クリックすると、展開できます。

テーマのプレビューを共有する

オンラインストアを開設するか、新しいテーマを公開してストアを変更する予定がある場合、テーマのプレビューを共有して他の人からのフィードバックを求めることができます。

管理画面に追加したテーマのリンクを作成することで、他の人がテーマのプレビューにアクセスできるようになります。共有するために、テーマを公開する必要はありません。

プレビューリンクを使用すると、オンラインストアの閲覧が有効になりますが、チェックアウトにアクセスすることはできません。プレビューリンクは、作成後2日間有効です。新しいリンクは好きなだけ作成することができ、新しいリンクを作成しても古いプレビューリンクには影響しません。

手順

デスクトップ

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

2. 共有するテーマで、[] ボタンをクリックしてアクションメニューを開き、[プレビュー] をクリックします。

3. オプション: 別の国、言語、またはその両方を選択して、プレビューを変更します。

4. ボタンをクリックして、リンクをクリップボードにコピーします。

iPhone

1. Shopifyアプリから、 ボタンをタップします。

2. 販売チャネルセクションで、[オンラインストア] をタップします。

3. [テーマを管理する] をタップします。

4. 共有するテーマで、[] ボタンをタップしてアクションメニューを開き、[プレビュー] をタップします。

5. オプション: 別の国、言語、またはその両方を選択して、プレビューを変更します。

6. をタップして、リンクをクリップボードにコピーします。

Android

1. Shopifyアプリから、 ボタンをタップします。

2. 販売チャネルセクションで、[オンラインストア] をタップします。

3. [テーマを管理する] をタップします。

4. 共有するテーマで、[] ボタンをタップしてアクションメニューを開き、[プレビュー] をタップします。

5. オプション: 別の国、言語、またはその両方を選択して、プレビューを変更します。

6. をタップして、リンクをクリップボードにコピーします。

テーマプレビューのトラブルシューティング

さまざまな状況において、テーマのプレビューやテーマのプレビューバーが正しく表示されない原因が存在します。このガイドの手順を確認した後もテーマに問題が解決しない場合は、テーマのサポートチームに連絡する必要がある場合があります。 テーマのサポートについて詳しくはこちらをご覧ください。

プレビューバーはライブストアに表示されます

これは通常、テーマがオンラインストアのURLにpreview_theme_idというパラメーターを誤って追加している場合に発生します。このパラメータは内部プレビュー専用ですが、ライブURLに存在する場合、プレビューバーはすべての訪問者に対して強制的に表示されます。

オンラインストアにアクセスし、ブラウザのアドレスバーでpreview_theme_idパラメーターを確認してください。また、プレビューバーに表示されるリンクアドレスを転送するようにお客様に依頼することもできます。

preview_theme_idパラメータがオンラインストアのURLに含まれている場合は、テーマの開発者にサポートを依頼して、問題について説明してください。テーマの開発者

テーマコードの編集に慣れている場合は、テーマファイルでpreview_theme_idを検索し、URLに追加しているコードを削除することができます。layout ファイルやJavascriptを含むファイル (末尾が .js) に、このタイプのコードが含まれている可能性が最も高いです。テーマのコードを編集するのは、 HTML とCSS Basic ShopifyLiquid理解し、 、Shopify のテンプレート言語、JSON、JavaScript について 理解している場合に限られます。

この問題は、Shopify Theme Storeの外部から購入したテーマ (ThemeForestのLumiaテーマなど) で報告されています。

下書きテーマのプレビューは、ライブテーマにリダイレクトされます

未公開のテーマで、[プレビュー] をクリックして、その後、ライブテーマにリダイレクトされた場合、ほとんどの場合はCloudflareのキャッシングに関連しています。

Shopifyストアの前でCloudflareを使用している場合、Shopifyのプレビューメカニズムに干渉するキャッシュ設定がある可能性があります。ShopifyはキャッシングにもCloudflareを使用しており、これらのレイヤーは競合することがあります。外部キャッシュとの潜在的な競合については、ドキュメント内で説明しています。

プレビューバーが正しく機能するように、Shopifyのすべてのリクエストに対してCloudflareのキャッシュをオフにしてください。

プレビューバーが完全に表示されない

テーマをプレビューするときにプレビューバーが表示されない場合は、カスタムコードまたは外部サービスのアプリがテーマのデフォルトスクリプトを変更したことが原因である可能性があります。

この問題は、通常、テーマのレイアウトフォルダーにあるテーマのtheme.liquidファイルにあるLiquidオブジェクトに影響を与える変更が原因である可能性があります。プレビュー バースクリプトでは、オブジェクトが正しく読み込まれる必要があります。このオブジェクトを変更すると、スクリプトが読み込まれなくなり、プレビューバーが欠落したり、Shopifyの機能やアプリにその他の問題が発生する可能性があります。

テーマとアプリで変更元を確認できます。テーマのトラブルシューティングを行う方法を学びます。