shopifyのカスタマイズ方法を解説！【初心者歓迎】
shopifyは誰でも簡単にECサイトを作成できることで注目されている、世界中で大人気のECプラットフォームです。専門的な知識がなくてもカスタマイズ可能で、目的に合ったデザインやテーマが選べます。今回は、初心者・上級者のレベル別におすすめのカスタマイズ方法を解説します。shopifyによるECサイトづくりの参考にしてください。
目次
shopifyの概要
shopifyはECサイトの開発・運営を助けるプラットフォームです。2004年カナダでサービスを開始し、現在では175か国100万ショップ以上に導入されています。ECサイトを始めるために必要な機能が揃っており、管理画面で設定を行うだけで誰でも簡単にECサイトを作成できることから、高い評価を得ています。また、初心者には敷居の高いサーバやネットワークの管理などの負担も掛かりません。日本語対応のみならず、多言語、多通貨にも対応しており、海外配送も可能です。越境ECサイト開設にも向いています。
ネットショップ開業を無料体験 | ShopifyでECサイトを構築しよう – Shopify 日本
shopifyカスタマイズ方法
shopifyは専門知識が必要なコードの編集がわからなくてもカスタマイズが可能です。もちろん、コード編集によってカスタマイズする方法もあります。初心者向け、上級者向けのレベルに合わせたshopifyのカスタマイズ方法についてご紹介します。
テーマエディタを管理画面より操作する（初心者向け）
shopifyでは、好みのデザインやテーマを100種類以上から選択可能です。自社のブランディングやサイト運営で必要な機能が揃っているテーマを選んだら「テーマライブラリー」から「カスタマイズ」をクリックすることによって、さまざまな項目のカスタマイズができます。
自社のロゴ画像を入れる、テキストの色・フォント・サイズを変える、項目の表示・非表示などはコード編集なしでもカスタマイズ可能です。見た目のデザインはECサイトのイメージを印象づけるうえで大切な要素になります。初心者でも変更できる機能は積極的に利用してみましょう。
コード編集をする（上級者向け）
shopifyでは「テーマエディタ」という箇所からコード編集を行ってカスタマイズする方法もあります。しかし、コード編集には、プログラミング用語の専門知識が必要です。知識を持たないままサイト編集を行うと、デザインが崩れたり、Webサイト自体の構造が崩れたりします。正しい形で使えなくなってしまう恐れもあるので、万が一に備えて、編集前にバックアップを取ってからカスタマイズするのがおすすめです。
テーマエディタを管理画面より操作する（初心者向け）
初心者向けにおすすめのカスタマイズポイントを具体的にご紹介します。工夫次第でECサイトの売上や滞在時間が大きく変わるので、自社のニーズに合わせて選択しましょう。
商品名
商品名は顧客の目を引くようにするのがポイントです。GoogleやYahoo！などの検索エンジンで検索されたときに表示されやすくように心掛けましょう。商品名とブランド名をセットで入れるなど、SEO対策するのがおすすめです。
商品画像
ECサイトでは実際に商品を手に取ることができないので、商品画像がとても重要です。写真は角度を変えるなどして複数枚掲載し、アップ画像なども掲載しましょう。実際に商品を使用している写真を掲載すると、顧客はイメージをつかみやすくなります。
shopifyでは、画像ファイルはJPEGまたはJPG、プログレッシブJPEG、PNG、GIFのフォーマットのみをサポートしています。選んだECサイトのテーマによって、表示される写真の大きさが変わるので、掲載写真の解像度に注意が必要です。実際にアップロードした後に、写真の解像度に問題がないかを確認しましょう。
商品説明とキャッチコピー
商品画像で顧客の心を掴み、商品説明でしっかり特徴を伝えるのがポイントです。サイズや色など、商品の詳細なスペックを掲載し、商品を購入することによって得られるメリットなどを記載しましょう。ただし、商品説明が長すぎると離脱に繋がってしまいます。商品説明は簡潔にポイントを押させて紹介するのがおすすめです。
また、キャッチコピーを設定すると顧客は商品をイメージしやすくなります。興味を惹きつけ、目に止まらせるのがキャッチコピーのメリットなので、実際に購入した顧客がどのような商品を求めているかを明確にし、商品の強みを短い言葉にまとめてみましょう。
購入ボタン
購入ボタンはデザインや配置が重要になってきます。shopifyでは、サイズ、フォント、色などを細かくカスタマイズすることが可能です。ボタンを押したときのアクションも指定できるので、こだわってみましょう。
自社ECサイトをどのように閲覧するか、顧客目線でサイト内導線をしっかりイメージしながら、サイトのテーマやデザインに合う購入ボタンを設置します。配置位置もカスタマイズできます。最適なタイミングで購入ボタンを表示できたらベストです。
決済方法
shopifyでは、使える決済方法が幅広く用意されています。一般的なクレジットカードはもちろんのこと、クレジットカードがない人でも使いやすいコンビニ決済やキャリア決済、後払い決済も使用可能です。PayPalを利用した国際送金や、ビットコインなど、まだ一般的ではない決済方法にも対応しています。決済手段の多さはユーザーにとっての利便性に繋がるので、カスタマイズで選択肢を増やしましょう。決済方法の設定は、管理画面から「設定」→「決済設定」で行います。
配送方法
shopifyでは配送方法を細かく設定できます。配送業者の指定や配送料の設定などを細かくカスタマイズできるのが魅力です。配送業者は世界の大手運送会社と提携しており、デフォルトでFedEx、UPS、DHLなどの運送会社を設定できます。配送方法の設定は、管理画面から「設定」→「配送」から設定可能です。
shopifyでは物流システムとの連携も可能です。物流システムを利用すると、倉庫に預けた商品の管理をシステム上で行うことができる、複数の倉庫に預けた荷物の状況が一括管理できるなど、物流にかかる手間を大幅に削減することができます。
shopifyを用いた物流・配送について深く学びたい方は下記記事を参考にしてください
Shopifyの配送の特徴｜物流サービスとの連携で業務効率化｜在庫管理大学｜在庫管理ソフト「ロジクラ」 (logikura.jp)
shopify×物流が可能なサービスをご紹介！｜在庫管理大学｜在庫管理ソフト「ロジクラ」(logikura.jp)
コード編集をする（上級者向け）
既存のテーマでは満足できない、どうしてもやりたいことが実現できない、オリジナルのデザインを使いたいというときなどは、コード編集を使用したカスタマイズがおすすめです。コード編集に必要な知識やコード編集によってできるカスタマイズについてご紹介します。
HTMLやCSSの知識が必須となる
テーマコードを編集していくには、HTML、CSSなどの知識が必要です。Liquidと呼ばれるshopifyのテンプレート言語の知識も加えて必要になります。shopifyのテーマは、フォルダ・ファイル名が固定です。フォルダ構造も決まっていて、ファイルやページは連動しているので、それぞれの役割をわかっていれば、修正箇所がわかるようになっています。テーマを一部ではなく、大幅に変更したい場合は、テーマをダウンロードし、ローカル上でコードエディタを使って編集することも可能です。
カスタマイズの自由度が上がる
コード編集でカスタマイズすれば、サイトの自由度が各段にアップするでしょう。どうしてもカスタマイズしたいけれど、専門知識がないという場合は、shopifyの公式サイトの「Shopify Expert」を通じて、編集を依頼することも可能です。サイト制作・更新、アプリの活用などの深い活用方法を知りたい場合は、市販の本などを参考にするのも良いでしょう。
もっと深く活用方法を知りたい方は下記の本を参考にしてみてください。
Shopify運用大全 最先端ECサイトを成功に導く81の活用法
shopifyはテーマだけでなく、アプリも見逃せない！
shopifyにはテーマ設定以外にもアプリによる拡張機能が充実しています。アプリとしてインストールすることで、オンラインストアを自分好みにカスタマイズできるのです。Apple storeやGoogle playと同じような感覚で「Shopify app store」からアプリが選べます。毎日新しいアプリが更新され、ダウンロードできるアプリ数は数千種類以上もあります。
ただし、アプリを多くインストールすると、ファイルの読み込みに時間がかかり、サイト表示のスピートが落ちてしまうというデメリットがあるので注意しましょう。サイト表示のスピードダウンは顧客の離脱にも繋がるので、自社ECサイトの使い勝手を向上させるアプリは厳選して選ぶのがおすすめです。
shopifyに関するおすすめアプリはこちらの記事をご覧ください。
まとめ
shopifyをカスタマイズすれば、充実したECサイトを作ることができます。デザインが良く、サイト内導線が考慮されたECサイトによって、売上アップも見込めるでしょう。しかし、注文が増える事により、誤出荷や欠品のリスクも高まるといえます。
商品の誤出荷への対策記事はこちら！
【すぐ使える文章例付き】誤出荷が起きてしまった際の報告書の書き方は？｜在庫管理大学｜在庫管理ソフト「ロジクラ」 (logikura.jp)
商品を遅延なく確実に届けることは、顧客満足度に欠かせない条件です。ECサイトのカスタマイズをすると同時に、物流面も強化しておきましょう。
弊社プロダクトである在庫管理・倉庫管理ソフト「ロジクラ」とshopifyの連携も可能です。注文情報をAPI接続でロジクラに取り込み、スマホを使って物流ピッキング作業、バーコードを読み取る検品作業、宅配会社の送り状の発行などが行えます。物流面の強化についても検討されている担当者の方は是非お試しください。
Shopify連携資料
ロジクラとShopify連携概要をまとめた資料です。特徴やAPI連携フロー、導入事例などを掲載しています。
カートシステム「Shopify」とロジクラの連携概要をまとめています。なお、Shopify連携を導入前にお試しすることも可能です。14日間のトライアルも是非ともご利用ください。