サムネイル

【Shopifyマスターへの道】#0 ロードマップを始める前に

【Shopify マスターへの道】#0 ロードマップを始める前に

この記事は、これから Shopify 構築ロードマップを始める方に向けたものです。ロードマップの目標やどんな方に向けたロードマップになっているのかを説明しています。
また、ロードマップで作る EC サイトの完成物を確認します。

2024 年最新版の「新・Shopify マスターへの道」も公開しております。最新の UI を体験したい方は、ぜひ以下の記事をご覧ください。

【新・Shopify マスターへの道】#0 ロードマップを始める前に【2024 年最新版】

Shopify 構築ロードマップをこれから始める方へ

このロードマップの目標

  • Shopify パートナーとしてゼロから EC サイトを作り上げ、オーナーアカウントに所有権を移行する

「Shopify 構築ロードマップ」を進めていくと、誰でも簡単に Shopify で EC サイトが構築できるようになります。

このロードマップでは、オンラインストアを構築して実際に商品を販売できるレベルのストアを目指します。もちろん、全て無料で公開していきます。

Shopify 構築ロードマップの対象者

  • Shopify パートナーとしてストア構築をできるようになりたい方
  • Shopify で EC サイトを構築しネットショップを始めたい方
  • Shopify で EC サイトを構築する流れを知りたい方

基本的には、Shopify パートナーに向けに進めていきます。Shopify パートナーとしてストアを構築し、クライアントであるストアのオーナーに所有権を移行する流れになっています。
ただ、オーナー自らストアを立ち上げたい場合でも、このロードマップを見れば EC ストアを構築することができるようになります。

ロードマップの流れ

次のステップに沿ってストアを構築していきます。

  1. ストア構築の準備をしよう
  2. 商品を登録しよう
  3. コレクションを登録しよう
  4. ブログ記事を作成しよう
  5. サイトのデザインを選ぼう
  6. テーマを編集しよう(セクション編)
  7. テーマを編集しよう(テーマ設定編)
  8. ティザーサイトを作成しよう
  9. サイトのフォントを編集しよう
  10. アカウントページを作成しよう
  11. コンタクトフォーム を作成しよう
  12. About ページを作成しよう
  13. 規約を入力しよう
  14. メニューの編集をしよう
  15. 送料を設定しよう
  16. 一般設定を編集しよう
  17. 各種設定を編集しよう
  18. 決済テストを行おう
  19. 所有権を移行しよう

ロードマップを始める前に準備しておくもの

  • Shopify パートナーアカウント作成用のメールアドレス
  • Shopify ストアを運営するオーナー用のメールアドレス

今回のロードマップでは、パートナーとしてストアを構築し、オーナーに所有権を移行するところまでを体験します。そのため、パートナー用とオーナー用の 2 つのメールアドレスをを用意してください。

デモサイトを構築する際に使用する商品画像や CSV ファイルを上のリンクからダウンロードしておいてください。
ダウンロードせずオリジナルの画像を使って進めてもらっても全然構いません!ただ、CSV ファイルはダウンロードしてもらった方が、楽に進めることができます。

ロードマップを始める前に知っておくべきこと

ロードマップを始める前に知っておかなければいけない必須知識などは特にありません。
もし、Shopify でどういうことができるのか何も知らないという方がいれば、以下の記事を読んでからロードマップを始めてください。

【初心者向け】Shopify について解説 初めての EC サイトにおすすめ!

Shopify パートナープログラムとは?できることや報酬を調べてみた

ロードマップ作成するデモサイトを確認する

ロードマップを始める前に、このロードマップで作成する EC サイトの完成物をみてみましょう。今回は、アクセサリーショップを作成します。

ホームページ

ホームページの全体像です。

ホームページの全体像

EC サイトのトップページです。左上にロゴ、上部にヘッダーメニューがあります。トップ部分は、スライドショーにします。

EC サイトのトップページ1

EC サイトのトップページ2

自社のブランドに関する部分です。別のページに飛ばすボタンを設置します。

自社のブランドに関する部分

セール商品を紹介する部分です。セールコレクションを表示させるよう設定します。

セール商品を紹介する部分

コレクションについての部分です。商品の種類ごとに分けたコレクションを作成し、表示させます。

コレクションについての部分

おすすめ商品を紹介する部分です。カートに追加ボタンや今すぐ購入ボタンがあります。

おすすめ商品を紹介する部分

ブログ記事を紹介する部分です。ブログ記事を作成し、表示させます。

ブログ記事を紹介する部分

最後にフッターメニューです。ポリシーや SNS についてのメニューを追加します。

フッターメニュー

About ページ

自社のブランドについて説明をするページです。liquid ファイルを編集して、新しいページを作成します。

About ページ

商品一覧ページ

商品の一覧表示ページです。全ての商品が表示されます。

商品一覧ページ

ブログ記事一覧ページ

ブログ記事の投稿を見ることができるページです。それぞれのブログ記事に飛ぶことができます。

ブログ記事一覧ページ

コンタクトページ

お問い合わせページです。Shopify のデフォルト機能で作成します。

コンタクトページ

アカウントログインページ

アカウントのログインページです。こちらも Shopify のデフォルト機能で作成します。

アカウントログインページ

その他に作るロードマップで実装すること

  • ティザーサイトのデザインを編集する
  • 文字のフォントを変えるために liquid ファイルを編集する
  • ポリシーページを作成する

ロードマップを制覇して Shopify マスターになろう!

ここまで読んでいただいて、Shopify ストアを作ってみたいと思った方はぜひロードマップを進めていってください!

ロードマップを達成した頃には、あなたも屈強な Shopify マスターになっています!

以下は、おすすめの Shopify アプリです。

  • 「シンプルブログ記事カスタマイズ|お手軽ブログテンプレート」
    「シンプルブログ記事カスタマイズ|お手軽ブログテンプレート」は、Shopify ストアのブログデザインをノーコードでカスタマイズできるアプリです。
    Shopify ストアのブログデザインをノーコードでカスタマイズできるアプリ

「シンプルブログ記事カスタマイズ|お手軽ブログテンプレート」|アプリストア

  • 「シンプルブログ記事目次|自動見出し一覧挿入」
    「シンプルブログ記事目次|自動見出し一覧挿入」は、Shopify ストアにブログ目次を簡単に表示できるアプリです。
    シンプルブログ記事目次|自動見出し一覧挿入

「シンプルブログ記事目次|自動見出し一覧挿入」|アプリストア

こちらの記事もおすすめです!

おすすめ Shopify アプリ

シンプル店舗受け取り|お手軽ローカルピックアップのアイコン

シンプル店舗受け取り|お手軽ローカルピックアップ

お客様がカートページで受け取り店舗・日時を指定できます。テイクアウトや店舗受け取りにおすすめです。

シンプル注文履歴おすすめ商品|お手軽マイページアップセルのアイコン

シンプル注文履歴おすすめ商品|お手軽マイページアップセル

マイページの注文ページに、商品ごとに設定したおすすめ商品を表示。再購入を後押しします。

シンプル顧客メタフィールドCSVインポート・エクスポートのアイコン

シンプル顧客メタフィールドCSVインポート・エクスポート

顧客メタフィールドをCSVで一括管理。エクスポート・編集・インポートがかんたんに。

シンプルフォーム一体型LP|お手軽チャットボット購入のアイコン

シンプルフォーム一体型LP|お手軽チャットボット購入

チャットボット形式でお客様が迷わず注文できるLPを設置できます。コーディング不要で、テーマエディタから簡単に設定できます。

シンプル商品メタフィールドCSVインポート・エクスポートのアイコン

シンプル商品メタフィールドCSVインポート・エクスポート

商品やバリエーションのメタフィールドをCSVで一括管理。インポートもエクスポートもこのアプリひとつで完了。

シンプル新しいお客様アカウント拡張|生年月日・追加フォームのアイコン

シンプル新しいお客様アカウント拡張|生年月日・追加フォーム

誕生日や性別などの項目を、お客様アカウントのプロフィールページに追加できます。コーディング不要です。

シンプル2点目購入割引|2点目以降自動セール設定のアイコン

シンプル2点目購入割引|2点目以降自動セール設定

2点目以降の購入で自動割引。割引バッジと対象商品の表示で、まとめ買いを後押しします。

シンプル商品カルーセル|お手軽おすすめ商品スライダーのアイコン

シンプル商品カルーセル|お手軽おすすめ商品スライダー

おすすめ商品をスライダーで表示できます。ストアのどこにでも設置でき、お客様に気になる商品を見つけてもらえます。

関連記事