Shopifyでデザインカスタマイズをする方法｜初心者向けデザイン方法から外注時のおすすめまで徹底解説

「Shopifyを導入したが、他社とデザインが似通っているのでカスタマイズしたい」「実店舗の個性をShopifyにも反映させたい」という方も多いことでしょう。

Shopifyは、オーナーがデザインをカスタマイズすることができます。 Shopifyでできるデザインカスタマイズは、自社内で対応できるものもあれば、外注がおすすめなものまでさまざまです。

この記事では、Shopifyでデザインをカスタマイズする方法を解説します。

1. shopifyカスタマイズの種類
2. 「初心者向け」ノーコードカスタマイズ方法
3. おすすめアプリ２選
4. 外注するには？
5. 構築業者おすすめ3選

Shopifyカスタマイズの種類

Shopifyでデザインカスタマイズする方法は、コードを使う方法と、使わない方法というの2種類があります。

ここでは、それぞれの特徴を詳しく解説するので参考にしてください。

なお、分かりやすく表にすると以下のようになります。

Shopifyカスタマイズ（ノーコード）

Shopifyは、コードを使ったカスタマイズを行わなくてもテーマやレイアウト・文字体裁・画像サイズ・アイテム表示数などを変更できます。 テーマとはサイト全体のデザインのことでShopifyショップなどでは、見やすいテーマをパッケージのようにして販売しています。 購入してダウンロードするだけで、好みのカスタマイズが可能です。 このほか、テーマをある程度カスタマイズすることもできるので、レイアウトや文字体裁を変えることもできます。 テーマはテンプレートでも、細かな修正を行えばオリジナル性の高い動画を作れます。 操作も簡単なので、コードの知識がなくても可能です。

Shopifyカスタマイズ（コード有り）

HTMLやCSSのコードの基本的な知識があれば、テーマをよりオリジナリティの高いものに変更できます。 たとえば扱っている商品が少し特殊で、テンプレートのテーマでは対応が難しい場合などは、コードが必要な編集を行うといいでしょう。 さらに、プログラマーレベルの知識があれば、完全オリジナルのサイトを作ることも可能です。 Shopifyのシステムでは実装が難しい機能を備えることもできるでしょう。 同業他社が多く、少しでも目立ったり使いやすかったりするサイトにカスタマイズしたい場合に便利です。

ただし、ここまでカスタマイズするには外注がおすすめです。

初心者向けノーコードカスタマイズ方法（ページ別）

では、具体的にはどのような方法でカスタマイズを行えばいいのでしょうか？

ここでは、Shopifyでのカスタマイズは初めての方向けに、ノーコードでできるカスタマイズ方法をページごとに解説します。

トップページ

トップページのカスタマイズは、以下のような方法で行います。

1. Shopify の管理画面にログインする
2. 「オンラインストア」・「テーマ」・「カスタマイズ」の順にクリックする
3. エディター画面に、利用中のテーマで表示可能なコンテンツ（セクション）の一覧が表示される
4. ここで、コンテンツの追加や削除、並べ替えが可能

以上の4ステップでカスタマイズができます。 コンテンツの配置を換える、ヘッダーのロゴサイズの変換、レイアウトの調整なども可能です。 なお、一度改変したデザインを元に戻すことはできません。

もし、一度デザインを変更してみて、元のデザインと比較してみたい場合は、必ずバックアップを取っておきましょう。

商品ページ

商品ページは、以下のような手順で行います。 なお、「オンラインストア」・「テーマ」・「カスタマイズ」の順にクリックして、エディター画面を表示させるところまでは同じです。 商品を追加する場合は、管理画面から「商品管理」をクリックしたうえで、「商品を追加する」を選択しましょう。

また、以下のこともカスタマイズできます。

1. 商品名の設定：一目で商品の特徴が分かる名前にするのがおすすめ
2. 商品説明の設定：分かりやすい文章を心がける
3. 商品画像の設定：写真だけでなくイラスト、3D画像なども編集可能

特に、商品画像は商品の魅力を左右する大切なものです。 撮影機材にもこだわり、魅力的な写真を撮るのはもちろんのこと、イラストや図解なども付けましょう。

レビューページ

レビューページは、ショップを訪れた顧客が商品を買うかどうかの指標にもなる大切なページです。 ネットショップでは現物を見られないので、口コミで評判の良い商品を購入する傾向も高いのです。 Shopify公式のレビューアプリ「Product Reviews」を導入して、ぜひレビューページを設定してみましょう。 このほか、【Judge.me】など有料のレビューアプリを利用する方法もあります。 公式アプリなら必要な項目をクリックしていくだけで設定ができます。

問い合わせページ

問い合わせがすぐにできると、顧客の安心感は高まります。 一目で問い合わせページと分かるように、問い合わせページに画像を入れるなどして目立たせましょう。 管理画面のテーマエディタから問い合わせページのテンプレートをクリックすれば、画像などのコンテンツが追加可能です。

Shopifyデザインカスタマイズ時の注意点

Shopifyデザインをカスタマイズする場合、以下のような3点に注意しましょう。

1. 変更前に必ずバックアップを取る
2. 利用できるサポートを確認する
3. 画像アップロードに関する規定や要件を確認する

バックアップは、オンラインストア→テーマを選択し、さらにテーマからアクションを選択、そこから「複製」を選択しましょう。 それでCSVファイルでバックアップが作成できます。 また、Shopifyはテーマによってサポートレベルが異なるので、テーマごとのサポートレベルを確認したうえで利用してください。 なお、有料プランに加入していれば、無料テーマに関するデザインサポートを最大60分まで利用可能です。 このほか、アップできる画像のサイズは最大で20MB、画素数は最大20メガピクセルです。 ファイルは、JPEG・JPG・PNG・JIFの4種類となっています。

カスタマイズおすすめアプリ

ここでは、カスタマイズにおすすめのアプリを2つ紹介します。

外注する場合

ここでは、Shopifyデザインカスタマイズを外注する場合にかかる費用やおすすめの方法などを解説します。 注意点も一緒に解説するので、参考にしてください。 なお、外注できる範囲は多岐にわたります。 カスタマイズなど全くできないから公式テーマを使った構築をして欲しいといった依頼から、オリジナル機能を構築して欲しいといった依頼も可能です。 ただし、複雑な機能を構築するほど作成期間も長くなり費用も上がります。 メンテナンスも外注が必要です。

費用

一口にShopifyデザインカスタマイズといっても、さまざまな方法があります。 費用の目安は以下のとおりです。

おすすめ

Shopifyの構築やカスタマイズを依頼する会社は、たくさんあります。 選ぶ際に迷ってしまう方も多いでしょう。

以下のようなポイントを参考に選んでみましょう。

• 実績はあるのか
• 口コミはどんな感じか
• 自社が希望する構築やカスタマイズはしてもらえるのか

この3つを基準に業者を絞っていって、見積もりを出してもらいます。 以下に、おすすめの業者を3つ、紹介しましょう。

まとめ

今回は、Shopifyの構築やカスタマイズ方法について解説しました。

Shopifyに限らず、EC事業を進めていく上で”LP”は非常に重要な要素です。

これから始める、あるいは今あるサイトをもっとよくしたいという方の判断材料にしていただき、皆様のサイトがより良いものになるためのきっかけにしていただけると幸いです。