ECサイトの構築において、デザイン作りは重要な役割を担うものです。Shopifyでサイトを構築する際には、どのような方法でデザインを作成すべきでしょうか?Shopifyが提供する公式テンプレートを比較・検討して、コンセプトに合ったデザインと機能を持つテンプレートを利用することが重要です。
本記事では、Shopifyのテンプレートの概要と種類、選定・導入手順、おすすめテンプレートの特徴などについて説明します。

目次
Shopifyテンプレートとは
Shopify のデザインテンプレートの概要と種類について説明します。
Shopifyテンプレートの特徴
Shopifyでは、ECサイトのデザインに利用できる「テーマ」と呼ばれるテンプレートが提供されています。
Shopifyの公式テーマストアにあるテーマから、サイトに適したテンプレートを選び、必要に応じてサイトのトップデザインや商品ページのデザインを編集できます。
Shopifyテンプレートは無料と有料の2種類がある
Shopifyの公式テーマストアでは、無料と有料の2種類のテンプレートが提供されています。無料テーマはShopifyが開発したテンプレートで、有料テーマは外部デザイナーが開発したテンプレートです。
公式テーマストア以外に、外部の「theme forest」や「templatemonster」といったテンプレートストアでも、Shopify専用のテンプレートが販売されています。
Shopifyテンプレートの選定手順
Shopifyで利用するテンプレートの選定手順を、以下の4項目に沿って説明します。
- ECサイトのコンセプトと必要な機能を確認
- Shopifyテーマストアでテンプレートを検索
- テーマのページで料金・機能を確認
- デモ画面を表示
1. ECサイトのコンセプトと必要な機能を確認
テンプレートを選定する前に、自社サイトのコンセプトと必要な機能を確認します。サイトのコンセプトを具体化するために、テンプレートの導入前に確認すべき主な項目には、以下の4点があります。
- サイトで販売する商品と価格
- 潜在顧客の属性
- 実施予定の集客対策
- 目標とする月間・年間売上額
以上の点を明確にし、サイトのコンセプトに合致したテンプレートの選定作業を進めましょう。
2. Shopifyテーマストアでテンプレートを検索
Shopifyテーマストアでは、必要な機能、カタログのサイズ、越境EC向けや実店舗との連携といった用途などでテーマを絞り込んで検索できます。
3. テーマのページで料金・機能を確認
各テーマのページで、利用料金や機能、サポート体制などを確認し、テンプレートを選定します。
4. デモ画面を表示
各テーマのページにある「デモストアを表示する」を選択すると、テーマのデモ画面が表示されます。「テーマを試す」を選択すると、自社サイトにテーマを導入した際の画面を表示できます。デモ画面を使って、テンプレートがサイトに適していることを確認しましょう。
Shopifyテンプレートを選ぶ際の3つの注意点
Shopifyのテンプレートを選ぶ際に注意すべき、以下の3点について説明します。
- 全ページのデザインを確認する
- 日本語対応の有無
- カスタマイズの必要性
1. 全ページのデザインを確認する
トップページだけでなく、商品ページやコレクションページのデザインもサイトの売上に直結する重要な要素です。テンプレートを選定する際には、デモ画面ですべてのページのデザインを確認した上で、自社サイトに最適なテンプレートを選びましょう。
2. 日本語対応の有無
選定するテンプレートの操作説明や、メールや電話などでのサポートが日本語対応しているかどうかも、事前に確かめましょう。
3. カスタマイズの必要性
テンプレートを選定する際には、機能拡張や細かいデザインの変更といったカスタマイズが必要かどうかを確認しましょう。テンプレートの標準機能やカスタマイズの内容によっては、HTML/CSSのプログラミング言語の知識・スキルが必要になることもあります。各テンプレートの機能を確認し、カスタマイズの実施について慎重に検討すべきです。
Shopifyテンプレートの利用手順
Shopifyテンプレートの利用手順を、以下の3点に沿って説明します。
- テンプレートをダウンロードする
- 管理画面で公開設定を実施
- Shopifyテンプレートをカスタマイズする方法
1. テンプレートをダウンロードする
利用するテンプレートを決め、テンプレートをダウンロード・インストールします。インストールしたテーマのライセンスが付与され、利用を開始できます。
2. 管理画面で公開設定を実施
導入したテンプレートの公開設定は、Shopifyの管理画面で簡単に実施できます。
テンプレートを公開する手順は、以下の通りです。
- 管理画面で「オンラインストア」を選択
- 「テーマ」を選択
- テーマライブラリーから公開するテーマを選んで「アクション」を選択
- 「公開」を選択して、公開ウィンドウで「公開」を選択
3. Shopifyテンプレートをカスタマイズする方法
Shopifyの公式テンプレートは、管理画面上での操作で、ページの背景色やロゴマーク、文字サイズ・フォントの変更、SNSとの共有画像情報などをカスタマイズできます。
テンプレートをカスタマイズする基本的な手順は、以下の通りです。
- Shopifyの管理画面で「販売チャネル」「オンラインストア」「テーマ」の順に選択
- 「カスタマイズ」を選択
- カスタマイズするページを選択
- 「テーマ設定」を選択
カスタマイズする際の条件や制限などは、利用するテンプレートによって異なります。また、テーマコードを編集して高度なカスタマイズを行う際には、HTMLやCSS、Liquidなどのプログラミング言語の知識が必要になるので、注意しましょう。
無料・有料のおすすめテンプレート10選
おすすめのShopifyテンプレート10点の概要を、無料・有料別に紹介します。
おすすめ無料テーマ3選
Shopifyが提供する無料テンプレートのおすすめ3点の概要を紹介します。
- Dawn
- Boundless
- Narrative
1. Dawn
Dawnは、アパレルやアクセサリー、コスメなどを販売するサイトに適した無料テンプレートです。商品詳細ページや画像、動画などのカスタマイズの自由度が高く、簡単な操作でサイト全体をカスタマイズできます。
Dawnの概要は以下の通りです。
利用料金 | 機能概要 |
無料 | ・クイック設定 ・ビジュアルストーリーテリング ・カートメモ ・おすすめ商品 ・よくある質問ページ ・サイズ表 ・スライドショー ・ルックブック ・おすすめ商品 |
2. Boundless
Boundlessは、優れた画像表示機能を持つ無料テンプレートです。スライドや全幅表示などの機能によって、商品の魅力を顧客に伝えることができます。
Boundlessの概要は以下の通りです。
利用料金 | 機能概要 |
無料 | ・フェード機能付きスライドショー ・常時表示のメニュー ・単一商品のギャラリー ・コレクション画像の全幅表示 ・ホームページ上の動画表示 |
3. Narrative
Narrativeは、高品質のデザインと豊富な画像表示機能を持つ無料テンプレートです。比較的商品数の少ないECサイトに適しています。
Narrativeの概要は以下の通りです。
利用料金 | 機能概要 |
無料 | ・ヒーロービデオ ・ビジュアルストーリーテリング ・固定メニュー ・垂直スライドショー ・ワイドレイアウト |
おすすめ有料テーマ7選
Shopifyの有料テンプレートの中でも評価の高い、以下の7点の概要を紹介します。有料テンプレートの利用料金は、ECサイト上でのテンプレート公開時に請求されます。
- Pipeline
- Palo Alto
- Kingdom
- Envy
- Spark
- Highlight
- Responsive
1. Pipeline
Pipelineは、モバイル端末を利用する顧客が快適なショッピングを行えるように設計されたテンプレートです。ページ作成や顧客リスト作成を簡単に実施できるスターターテンプレートを搭載しています。
Pipelineの概要は以下の通りです。
利用料金 | 機能概要 |
280ドル | ・カートメモ ・クイック購入 ・スライドアウトカート ・おすすめ商品 ・よくある質問ページ ・カスタマイズ可能な問い合わせフォーム ・アニメーション ・サイズ表 ・スライドショー ・ルックブック ・商品動画 ・画像のズーム ・画像のロールオーバー ・画像ギャラリー ・高画質の画像 |
2. Palo Alto
Palo Altoは、アパレルやアクセサリー、コスメなどを取り扱うネットショップに適したテンプレートです。簡単な操作でデザインや機能をカスタマイズできます。
Palo Altoの概要は以下の通りです。
利用料金 | 機能概要 |
250ドル | ・カートメモ ・クイック購入 ・スライドアウトカート ・おすすめ商品 ・よくある質問ページ ・カスタマイズ可能な問い合わせフォーム ・アニメーション ・スライドショー ・商品動画 ・画像のズーム ・画像のロールオーバー ・画像ギャラリー |
3. Kingdom
Kingdomは、訪問者にとっての利便性を重視したテンプレートです。商品情報や購入プロセスをわかりやすく表示し、購入率向上につながるサイト作りを実現します。
Kingdomの概要は以下の通りです。
利用料金 | 機能概要 |
250ドル | ・クイック設定 ・ビジュアルストーリーテリング ・カートメモ ・クイック購入 ・スライドアウトカート ・おすすめ商品 ・よくある質問ページ ・カスタマイズ可能な問い合わせフォーム ・アニメーション ・サイズ表 ・スライドショー ・ルックブック ・商品動画 ・画像のズーム ・画像のロールオーバー ・画像ギャラリー ・高画質の画像 |
4. Envy
Envyは、多種多様な業種に対応する汎用性の高いテンプレートです。4種類のデザインから好みのものを選択でき、顧客が商品を探しやすいトップページやコレクションページを作成できます。
Envyの概要は以下の通りです。
利用料金 | 機能概要 |
350ドル | ・フラッシュセール ・カートメモ ・クイック購入 ・スライドアウトカート ・おすすめ商品 ・アニメーション ・サイズ表 ・スライドショー ・画像のズーム ・画像のホットスポット ・画像ギャラリー ・高画質の画像 |
5. Spark
Sparkは、比較的規模の大きいECサイトや越境ECを行うサイトに適したテンプレートです。斬新なビジュアルと、サイトの信頼性を高める表示機能とを兼ね備えています。
Sparkの概要は以下の通りです。
利用料金 | 機能概要 |
250ドル | ・クイック設定 ・カートメモ ・クイック購入 ・スライドアウトカート ・おすすめ商品 ・よくある質問ページ ・カスタマイズ可能な問い合わせフォーム ・アニメーション ・サイズ表 ・スライドショー ・ルックブック ・コレクションページメニュー |
6. Highlight
Highlightは、アート・エンターテインメントやアパレル、コスメ分野のショップに適したテンプレートです。商品やコレクションを個性的な表示方法でアピールします。
Highlightの概要は以下の通りです。
利用料金 | 機能概要 |
250ドル | ・クイック設定 ・ビジュアルストーリーテリング ・カートメモ ・スライドアウトカート ・おすすめ商品 ・よくある質問ページ ・カスタマイズ可能な問い合わせフォーム ・アニメーション ・サイズ表 ・ルックブック |
7. Responsive
Responsiveは、取引量の多いストアやECと実店舗販売を並行して行うストア向けに開発されたテンプレートです。カスタマイズの自由度が高く、サイトのコンセプトやブランド紹介などの長い文章を掲載することもできます。
Responsiveの概要は以下の通りです。
利用料金 | 機能概要 |
220ドル | ・クイック購入 ・おすすめ商品 ・よくある質問ページ ・サイズ表 ・スライドショー ・画像のロールオーバー ・画像ギャラリー ・高画質の画像 |
Shopifyのテンプレートに関する課題を外部に相談する際の重要なポイント
Shopifyでのテンプレートに関する疑問や課題を、外部に相談する際の3つの重要点について説明します。
- 外部委託する業務の絞り込み
- 業務を外部委託する目的の明確化
- スキルや実績、費用などを比較・検討して委託先を選定する
1. 外部委託する業務の絞り込み
Shopifyテンプレートを利用する際に、Shopifyに精通したプロへの相談を検討すべき主な業務には、以下の4つがあります。
- ECサイトのコンセプト策定
- Shopifyテンプレートの選定
- テンプレートの機能の活用方法
- テンプレートのカスタマイズ
テンプレートの利用に関して、自社での対応が難しい課題が発生した際には、Shopifyの構築実績を持つ専門家への相談をおすすめします。
2. 業務を外部委託する目的の明確化
テンプレート利用に関する業務を外部委託する際には、業務委託によってどのような成果を期待するのか、具体的にどのような改善を行いたいのかを明確にすべきです。期待する成果や目的を委託先と共有することで、サイトの運用改善を実現しやすくなります。また、今後のサイト運営に役立つ提案やアドバイスを受けやすくなります。
3. スキルや実績、費用などを比較・検討して委託先を選定する
Shopifyテンプレートの選定や活用方法に関する課題は、Shopifyに精通したフリーランスや制作会社に相談・委託しましょう。
相談・委託先を検討する際に重視すべきポイントには、主に以下の3点があります。
- Shopifyの構築・運用実績に関するスキルと実績
- ECサイトで販売する商品や自社の業界に関する知識
- 対応や判断の迅速さ
- 高いコストパフォーマンス
ランサーズでは、Shopifyの構築実績を数多く持つ100名以上のフリーランスが活動しています。自社の課題解決を支援する委託先選びに、ぜひランサーズを活用してください。
Shopifyのテンプレートを活用してECサイト構築を円滑に進めましょう
本記事では、Shopifyのテンプレートに関する情報を、以下のポイントに沿って取り上げました。
- Shopifyは、無料・有料のテンプレートを提供している
- ECサイトのコンセプトに合ったテンプレートを選定すべき
- テンプレートの選定時には全ページのデザイン、日本語対応の有無などを確認する
- テンプレートの初期設定や基本的なカスタマイズは、Shopifyの管理画面で実施できる
- デザインの特徴や機能を比較した上で、利用するテンプレートを決定する
- 自社での解決が難しい課題や疑問が生じた場合は、外部への相談・委託を検討すべき
ECサイトのコンセプトに合致したデザインと機能を持つテンプレートを選定・利用すれば、訪問者の商品購入を促進しやすくなります。本記事で紹介した、Shopifyのテンプレートに関する情報を参考にしていただき、自社ECの目的に即した、サイト構築・運用を実現してください。
