こんにちは。デザイナーの山田です。
神戸に来て半年が経ちました。時が経つのがあっという間で自分でも少し驚いています。
神戸はとてもいいところです。コロナ禍が落ち着きましたらぜひ遊びに来てください。
さて、今回は前回に引き続きShopifyについてです。
今回から具体的な使い方やカスタマイズの話に触れていきたいと思います。
この記事ではタイトルにある通り、Shopifyの商品登録の方法を中心にご紹介いたします。
Table of contents
Shopifyのアカウントを登録する
まずはShopifyアカウントを取得します。
2020年7月1日現在、最初の14日間は無料体験で使用することができるようです。下記が入力が必要な項目でした。
- メールアドレス…登録・管理画面へのログインに必要
- パスワード……管理画面へのログインに必要
- ストア名…オンラインショップ名（サイト名）
- ストアURL（〇〇.myshopify.com）…オンラインストアのURL。ドメインは後から変更可能。
Shopifyの利用に発生する費用に関しては、公式ページをご参照ください。
さて、アカウントが取得できたので、管理画面にログインしてみます。
ここから、商品の登録や注文の管理をおこなっていきます。
ちなみに今の状態だと、オンラインショップの外観はこのような状態になっています。
ここについても、後ほど簡単に編集していきます。
販売したい商品を登録する
では今回は、商品の登録をしてみたいと思います。
せっかくなので、サンプルとして下記の商品イメージを用意しました。
画面左のメニューから「商品管理」をクリックし、「商品を追加」に進みます。
すると、このような画面が表示されます。ここに販売したい商品情報を入力していきます。
商品編集画面の各項目について
| 項目名 | 説明 |
|---|---|
| タイトル | 商品名 |
| 説明 | 商品の説明文 |
| メディア | 商品のイメージファイル |
| 価格設定 | 【価格】 【割引前価格】 【商品1点あたりの費用】※原価 |
| 在庫 | 【SKU / バーコード（ISBN、UPC、GTINなど）】※外部との在庫連携や、商品管理に役立てる場合など必要に応じて入力 【在庫を追跡する】 【在庫切れの場合でも販売を続ける】 【在庫数】※商品が売れると自動的に数値が減る |
| 配送 | 【配送が必要な商品です】 【重量】※送料設定に際して必要 【関税情報】※輸出する場合、入力 |
| バリエーション | サイズや色など、バリエーションがある場合、オプションを入力 ※バリエーションがある場合、バリエーション単位での管理に |
| 検索結果のプレビュー | Googleなどの検索エンジンでどのように表示されるか ※タイトル・デスクリプション・URLを設定可能 |
| 販売チャネル | facebookや実店舗などをチャネルに設定した際、どの販売チャネルで販売するか管理 ※オンラインストアでは販売したいが、facebookではしたくない〜等ができる |
| 商品公開日 | 商品（ページ）の公開日を設定 |
| 商品タイプ | 自由記述 |
| 販売元 | 会社名など |
| コレクション | コレクションの設定 |
| タグ | 商品タグの設定 |
実際にいくつか商品を登録してみました。
UIがシンプルでわかりやすく、とても使い心地が良い印象でした。
なお、csvで一括登録する方法もあるようなので、こちらも方法を抑え次第ご紹介したいと思います。
コレクションを作成する
コレクションとは、わかりやすくいうと商品のカテゴライズのことです。
コレクションを作成することで、お客様がストアに来た際に欲しい商品を探すのに役立ちます。
また、一度作成してしまえば、後から商品を追加したときも自動で割り振ってくれるので、とても便利な機能です。
コレクションの作り方には、「手動」「自動」の2つの方法があるので、ともにご紹介いたします。
手動でコレクションを作成する
画面左のメニューにある「商品管理 – コレクション」を選択し、「コレクションを作成する」をクリックします。
「タイトル」を入力し、「コレクションの種類」の「手動」にチェックを入れて、保存します。
すると、「商品」というセクションが生成されるので、ここから商品を手動で選択してコレクションに追加していきます。
商品の並び順も設定できるので、細かい調整も可能です。
自動でコレクションを作成する
「手動」の場合と同様に「コレクションを作成する」を選択した後、今度は「コレクションの種類」で「自動」にチェックを入れます。
すると「条件」という項目がでてくるので、ここにコレクションに振り分ける設定をしていきます。
例えば下の例では、おすすめ商品をまとめたコレクションを作りたかったので「商品タグ：おすすめ」を条件に設定しました。
設定後に保存すると、「商品」セクションが生成されます。「手動」の場合と同様、並び順も設定できます。
「コレクション」機能は、様々な用途に使えると感じました。
例をあげるなら、上記のような「おすすめ」商品グループを作りたいとき。また、商品の販売元（ブランドなど）でグループを作りたい場合など。
サイト設計に応じて、上手く活用していきたいと思います。
管理画面からテーマを編集する
商品を登録したので、少しだけサイトの外観もカスタマイズしてみたいと思います。
Shopifyでは、管理画面からテーマを編集することができます。
テーマのカスタマイズ画面はこちら。
グローバルメニューや、ブログページ、固定ページもここから編集できます。
WordPressを触ったことがある人なら感じたかもしれませんが、とても似たようなつくりになっています。
そのため、あまり違和感なく操作することができました。
少し編集しただけですが、外観はこのようになりました。
どのようにテーマをカスタマイズ・デザインを実装していくかは、ストアフロントの開発手法やテーマ構成を深く学んでから考えていきたいと思います。
ただ、サイト制作に詳しくない人でも、比較的容易にサイトの見た目を編集できることは間違いなさそうです。
おわりに
あくまで個人的な感想になりますが、いわゆる「直感的でわかりやすいUI」で、ここまで流行した理由もわかる気がします。
なにより触っていてとても楽しかったです。
Shopifyの使い方・カスタマイズ方法については、今後もブログで取り上げていく予定です。
この記事が少しでも皆様の参考になれば幸いです。