Shopify

Shopify Editions | Summer ’25 を調査。新テーマ”Horizon”について、など

Shopifyテーマ開発の新時代を象徴する「Theme Blocks」が、ついに本格始動します。昨年のShopify Editionsで初めて紹介されたこの革新的な機能は、これまで開発者プレビュー限定で提供されていましたが、Winter ’25のアップデートを機に、すべてのテーマで正式に利用可能となりました。

さらに、新テーマではAIによるブロックの生成もできるようになります(2025年5月27日現在は、「アカウントの言語」が「English」になっている時のみ利用可能)。

いろいろなメディアですでに本Editionの紹介がされていますが、本記事では実際に触ってわかったことなどを突っ込んで書いていきます。

新テーマ”Horizon”

新テーマ”Horizon”は、Shopify の「新しいデザイン基盤」「テーマブロックの力」を活用することで、「完全な柔軟性」を実現することを目的としているとのこと。

デザインプロセスを効率化するために、AIの活用も強調されています。

具体的には、「カスタムテーマブロック」。プロンプトで指示するだけでAIがセクションブロックを生成します。

AIによるブロック生成

2025年5月27日現在は、「アカウントの言語」が「English」になっている時のみ対応している。

現在でもこの設定を変更すれば機能は使用できる。

AI生成ができる言語要件について

Just a moment...

この機能は現在、アカウントの言語を「英語」に設定してないと使用できません。

と、記載されている。

アカウントの言語の変更のしかた

これまた分かりづらいのですが、以下の操作でアカウントの言語を変更できます。

「設定」>「言語」で設定できる、ストアの言語の方ではないので注意!

①管理画面右上のストア名をクリック

②表示されるメニュー内の「アカウント管理」をクリック

③「言語」を「English」にして保存する
(保存後、ブラウザをリロードすると管理画面上の日本語が英語に変わりますが、「日本語」に戻すときの手順も同じです)

英語に変わった。

言語を”English”にしたあとのテーマカスタマイズ画面

①セクション内のブロック追加のときに表示される”Add block”の表示

②これを押すと、以下のように「生成」または「Generate」というボタンが出現する(アカウントの言語を「English」にしていないと出ない)

③以下のようにプロンプトを入力する枠が表示される

超適当に日本語のプロンプトを入力してみた。言語を英語にしているから英語のプロンプトでないと認識されていない?

“Generating Block…”と表示され、ブロックのコード生成が開始された

新たなブロックが生成され追加された

Github上で変更ログを見ると、確かに”blocks”と”templates”に変更があったことがわかる

エンジニア目線で感じたこと

GUI操作のみで裏側で実際にコードが生成されていくのは、「コードを管理している人=エンジニア」という構造じゃなくなる、ということを、プロジェクトメンバーの共通認識にしていく必要がある。

場合によっては、コーディングをしない担当者が、ノーコードで作ったセクションブロックの動作検証・・・例えば、GUIでの作成時にデスクトップでの表示だけを見ていて、モバイルでの表示を見ないままテーマを公開すると、モバイル版ではおかしな表示になって、その修正が必要になることもあり得る。

そうした際に、「AIによるブロック生成」でテーマをカスタマイズすると、裏側でコーディングされる、ということを共通認識している必要がある。

実際にどのように生成できるか動画を作成しました

以下の動画で実際に生成しているところを見れるが、途中、生成されたブロック内のテキストを打ち替えると、ほかのブロックにも連動してしまう挙動などが見られたので、やはりブロック生成時にプロンプトで要件を的確にする必要がある。この点、筆者が推しているAIコーディング同様に、エンジニアが書くプロンプトは論理が通っているのでますますこれから「プロンプトエンジニアリング」のスキルが必須リテラシーになっていく時代になる。

また、生成したブロックは他のセクションでも再利用できるところも収録できた。

なお、Summer ’25 Editions 全体で見ると、AIはストアデザイン以外にも様々な領域で活用されています。

例えば、Sidekick は「image generation」機能を提供し、キーワードに基づいてビジュアルを生成できます。

“Shop”アプリ推進

以下、別記事に記載したが、”Horizon”のテーマでは、アカウントページ周りを「新しいお客様アカウント」の仕様にアップデートしなければいけない。

“Horizon”でなきテーマでも、2026年8月26日までに、Shopifyのサンキューページと注文状況ページを新バージョンにアップグレードする必要があります。新しいページでは、アプリブロックやウェブピクセルによるカスタマイズが可能で、旧バージョンの機能はサポートされなくなります。アップグレードしない場合、既存ページは自動的に新ページに置き換えられる。

以前からShopifyが、このアカウントページの仕様を推進していたが、本格的に全ストアが2026年8月26日までにこの仕様になるということだ。

上記記事でも記載しているが、新しいお客様アカウントのページは、URLがストアのサブドメインURLを使用しなければいけないため、必然的にDNSの追加設定が必要になる。

推測ですが、新しいお客様アカウントのページは、おそらくセキュリティ的にShopifyの中ででサーバーが別になっていると思われます。

この新しいお客様アカウントのページは”Shop”アプリとも連動していて、”Shopアプリ”単体の使い方も面白く、いくつものShopifyストアを横断する形になっている。

このアプリでは主に、アカウントの決済の履歴として、全Shopifyストアで決済をした履歴を一括で確認でき、一度決済したストアはShopアプリ上で最新情報が確認できたりする。

Shop Apple App Store

‎Shop: All your favorite brands
‎Elevate every shopping moment - Shop, track, and explore the latest trends in an all-in-one shopping app - Never miss a sale, restock, or order update with pu...

Shop Google Play

Shop - Google Play のアプリ
新しいブランドを発見し、タップするだけでチェックアウトし、リアルタイムの注文追跡を取得します。

ストアのブランドアセット設定項目

追加すべきもの

必須

  • アプリやチャネル全体で使用される一般的なブランドアセット
  • デフォルトのロゴ
  • 正方形のロゴ

一部のアプリやSNSチャネルで使用されるもの

  • カバー画像
  • タグライン └ブランドや企業の理念や魅力を簡潔に表現する短いフレーズのことです。日本語では「キャッチコピー」「スローガン」に近い意味で使われることがあります。例: ブランド タグライン(英語) 意味/日本語訳例 Nike Just Do It. とにかくやってみよう。 Apple Think Different. 常識を疑え。 L’Oréal Because you’re worth it. あなたには、その価値がある。
  • 簡単な説明
  • SNSリンク

“Sidekick”で操作方法やストア運営のアドバイスをAIに相談できる

右上に表示されているボタンからSidekickを呼び出せる

Sidekickで操作方法を質問できる

新アプリ「Knowledge Base」

Customize FAQs used by AI agents to answer shopper questions | Shopify App Store
AI agents are changing how people shop online. When shoppers use AI agents to search for products or ask about store policies, Shopify provides ans...

このアプリはすでに公開されていますが、日本語対応はまだされていません。

AIショッピング・エージェントのアプリ

主な機能は3つ

  • AIがストアの「ポリシー」に記述された内容を判読し、FAQを自動で生成してくれる
  • お客様がストアにどんな質問をしているのかを監視してくれる
  • さらに幅広い質問に対応するために自分でカスタムFAQが作れる

アプリの画面
日本語対応はまだされていません。現時点ではサポートも英語のみとのこと!

ナナイロ

ECサイト制作に強いフロントエンドエンジニア。Web関連のお役立ち技術情報を発信しています。 2025年の最新のAI生成コーディングのコースをUdemyに公開いたしました。爆速でコードを書きたい方は必見です!! さらに、今年(2025年)からVoicyのパーソナリティに挑戦し始めました!ラジオでWebエンジニアの生の声をお届けしています。