Shopifyをカスタマイズする方法とは？秘訣やおすすめアプリを紹介！

Shopifyをカスタマイズする前にやっておくべきこと

Shopifyを実際にカスタマイズする前に、注意しておきたいポイントがあります。以下のことを覚えるだけでも、自分のしたいイメージに編集できるようになります。

デフォルトのテーマを決める

イメージボードを見つける意味合いも込め、まずテーマ探しから始めていきます。Shopifyの管理画面を開き、オンラインストアをクリックしてみましょう。 テーマには無料のものがあるため、まずはお試しでお金をかけたくない方はここから選ぶのがおすすめです。

さまざまなテーマを見て自分たちのショップのイメージにあうものを選んだら、スタイルを決め、テーマライブラリーに追加をします。 すると自分たちが選んだものが追加となり、テーマが決まります。

無料のものからテーマを探せないときは

無料のものを見てみたものの、なんだか気に入ったテーマがない可能性もあります。「Shopifyテーマストア」をクリックすると、有料のテーマからもお気に入りを見つけられます。 無料の場合は限りがありますが、有料も含めると選べる幅も広がりおすすめです。

配色など自社にあったものを選ぶ

次にECサイトの雰囲気に大きく影響する「配色」を探してみましょう。管理画面の中からテーマエディタを探し、起動を行います。 カスタマイズを押し、細かく作業を進める準備をします。

テーマエディタが起動したところで、セクションのテーマ設定を利用し、自分の好きな雰囲気のレイアウトや、自社のカラーの配色などを使っておしゃれにカスタマイズしましょう。 今の設定から理想どおりの設定に変更できるため、よりオリジナルな雰囲気を出せます。

Shopifyを魅力的にカスタマイズする方法

少しでもユーザーに自社のショップを知ってもらい、いい商品を見つけて購入してもらいたいと考えるのは自然なことです。ユーザーの興味を引くためには以下8つのテクニックがあります。

商品画像を選定する

ユーザーが実際に利用しているシーンを想像させるような商品画像がおすすめです 。写真を見て想像が膨らむと、その場面を達成しようとユーザーが商品をスムーズに購入してくれる可能性も高くなります。

たとえば、服の場合そのまま写真として載せるよりも、実際に人間が着て、さらにほかのアイテムとコーディネートしているところを載せるとよりリアルです。

背景もコーディネートにピッタリなものを選べば、ユーザーが実際にその場所に訪れて服を着ている様子を想像できます。

テキストを設定する

商品名をそのまま載せてしまうより、一緒にブランド名を載せるのも重要です。商品を探すときに一緒にブランド名で検索する方は多く、キャッチコピーの中に含んでおくとスムーズに検索結果へと出てきます。

ユーザーに対しても親切ですし、SEOとしても評価されやすくなります。さらにはh1のタグもあるとよいでしょう。

購入ボタンを設置する

購入ボタンをカスタマイズする際には、どの箇所よりも目立つ色、大きさ、さらに配置にしなければいけません。 どのような商品かまだわからなくても、購入ボタンはどこにあるのかわかるくらいのインパクトが重要です。

背景の色やサイトによって違いはありますが、赤いボタンにしてほかの文字よりも大きくインパクトを持たせているサイトは多いです。

商品の説明を設定する

画像に魅力を感じ、説明を見て安心できると感じられると、その時点で購入ボタンを押す方も多いです。 あまり長すぎず、見やすいようにポイントを絞って説明文でも魅了しましょう。

商品が欲しいと思ったら、次に説明文をみます。ユーザーが気になっていると思われることを簡潔に説明し「こんな商品なのか」と納得させることが大切です。

ただの説明だけで終わるよりも、商品を購入したらどのような未来が待っているのか想像させるような文言も入れておくと、よりイメージできます。

商品レビューを追加する

Shopifyには任意で追加できるアプリ（拡張機能）があるため、ぜひ利用して商品のレビューが入れられる欄を作りましょう。購入するか悩んでいる方は、実際に買った方の感想を知りたいと思っています。 よいコメントも悪いコメントも含めて、生の声を知りたいわけです。

商品は魅力的に感じながらも、使い心地がいまいちわからないと不安を大きく与えてしまいます。 どこを見ても商品のレビューがなくわかりにくい商品と感じてしまったら、購入の可否を考えてしまうでしょう。

クロスセルの仕組みを検討・導入する

通常の通販サイトには商品を選択すると関連商品も一緒に出てくるため、この仕組みを自分のショップにも適用してクロスセルを行うことがおすすめです。自分の好みにあった商品が出てくれば、より「購入したい」と思ってくれるユーザーも多くなるでしょう。

クロスセル、あるいはアップセルの仕組みを導入することで、売上のさらなる促進や、サンクスページの表示によりSNSからの集客も見込めます。

支払い方法には何があるのか表示する

購入ボタンを押してある程度まで進まないと支払い方法がわからない、となると不安を与えるため、事前に表示させて安心を与えましょう。最近ではクレジットカードのほかに、PayPayや楽天Payなどさまざまな支払い方法が存在します。

コンビニでの後払いや代引きができるのか、ほかにはどのような支払い方法があるのか詳しく載せておきましょう。

SEOにも強くなるようにカスタマイズする

自分がユーザーの立場になり、未来を想像できるようなわかりやすい画像、キャッチコピー、商品の説明を意識していくことは、結果SEO対策にもつながっていきます。 ユーザーがわかりにくいと感じるサイトは、SEOにも評価されず圏外になりやすいです。

ユーザーのことを考えカスタマイズしていくと、SEOに評価され上位表示される可能性が高まり自社としても助かるでしょう。 

Shopifyをカスタマイズするために必要な方法

Shopifyをカスタマイズするために必要な方法を説明します。方法は以下2つです。

管理画面からエディター編集する

初心者向けの方法ですが、テーマエディタを管理画面から操作します。商品画像を入れる、テキストの色やサイズを変える、項目の表示・非表示、決済方法や購入ボタンの挿入などはコード編集不要でカスタマイズできます。

管理画面からコード編集する

管理画面からコード編集をするにはエンジニアリングの知識が必要です。HTMLやCSSだけではなく、Liquidと呼ばれるShopifyのテンプレート言語も使えなければなりません。

テーマを自分にあうように大幅にカスタマイズしたい場合は、ローカルにダウンロードして編集することもできます。カスタマイズの自由度が上がるのは大きなメリットですが、上級者向けであるため、必要に応じて業者に頼むのもよいでしょう。

Shopifyをカスタマイズするときの注意点

Shopifyは自分の手腕とテーマ次第で魅力的にカスタマイズできるのが特徴ですが、注意しなければならない点もあります。具体的には下記の2つです。

バックアップを取っておく

変更を加える際にはバックアップを取っておきましょう。テーマの設定をすることによって表示崩れや情報が消える、などの不備があった場合に備えられます。

管理画面から「オンラインストア」を選び「テーマ」をクリックし、テーマを選択してから「アクション」次に「複製」と進むとCSVファイルのダウンロードが可能です。ファイルはしっかりデバイスに保存しましょう。

利用するテーマのサポート有無を確認しておく

自分が加入しているプランによって、利用するテーマでサポートが受けられるかが変化します。自分の知識では対処できないことがあった場合に備え、サポートの有無を確認しておきましょう。

有料プラン（ベーシックプラン以上）に加入していると、無料テーマのデザインサポートを最大60分まで受けられます。

Shopifyのカスタマイズで利用すべきアプリ3選

実際にカスタマイズをする際、どのようなアプリを使ったらよいのかわからなくなってしまう場合もあるでしょう。 以下では、どのようなアプリがカスタマイズに使いやすいか紹介します。

AllInOneProductZoom

AllInOneProductZoomは商品の細かい部分まで確認できます。店頭で購入をするときのように商品の細かい部分を確認できると、よりユーザーが安心して購入できるため、おすすめです。

画像もさまざまなズームの方法があり、ウィンドウズーム、インナーズームなど使えるため便利です。

どのようなアプリか使い心地を知りたい方は、3日間であればお試しも可能です。 どのような使い心地か知ったあとに契約をしてもよいでしょう。

ShogunLandingPageBuilder

ユーザーに興味を持ってもらえるよう、おしゃれなデザインにしたいと考えている方も多いでしょう。 できる限り簡単にカスタマイズしたいと考えている方は、ぜひShogunLandingPageBuilderを利用してください。

商品のページやコレクションページなどさまざまなページを、素人でも簡単に操作しながら自分たちのデザインにカスタマイズできます。10日間無料で試せるため、どのようなデザインがあるのかをみて、使い心地を確認してみましょう。

ProductFilter&Search

ユーザーの商品検索をサポートしてくれるため、購入してもらえる可能性が高くなります。色やサイズ、値段、評価などさまざまな項目から商品検索ができます。 まずはサイズで選びたいユーザーがいた場合、検索の中にサイズがあると大変便利です。

こちらもお試しの期間が14日間あるため、上手に活用してみましょう。

まとめ

パソコンの知識があまりない場合、専門用語をよく利用するサービスは使いこなすのが大変です。  Shopifyの場合はコードがわからなくても、簡単にアプリを利用してデザインをカスタマイズできます。

ユーザーに「ここのサイトのショップで買いたい」「素敵なサイト」と思ってもらうためには、どのようにカスタマイズするかが大きく関わってきます。 画像を目立たせる、キャッチコピーや商品説明なども意識しながら、自社オリジナルにカスタマイズしましょう。

弊社のサービス「比較ビズ」ではご自身のショップをさらに魅力的にするための専門業者が多数存在しています。無料かつ複数の業者に一括で相談できるため、ぜひ活用を検討してください。

監修者のコメント

EC-Consulting Japan株式会社

代表取締役　松下 直人

EC-Consulting Japan株式会社 代表取締役。1989年生まれ大阪府出身。月商500円だったネットショップを1年で月商1300万、2年で月商3000万に。大手モール型ECサイトで総合ランキング1位獲得商品等も手掛ける。自社でもECサイトを運営し”現場で使えるノウハウ”をモットーに現在ではYahoo!認定コマースパートナー企業として累計数百社以上のサポート実績がありクライアントに合った実行戦略を立てて共に課題を解決する伴走型支援を行っている。また、LINE公式アカウントを使ったマーケティングを得意としておりLINEマーケティングツール「LINY」の認定パートナーとしてLINEマーケティングを支援している。

詳しく見る

Shopifyは機能が多く自分が作りたい自社ECサイトを作る為の機能が豊富に備わっています。海外ではシェアが大きいカートシステムの為、越境ECを考えている場合にはメリットが大きいのも魅力の１つです。

ECサイトデザインを考える時に重要な事は、「自分の理想のショップ」を作る事よりも「売れるショップ」に重きを置いてデザインを考える事です。具体的には商品イメージにあった配色や、転換率を意識したボタンの設置です。商材にもよりますが、「元々赤色だった購入ボタンの色を緑に変えるだけで成約率が上がった！」などの事例もEC業界ではよくある話です。

後はサイトに足を運んだお客様が買い物をしやすい様、回遊率を意識したページ構成（カテゴリ含む）も重要になってきます。他の商品も見てみたいと思った時に、探しずらいページデザインになっているとせっかくの購入機会を奪ってしまいかねません。

大切な時間とお金をかけて作るネットショップですから、まずはA/Bテストを実施しながら徐々に改善していき売れるネットショップを目指していきましょう。

執筆者

比較ビズ編集部では、BtoB向けに様々な業種の発注に役立つ情報を発信。「発注先の選び方を知りたい」「外注する際の費用相場を知りたい」といった疑問を編集部のメンバーが分かりやすく解説しています。