Shopifyのテーマをローカルで編集し、反映する(ThemeKitの導入)

ThemeKitをインストールする

まずはターミナル等でPCにThemeKitをインストールする。

下記の公式ドキュメントを参考に、各OSに合った方法でインストールしよう。

アプリの開発>アプリの作成を実行する。

アプリ名とメールアドレスの設定を行えば、アプリが作成される。

まず、AdminAPIの権限、ストアフロントAPIの権限(アクセススコープ)を設定しておこう。

全てにチェックを入れても問題ない。

最後にアプリをインストールして完了だ。

こちらから「ThemeKitAccess」をストアにインストールしよう。

インストールが完了したら、パスワードの設定を行う。

「ThemeKitのパスワードを作成する」を選択すると、任意のユーザーにパスワードを付与できる。

パスワードは対象者にメールで送信されるため、メールからパスワードを確認しよう。

パスワードは一度しか表示されないため、どこかに保存しておくことをお勧めする。

以下のコマンドをターミナルで実行する。

theme get --list --password=[your-theme-kit-password] --store=&quot;[your-store.myshopify.com]&quot;

[your-theme-kit-password]には先ほどメールから取得したパスワードを、

[your-store.myshopify.com]には自分のストアのURLを入力する。

次のように一覧が取得できれば成功だ。

Available theme versions:
  [xxxxxxxxxxx7][live] Dawn
  [xxxxxxxxxxx9] Dawnのコピー

上記一覧から、現在使用しているテーマをローカルにダウンロードする。

[live]が記述されているもののidを使用する。

(上記の例では[xxxxxxxxxxx7])

theme get --password=[your-theme-kit-password] --store=&quot;[your-store.myshopify.com]&quot; --themeid=[your-theme-id]

以下のコマンドを実行することで、ローカルでの変更が反映されるようになる。

theme watch --allow-live

実際の編集操作などはこちらの公式動画が参考になる。