Shopifyテーマをアップデート!カスタマイズ方法を徹底解説

Shopifyテーマをアップデート!カスタマイズ方法を徹底解説

「Shopifyのテーマにもアップデートは必要?」
「どうやってアップデートすれば良いんだろう?」

そう考える方もいるのではないでしょうか。

ShopifyのECサイトで利用しているテーマには、定期的なアップデートが必要です。
自分が利用しているテーマがカスタマイズをしたものの場合、手順は煩雑になります。

ここでは、カスタマイズの有無に合わせたテーマのアップデートの方法から、アップデートに便利なツールや注意点について、Shopifyでのマーケティングをより効果的に行えるサービス「DMMチャットブースト」運営チームが解説していきます。

DMMチャットブーストではShopifyに関する記事もございますので、ぜひご覧ください。

DMMチャットブーストforEC

Shopifyでテーマをアップデートする重要性

Shopifyを利用していると、あらゆる場所でアップデートの文字を目にすることが多いと思います。
Shopifyではなぜ高頻度でアップデートが行われているのでしょうか。

Shopifyのシステムは日々更新されている

Shopifyは、2004年にカナダでサービスが開始されたECプラットフォームです。世界175ヵ国、170万以上のストアが運営されており、日本でも急速に利用者数を増やしています。

Shopifyは発展途上のシステムともいえます。
2022年1月現在、直近で行われた一番大きなアップデートは2021年夏のOnline Store2.0の公開です。
OnlinStore2.0に対応することで、以前に比べてテーマをブラウザ上で視覚的にカスタマイズできる範囲が増えることになりました。

また、テーマを読み込むスピードがあがったことで、ストアの表示にかかる時間が短縮しています。このように、システムの軽微なバグの修正から、利便性向上のための大幅なアップデートまで高頻度で何かしらの更新が行われているのです。

Shopifyのテーマをアップデートしなければエラーになることもある

Shopifyのシステムの更新に合わせて、アプリやテーマもアップデートが必要になります。

もしアップデートをしないまま利用している場合、テーマに組み込まれてしまっているバグなどを放置することにもなり、
利用中にエラーが発生する可能性があります。

また、テーマそのものにバグがある可能性もあるため、
テーマをアップデートすることでバグを修正したり、新機能を取り入れることができるようになるのです。

使用しているテーマが最新かどうか確認する方法

Shopifyのストアでテーマをアップデートする前に、現在使用しているテーマが最新のものかどうか確認する必要があります。

順を追って説明します。

バージョンを確認する方法

まず、現在使用しているテーマのバージョンを確認します。
テーマエディターソースコードどちらからも確認が可能です。

テーマエディターからバージョンを確認する

1.Shopifyの管理画面から「オンラインストア」を選び、「テーマ」の「カスタマイズ」をクリックする

引用:Shopify管理画面

2.テーマエディターが開くので、画面左上にあるテーマ名横の「…」をクリックする

引用:Shopify管理画面

3.テーマ名の下に、現在使用しているバージョンが表示される

引用:Shopify管理画面

ソースコードからバージョンを確認する

1.Shopifyの管理画面から「オンラインストア」から「テーマ」を選び、
アクション」の「コードを編集する」をクリックする

引用:Shopify管理画面

2.ソースコードの編集画面が開くので、「Config」フォルダ内「settings_scheme.json」ファイルを開く
引用:Shopify管理画面

3.コード冒頭に「theme_version」として、使用しているバージョンが記載されている

引用:Shopify管理画面

更新内容を確認する方法

現在使用しているテーマのバージョンを確認したら、配布されているテーマのバージョンおよび更新内容を確認する必要があります。

1.テーマストアhttps://themes.shopify.com/?locale=ja)に移動して、使用しているテーマを検索する

2.テーマを選択しテーマの詳細ページを開いたら、画面下部にある「サポートおよびドキュメント」(英語表示の場合は「Support and documentation」)内の「ドキュメントを読む」(英語表示の場合は「Read the documentation」)を開き、テーマを配布しているサイトから情報を確認する

3.テーマの更新履歴から、最新のバージョンおよび日付を確認する


Shopifyテーマをアップデートする方法

使用しているテーマのバージョンが古くアップデートが必要な場合、テーマをカスタマイズしているかどうかで手順が異なります。
テーマをそのまま使用している場合、カスタマイズしている場合のそれぞれについて、必要な手順を説明します。

テーマをそのまま使用している場合

テーマを何もカスタマイズすることなくそのまま利用している場合、テーマの更新があると自動で更新されます。
そのため、特に操作は必要ありません。有料のテーマを利用している場合でも、更新は無料で行われます。

テーマをカスタマイズしている場合

テーマに何かしらのカスタマイズを行っている場合や、コードを変更したアプリをインストールしている場合、手動で更新を行う必要があります。

1:使用しているテーマを複製する

Shopifyの管理画面から「オンラインストア」から「テーマ」を選び、「アクション」の「複製」をクリックし、現在ストアに使用しているテーマのバックアップを作成します。

引用:Shopify管理画面

バックアップを作成することで、もしテーマのアップデートに失敗した場合でも正常に動作していた状態に戻すことが可能になります。

2:元にしているテーマの最新版をダウンロードする

Shopifyのテーマストアから、使用しているテーマを検索し、テーマの詳細ページを開きます。

テーマライブラリーに追加する」や「Add latest theme version」など、最新版のテーマをダウンロードできるボタンが表示されているので、クリックしてテーマライブラリーに最新版を追加しましょう。

ダウンロードしたテーマを誤ってカスタマイズ前に公開しないためにも、「ダウンロードした日付」や「更新中」など、作業時に分かりやすい名前を付けておくと便利です。

3:カスタマイズ箇所を最新版のテーマに反映させる

ソースコードの編集画面などから、カスタマイズして使用していた箇所を最新版のテーマに手動で反映させます。

カスタマイズした箇所のコード内に以下の記法でコメントを残しておくと、次回の更新時や設定の修正時など、後で見直しやすくなります。

{% comment %}コメント{% comment %}


4:作成した最新版テーマをアップロードして確認する

最新版にカスタマイズ箇所をすべて反映させたら、公開前に必ず動作や表示のテストを行いましょう。商品の検索から購入など、ユーザーが行う動作を一通りテストして問題がないか確認したほうが安心です。

問題が無いようであれば、公開してアップデート作業は完了になります。

DMMチャットブーストでは👉shopifyの構築に関する記事もございますので、ぜひご覧ください。

Shopifyテーマのアップデートに便利なツール2選

Shopifyのテーマはカスタマイズを行っているとアップデートがとても煩雑になります。

そこで、アップデートを楽にしてくれる便利なツールを2つ紹介します。

Shopifyテーマのアップデートに便利なツール①Shopify CLI

Shopify CLIは、Shopify公式が配布している、Shopifyのテーマやアプリ開発に使用できるコマンドラインツールです。
Shopify CLIを利用することで、ローカルにShopifyの開発環境を構築できるようになります。

Shopify CLIでは開発したコードを、アップデート前に事前にローカルでプレビューすることが可能です。
そのため、カスタマイズしたテーマもローカル上でテストすることができます。

アップデートする場合も、一時的に非公開にしたり、既存テーマを更新したりとオプションを選ぶことができます。

Shopifyテーマのアップデートに便利なツール②ExIm

ExImは、ストアのページやブログ、テーマなどをエクスポートしたりインポートできるストアアプリです。
これを利用することで、必要なファイルだけを出力したり、取り込むことができるようになります。

通常、テーマを再インストールした場合は「Config」フォルダにある「setting_data.json」などの設定が記載されたファイルも更新されてしまいます。しかし、Exlmを利用することで設定を引き継いだままカスタマイズしたファイルをアップデートすることが可能になるのです。

Exlmは、アプリストアから無料でインストールできます。
https://apps.shopify.com/exim-export-import-pages-blogs-theme-settings?locale=ja&surface_detail=theme%20settings%20export&surface_inter_position=1&surface_intra_position=7&surface_type=search

Shopifyテーマをアップデートする際の注意点4つ

Shopifyのテーマをアップデートする際、いくつか重要な注意点が存在しています。
注意を怠ることでストアが動かなくなったということのないように、必ず確認しておきましょう。

Shopifyテーマをアップデートする際の注意点①バックアップを必ず作成する

カスタマイズしているテーマをアップデートする場合、直接コードに触れる必要があります。
そのため、誤って必要なコードを削除してしまい、ストアの表示にエラーが発生する恐れもあります。元の正常に動いていたストアに戻せないという事態に陥らないためにも、必ず作業前のテーマのバックアップを作成するようにしましょう

バックアップしたデータをローカルに保存する場合も、ExImは便利に利用できます。
また、誤ったコードに更新しないためにも、Shopify CLIを使ってローカル環境でテストを行うことでミスの可能性を減らすことができます。

Shopifyテーマをアップデートする際の注意点②アプリを入れている場合はアプリを再インストールする

テーマ内にコードを追加して使用するタイプのアプリをインストールしている場合、テーマのアップデート後にテーマ内にコードを追加するだけではなく、一度使用していたアプリをアンインストールして、アプリを再インストールする必要があります。

アップデート後にアプリが稼働しない事態を防ぐためにも、使用しているアプリ、および変更箇所をしっかり把握しておきましょう。

Shopifyテーマをアップデートする際の注意点③テーマに必要な設定を再設定する

テーマを利用している中で行った設定は、テーマを再インストールしたことですべて初期化されています。
そのため、必要な設定は再度設定し直す必要があります。

これを防ぐには、先述の通りExImの利用が便利です。設定ファイルを更新せずに、必要なファイルだけ更新することができます。再設定箇所が多い場合は使用を検討すると良いでしょう。

Shopifyテーマをアップデートする際の注意点④テーマの修正内容によってはアップデートを見送る

テーマをカスタマイズして利用している場合、カスタマイズ箇所が多いほど手動のアップデートには手間と時間が掛ってしまいます。
もし、テーマのアップデート内容が致命的なエラーなどでは無い軽微な修正の場合、アップデートのコストと比べて、アップデートを見送る判断を行っても良いでしょう。

ただし、アップデート内容の重要性が判断できない場合は、コストが掛ってもアップデートの対応が必要になります。
こまめにアップデートの有無、および内容を確認しましょう。

Shopifyテーマを最新版にアップデートして安全に利用しよう

Shopifyは常に更新が行われ、発展が続いているECプラットフォームです。
安全に利用するためにも、テーマも最新版にアップデートをして利用するようにしましょう。

マーケティングツールとしてLINE公式アカウントを運用しているのであれば、Shopifyと連携可能なDMMチャットブーストとの利用がおすすめです。Shopifyの顧客データとLINE公式アカウントの友だちを紐づけて管理することもできます。

一度資料をダウンロードしてそのメリットをご確認ください。

DMMチャットブーストではShopifyのテーマに関する記事もございますので、ぜひご覧ください。

DMMチャットブーストforEC