Shopifyのオンラインストアのデザインを変えるとき、「どのページに手を入れるべきか」「変更後に全体の印象がどう変わるか」を考えるのは意外と大変です。
Shopify Canvasは、ストアの全ページを1つの無限のワークスペースに並べて、見渡しながら編集できるデザイン画面です。ページ上の要素を直接編集することも、Sidekickにやりたいことを言葉で伝えて変更してもらうこともできます。
Canvasは2026年10月1日にShopifyが発表し、数日かけて提供が広がっている段階です。本記事では、公式の発表とヘルプに、株式会社Tsun（以降、弊社）が発表前から開発ストアで検証した内容を加えて、できること、使い方、制限、使い始める前の注意点を解説します。公式情報は2026年10月2日時点、画面は2026年9月30日と10月2日に確認した内容です。画面や動作は今後変わる可能性があります。
Shopify Canvasとは
Canvasは、Shopifyのオンラインストアのテーマを編集するための画面です。ホームページ、商品ページ、コレクションページ、カートなどの複数のページが、1枚のキャンバスに並んで表示されます。
複数のページを並べて編集できる、テーマの編集画面
Canvasを開くと、テーマのページが縮小表示で並びます。ページをクリックすると、そのページが拡大表示になり、要素を選んで編集できます。
従来のテーマエディターとの違い
従来のテーマエディターは、編集するページやテンプレートを切り替えながら作業する形式です。Canvasでは、複数のページを並べたまま、ページ間の印象を見比べられます。たとえば、ホームページで使った言葉やイメージが、商品ページやカートとそろっているかを確認しやすくなります。
Shopifyは、Canvasは今のところ従来のテーマエディターを置き換えるものではない、としています。
出典：Shopify「Introducing Canvas」（英語）（2026年10月2日確認）
Canvasの提供状況と利用条件
Shopifyの発表では、Canvasは既存のストアに数日かけて提供が広がるとされています。一方、ヘルプには、現時点では一部のストアのみ利用できるという記載もあります。ストアによってはまだ表示されない場合があるため、Shopify管理画面の「オンラインストア」→「テーマ」で、テーマの「…」に「Canvas で複製」が表示されるかを確認してください。
利用するための主な条件は、次のとおりです。
| 項目 | 内容 |
|---|---|
| 利用できる端末 | パソコンのみ |
| プラン | テーマのカスタマイズができるプラン。対象外のプランに変更すると、Canvasで編集したテーマは表示はできますが、編集と公開はできません |
| スタッフの権限 | 「オンラインストア」の「テーマ」で、コードを編集する権限（英語版ヘルプでは「Edit code」）が必要です |
| 対応するテーマ | Shopifyが開発したテーマと、カスタムテーマ。サードパーティ製のテーマには対応していません |
| 従来のテーマエディター | 今のところ置き換えられず、引き続き使えます |
出典：Shopify Changelog「Design a fully bespoke store with Canvas」（英語）、Shopifyヘルプセンター「Canvasの要件と考慮事項」（英語）（2026年10月2日確認）
Canvasでできること
複数のページを並べて確認する
Canvasを開くと、次のように複数のページが並びます。画面下側の「お客様の声」は、あとの依頼で追加したセクションです。
（Canvasの全体表示）
画面上部の「ジャンプ」から、確認したいテンプレートを検索して追加できます。テスト用のストアでは、ホームページ、商品、コレクション、カート、検索、ギフトカード、固定ページ、ブログ、パスワードページなどが並びました。追加したテンプレートは、ブログ記事のように表示するデータを切り替えられるものもあります。
「ジャンプ」を開くと、追加できるテンプレートの一覧が表示されます。
（「ジャンプ」のメニュー）
ページを拡大して見たいときは、そのページをクリックします。全体を見渡したいときは「全体表示にズーム」を使います。
テンプレートとプレビューする商品・記事を切り替える
Canvasでは、ページごとにテンプレートと、プレビューに使う商品や記事を切り替えられます。商品ページを拡大すると、左上に「Default product」のようなテンプレート名、上部に「/products/gift-card」のようなプレビュー対象の切り替えボタンが表示されます。
（商品ページのテンプレートとプレビュー対象）
テンプレート名のボタンを押すと、そのページ種類のテンプレートの一覧が表示されます。テスト用のストアでは、商品のテンプレートは「Default product」だけで、「テンプレートを追加」の項目もありました。
（テンプレートの切り替えメニュー）
プレビュー対象のボタンを押すと、商品の検索欄と一覧が表示されます。一覧から選ぶだけで、プレビューする商品を変えられます。
（プレビューする商品の選択）
別の商品を選ぶと、テンプレートはそのままで、商品だけが切り替わります。次の画像は「The Videographer Snowboard」を選んだ状態です。同じデザインが、商品によってどう見えるかを確認できます。
（商品を切り替えた表示）
記事ページも同じ仕組みで、ブログ記事のテンプレート（Default article）では、プレビューする記事を一覧から選べます。記事が1件もないストアでは、記事ページのプレビューが「404 Page not found」になるため、先に記事を作成しておきましょう。
（プレビューする記事の選択）
ページ上の要素を選んで編集する
拡大表示したページで見出しや画像などをクリックすると、選択枠とセクション名のラベルが表示されます。要素の近くにはSidekickの入力欄が現れ、見出しのサイズなど、その要素に合わせた簡易設定も表示されます。公式のヘルプによると、テキストはプレビュー上でクリックして直接編集することもできます（一部の古いテーマを除く）。
見出しを選択すると、次のように選択枠、セクション名のラベル、Sidekickの入力欄が表示されます。
（見出しを選択した状態）
Sidekickにデザイン変更を依頼する
「この見出しをもっと短くしたい」「この部分の印象を明るくしたい」のように、やりたいことを言葉で伝えられます。変更する場所と目的を一緒に伝えると、意図が伝わりやすくなります。
テスト用のストアで、ホームページの見出しを選び、「ホームページの最初の見出しを、扱う商品がすぐ伝わる短い言葉にして」と依頼しました。Sidekickは商品の構成を確認したうえで、見出しを「Generated test data」から「スノーボードとスキーワックス」に変更しました。結果はストアの商品やテーマによって変わるため、変更後は必ずプレビューで確認してください。
入力欄に依頼文を入力した状態です。
（Sidekickへの依頼文の入力）
送信すると、Sidekickが商品を確認して見出しを変更し、完了を報告します。
（Sidekickによる見出しの変更と完了報告）
既存の設定にない要素も、依頼できます。ホームページに「お客様の声を3件並べる新しいセクションを追加して」と依頼すると、Sidekickはレイアウトの案を選択式で確認したうえで、3列のカードのセクションを追加しました。実際のレビュー文は用意されていなかったため、架空の評価は載せず、差し替え前提の仮の文章が入りました。追加できる内容や仕上がりは、テーマや依頼内容によって異なります。なお、Canvasではテンプレートに新しいブロックを手動で追加することはできないため、追加したい要素はSidekickに依頼します。
Sidekickが追加した「お客様の声」セクションは、次のように表示されます。
（追加された「お客様の声」セクション）
Sidekickそのものの機能や使い方は、次の記事で詳しく解説しています。
プレビュー幅でパソコンとスマートフォンを確認する
画面上部の「プレビューの幅」で、全幅、デスクトップ（1280px）、タブレット（768px）、モバイル（375px）を切り替えられます。任意のpx指定もできます。変更後は、パソコンとスマートフォンの両方で読みやすいかを確認しましょう。
「プレビューの幅」を開くと、切り替えられる幅の一覧が表示されます。
（「プレビューの幅」のメニュー）
モバイルに切り替えると、見出しが折り返されるなど、パソコンとは違う見え方を確認できます。
（モバイル表示のプレビュー）
Sidekickに頼んで新しいテーマを作る
既存のテーマを複製するほかに、新しいテーマをSidekickに作ってもらうこともできます。「オンラインストア」→「テーマ」の「＋新規」を押すと、Canvasが開き、Sidekickがストアの雰囲気などを質問してきます。公式のヘルプでは、ブランドを説明すると、Sidekickがその内容からテーマを作るとされています。
「＋新規」を押すと、次のようにSidekickが希望の雰囲気を選択肢で聞いてきます。
（「＋新規」でSidekickが雰囲気を質問する画面）
テスト用のストアでは、「＋新規」を押した時点で下書きのテーマが1件作られました。試すだけのつもりでも、テーマの一覧に下書きが増える点に注意してください。
Canvasの基本的な使い方
ここでは、テスト用のストアで確認した手順を紹介します。Canvasを利用できるストアでは、画面の名称や手順が異なる場合があります。
1. テーマを「Canvas で複製」する
Shopify管理画面で「オンラインストア」→「テーマ」を開き、Shopifyが開発したテーマ（Horizonなど）かカスタムテーマの「…」から「Canvas で複製」を選択します。複製したテーマは「（元のテーマ名）のコピー」という名前の下書きテーマとして一覧に表示され、「Canvas」のラベルが付きます。元のテーマとは別のテーマになるため、Canvasでの変更は元のテーマに反映されません。公開中のテーマを直接編集せずに試せるので、まずは複製したテーマで試すと安心です。アプリや翻訳を使っているストアは、先に「Canvasの制限と注意点」を確認してください。
「…」を開くと、次のように「Canvas で複製」を含むメニューが表示されます。
（テーマの「…」のメニュー）
一度Canvasで編集するテーマにしたあとは、一覧の「テーマを編集」を押すとCanvasが開きます。
テーマの一覧では、Canvasで編集するテーマに「Canvas」、試用中のテーマに「トライアル」のラベルが付きます。
（テーマの一覧と「Canvas」「トライアル」のラベル）
2. 変更したいページを開く
Canvasが開いたら、改善したいページをクリックして拡大します。迷ったときは、訪問者が最初に見ることの多いホームページから始めると、変更の目的を決めやすくなります。ほかのページと比べたくなったら、「ジャンプ」でそのページのテンプレートを追加します。
3. 要素を選んでSidekickに依頼する
見出しや画像など、変えたい要素をクリックして選択し、Sidekickに依頼します。「何を伝えたいのに、今は伝わりにくいか」を考え、場所と目的を一緒に伝えます。一度に多くの箇所を変えるより、1つずつ調整したほうが効果を確かめやすくなります。
4. 変更後の見え方を確認する
変更した箇所だけでなく、ページ全体とのつながりも確認します。見出しと画像の内容は合っているか、ボタンの役割はわかるか、ほかのページと雰囲気がずれていないかを見ます。「プレビューの幅」でスマートフォンの表示も確認します。思ったとおりにならなかったときは、「元に戻す」やテーマ履歴を使えます。
5. 公開または更新する
下書きのテーマでは、画面右上のボタンが「公開」です。公開中のテーマをCanvasで開いた場合は「更新」で、押すと変更の件数と「変更を公開」ボタンが表示されます。Canvasでの変更は自動で保存されるため、保存ボタンはありません。お客様には、公開するまで変更は表示されません。公開の操作をする前に、編集しているテーマが公開中か下書きかを、左上のテーマ名（カーソルを合わせると表示されます）と右上のボタンの表示で確認してください。
公開中のテーマで「更新」を押すと、次のように変更の件数と「変更を公開」ボタンが表示されます。
（「更新」を押したときの表示）
実際に触ってみた感想
ここからは、弊社が発表前からテスト用のストアでCanvasを触ってみた感想です。機能の説明とは分けて、印象や気になった点をまとめます。感じ方は、ストアやテーマ、依頼の内容によって変わります。
良かった点
いちばん印象に残ったのは、複数のページを並べたまま依頼できることです。ホームページの見出しを変えたあと、商品ページやカートとの雰囲気が合っているかをそのまま見比べられるので、ページを切り替えて確認する手間が減ると感じました。
Sidekickへの依頼も、手軽でした。見出しの依頼では、書く内容を決めていなくても、商品の構成を確認して具体的な言葉を提案してくれました。文言に迷うときのたたき台として使いやすそうです。
新しいセクションの追加では、レイアウトを選択式で確認してくれた点と、実際のレビュー文がないため架空の評価は載せずに仮の文章にした点が安心できました。公開前に、実際の内容へ差し替える前提で進められます。
変更が未公開の状態で保持され、「元に戻す」やテーマ履歴もあるため、気軽に試しやすいとも感じました。
気になった点
依頼の対象は最後に選んだページや要素になるため、別のページの変更を頼むときは、依頼文にページ名を入れる工夫が必要でした。
Sidekickがテーマのファイルを書き換える点も、意識しておきたいところです。公開中のテーマではなく、コピーしたテーマで試すことをおすすめします。また、作業中に、依頼していない別のセクションのエラーが報告されたり、プレビュー画像を取得できず最終的な見た目を確認できなかったと報告されたりすることもありました。仕上がりは、自分の目でプレビューを見て確認しましょう。
ストア運営者にとってうれしい点
Canvasを触ってみて、ストア運営者にとって次の3つの点が期待できると感じました。効果はストアやテーマ、依頼の内容によって異なるため、使い方の目安として参考にしてください。
ページ全体を見ながら、デザインを整えやすい
ストア全体の統一感を整えやすい
複数のページを並べて見比べられるため、ホームページで使った言葉や色が、商品ページなどにもそろっているかを確認しやすくなります。
小さな改善を進めやすい
見出しや文言を変えるたびに、管理画面の中で編集箇所を探す手間が減れば、改善を続けやすくなります。
専門知識がなくても、安心して試しやすい
変更を試しやすい
コードや設定画面を調べる前に、やりたいことを言葉で伝えて、たたき台を作れます。
公開前に試せる
コピーしたテーマで作業し、プレビューで確認してから公開できるため、公開中のストアに影響を与えにくくなります。ただし、アプリや翻訳など、Canvasでは扱えない設定があります（「Canvasの制限と注意点」を参照してください）。
制作会社などへの依頼にも使える可能性がある
先にSidekickでイメージを作っておくと、完成イメージを共有しやすくなります。制作会社などに依頼するときの、要望の整理に使える可能性があります。
Canvasの画面の見方
Canvasの主な操作場所は次のとおりです。
| 場所 | 主な操作 |
|---|---|
| 左上 | テーマ名（カーソルを合わせると、公開中か下書きかを確認できます）、「テーマ設定」（ロゴやカラーなど） |
| 上部中央 | 「ジャンプ」でテンプレートを検索して追加、「全体表示にズーム」、「パンモード」（キャンバスを動かす。スペースキーを押しながらドラッグしても動かせます） |
| 上部右 | インスペクターの切り替え、「プレビューの幅」、「元に戻す」「やり直す」、「テーマ履歴」、「更新」または「公開」ボタン |
| 画面下 | Sidekickの入力欄。ページ上の要素を選ぶと、その要素の近くにも入力欄が表示されます。チャットは複数を同時に開けます |
2026年9月30日と10月2日に、テスト用のストア（日本語の管理画面）で確認した内容です。
Canvasの制限と注意点
Canvasは発表されたばかりで、Shopify自身も「まだ埋めるべき差がある」としています。使い始める前に、次の制限を確認してください。
公式に案内されている制限
2026年10月2日時点で、公式のヘルプとChangelogには、次の制限が書かれています。
| 項目 | 公式に案内されている内容 |
|---|---|
| アプリ | アプリブロックとアプリ埋め込みの追加・設定はできません |
| ブロックの追加 | テンプレートに新しいブロックを手動で追加することはできません。追加はSidekickに依頼します |
| 翻訳 | Canvasの中でテーマのコンテンツを翻訳することはできません。翻訳にはTranslate & Adaptアプリを使います |
| マーケット | マーケットごとにテーマをカスタマイズすることはできません |
| ロールアウト | Canvasで編集したテーマを、ロールアウトの差し替え用のテーマとして追加することはできます。ロールアウトから編集したり、Canvasで開いたりすることはできません |
| テーマの更新 | Canvasで編集したテーマは、テーマの更新を受け取りません |
| ダウンロード | Canvasで編集したテーマのファイルは、ダウンロードできません |
| メタオブジェクト | メタオブジェクトのテンプレートは、「ジャンプ」の一覧に表示されません |
出典：Shopifyヘルプセンター「Canvasの要件と考慮事項」（英語）、Shopify Changelog「Design a fully bespoke store with Canvas」（英語）（2026年10月2日確認）
翻訳やマーケット別の設定を使っている多言語・海外向けのストアは、特に注意が必要です。
サードパーティ製のテーマは対応していない
Canvasが対応しているのは、Shopifyが開発したテーマと、カスタムテーマです。テーマストアで購入したサードパーティ製のテーマは、購入済みでもCanvasでは編集できません。テスト用のストアでは、試用中のサードパーティ製テーマ（「トライアル」のラベルが付いたPrestige）の「…」に、「Canvas で複製」が表示されませんでした。また、「Canvas」のラベルが付いたテーマの「…」にも、「Canvas で複製」は表示されません。
「トライアル」のテーマの「…」は、次のように「公開するにはテーマを購入してください」という案内と、「プレビュー」「バージョン」「削除」だけです。
（トライアルのテーマのメニュー）
Canvasで編集したテーマは、テーマの更新を受け取らない
Canvasで編集したテーマには、テーマの提供元からの更新が反映されません。HorizonなどのShopifyのテーマを使っている場合でも、Canvasで編集した複製テーマは、元のテーマの新しいバージョンに追従しなくなります。長く使うテーマをCanvasで編集するかどうかは、この点を踏まえて判断しましょう。
Canvasで編集するテーマでは、アプリの設定ができない
公式のヘルプでも、Canvasではアプリブロックとアプリ埋め込みの追加・設定はできないとされています。弊社の確認では、Canvasで編集するテーマ（「Canvas で複製」などで作ったテーマ）は、従来のテーマエディターも開けなくなるため、アプリを設定する画面自体が使えなくなりました。
Sidekick経由でも追加できませんでした。テスト用のストアで、弊社が提供する「RuffRuff 目次作成」のアプリブロックを記事ページに追加するよう依頼したところ、Sidekickは、インストールと配置先は確認できたものの、アプリブロックそのものを特定できず追加できない、と回答しました（テーマは変更されませんでした）。
アプリを使うストアでは、Canvasで編集するテーマでアプリの表示まで確認できない点に注意してください。アプリの設定は、従来のテーマエディターで開けるテーマで行う必要があります。
Sidekickの変更はテーマのファイルに反映される
Sidekickが変更するのは、テーマそのものです。依頼の内容によっては、既存の設定の範囲を超えて、テーマのファイルが書き換えられます。公開中のテーマに直接依頼せず、コピーしたテーマで試して、プレビューで確認してから公開するのが安全です。
依頼するページを明確に伝える
Sidekickの対象は、最後に選んだページや要素になります。別のページの変更を頼むときは、依頼文にページ名を入れると意図どおりに動きます。
デザイン変更と商品名・価格の変更は別に考える
Canvasで扱うのは、ストアの見た目を整える作業です。商品名や価格など、ストアで管理する情報そのものを変えたいときは、商品の管理画面で内容を確認・編集してください。
Shopify Canvasについてよくある質問
Canvasはすべてのストアで使えますか？
Shopifyの発表では、既存のストアに数日かけて提供が広がるとされています。ただし、ヘルプには一部のストアのみという記載もあります。利用には、パソコン、テーマのカスタマイズができるプラン、テーマのコードを編集する権限が必要です。
従来のテーマエディターはなくなりますか？
Shopifyは、今のところCanvasは従来のテーマエディターを置き換えるものではない、としています。
新しいデザイン要素も追加できますか？
追加を依頼できます。テスト用のストアでは、お客様の声を並べるセクションを追加できました。ただし、追加できる内容や仕上がりはテーマと依頼内容によって異なるため、プレビューで確認してください。
商品情報もCanvasで変更できますか？
ページの見た目の編集と、商品名・価格などの情報の編集は、区別して考えるのが確実です。商品情報そのものを変更する場合は、商品の管理画面で確認・編集してください。
Canvasでアプリのブロックや埋め込みを設定できますか？
できません。公式のヘルプでも、Canvasではアプリブロックとアプリ埋め込みの追加・設定はできないとされています。弊社の確認では、Canvasで編集するテーマは従来のテーマエディターも開けなくなるため、アプリの設定自体が行えませんでした。Sidekickに依頼してアプリブロックを追加することも、できませんでした。
翻訳したストアや、マーケット別に設定しているストアでも使えますか？
Canvasの中では、テーマのコンテンツの翻訳と、マーケットごとのカスタマイズができません。翻訳はTranslate & Adaptアプリで行う必要があります。多言語や海外向けのストアは、この点を確認してから使いましょう。
Canvasで変更すると、すぐに公開されますか？
公開中のテーマをCanvasで編集した場合、「更新」に未公開の変更の件数が表示されました。「変更を公開」を押すまでは、変更は未公開の状態で保持されます。下書きのテーマは、「公開」を押すまでストアには公開されません。実際のストアに反映されたかどうかは、公開後にストアの表示で確認してください。
まとめ：まずは複製したテーマで小さな変更を試す
Canvasは、ストアの複数のページを見渡しながら、Sidekickへの依頼でデザインを整えていける画面です。最初から全体を作り替えようとせず、「Canvas で複製」したテーマで、ホームページの見出しなど1か所を選んで試してみてください。変更の目的を決め、プレビューで仕上がりを確認しながら進めることが、使いこなす近道です。アプリや翻訳、マーケット別の設定を使っているストアは、先に「Canvasの制限と注意点」を確認してから始めましょう。
参考にした公式情報
- Shopify「Introducing Canvas」（英語、2026年10月1日）
- Shopify Changelog「Design a fully bespoke store with Canvas」（英語、2026年10月1日）
- Shopifyヘルプセンター「Canvas」（英語）
- Shopifyヘルプセンター「Canvasの要件と考慮事項」（英語）
いずれも2026年10月2日に確認しました。
