🌐

【Shopify.dev和訳】Apps/Online store/Extensions/Update your app

2021/09/11に公開

Shopify

apps

tech

この記事について

この記事は、Apps/Online store/Theme app extensions/update your appの記事を和訳したものです。

記事内で使用する画像は、公式ドキュメント内の画像を引用して使用させていただいております。

Shopify アプリのご紹介

Shopify アプリである、「商品ページ発売予告アプリ | リテリア Coming Soon」は、商品ページを買えない状態のまま、発売日時の予告をすることができるアプリです。Shopify で Coming Soon 機能を実現することができます。

Shopify アプリである、「らくらく日本語フォント設定｜リテリア Font Picker」は、ノーコードで日本語フォントを使用できるアプリです。日本語フォントを導入することでブランドを演出することができます。

テーマアプリの拡張機能を使用するようにアプリを更新する

このガイドでは、テーマアプリ拡張機能を使用してオンラインストアと統合するようにアプリを更新する方法について説明します。

アプリを更新しない

テーマアプリ拡張のメリット

オンラインストアと統合するアプリは、従来、テーマコードを変更してアセットを挿入し、データを抽出し、テーマの機能を拡張します。マーチャントはテーマコードを編集する必要があることがよくありますが、これは威圧的でエラーが発生しやすい可能性があります。アプリをアンインストールすると、コードの編集やゴーストコードがテーマに残ることがよくあります。これにより、品質とパフォーマンスの問題が発生し、販売者はテーマのアップグレードパスから外れる可能性があります。

たとえば、アプリをオンラインストアと統合するには、次のことが必要になることがよくあります。

公開されたテーマのsnippetsディレクトリにスニペットを追加します。スニペットは、Liquid レイアウト、テンプレート、またはセクションファイルを変更することでページに追加されます。
テーマに JavaScript を挿入すると、ページのレイアウトに HTML が挿入されます。

テーマアプリの拡張機能はテーマコードを編集しないため、次の利点があります。

アプリがテーマに重大な変更を導入するリスクを軽減
最小化されたアプリサポート債務
マーチャントにアプリの統合とカスタマイズのためのよりクリーンなエクスペリエンスを提供することにより、アプリの採用を増やしました。
優雅な、すぐに使える統合エクスペリエンスにより、ユーザー維持率が向上します。

テーマアプリ拡張機能は、アプリをテーマに統合するために必要な労力を軽減します。アプリがインストールされる可能性のあるさまざまなテーマの統合ロジックとインストール手順を作成する必要はありません。代わりに、アプリがインストールされているすべてのテーマに対して 1 回ビルドできます。アプリを更新する場合も、テーマ固有のサポートを構築する必要はありません。

テーマアプリの拡張機能は、テーマエディターでアプリを自動的に公開するため、アプリで複製することなく、エディターの視覚的な編集機能を活用できます。

アプリブロックを使用するタイミング

現在のテーマ統合方法に次の種類のアクションが含まれている場合は、アプリブロックを使用するようにアプリを更新します。

Asset REST Admin API リソースを使用して、公開されたテーマのスニペットディレクトリにコンテンツを追加し、Liquid レイアウト、テンプレート、またはセクションファイルを変更してコンテンツをレンダリングします。
ScriptTag REST Admin APIまたはGraphQL Admin APIリソースを使用して JavaScript をテーマに挿入し、テーマに HTML を挿入します。

アプリブロックに関するその他のユースケースと情報については、theme app extensions frameworkを参照してください。

アプリ埋め込みブロックを使用する場合

現在のテーマ統合方法に次の種類のアクションが含まれている場合は、アプリの埋め込みブロックを使用するようにアプリを更新します。

ScriptTagリソースを使用して、一部またはすべてのストアフロントページに読み込まれる JavaScript を追加します。
Assetリソースを使用して、スクリプトをテーマに追加し、<script>タグをテーマに追加します。
Assetリソースを使用して、theme.liquidのドキュメントの先頭に Liquid を追加します。

アプリの埋め込みブロックに関するその他のユースケースと情報については、theme app extensions frameworkを参照してください。

アプリを更新する

アプリブロックを使用する場合は、アプリを使用するオンラインストアがアプリブロックをサポートするテーマを公開しているかどうかを確認してください。
!

アプリブロックをサポートしない公開されたテーマを持つストアは、従来のオンボーディングフローを使用する必要があります。
公開されたテーマがアプリブロックをサポートしている場合、アプリはAssetおよびScriptTagリソースに対して行われたすべての POST リクエストをスキップする必要があります。
テーマアプリ拡張機能の作成方法を学ぶには、テーマアプリ拡張機能入門チュートリアルを完了してください。

Shopify アプリのご紹介

Discussion

ログインするとコメントできます