アプリで設定した値をストア上で表示する方法について

sen25 · ‎10-24-2022

管理者画面にてアプリを使用して値をストア上に表示する方法について質問です。

やりたいこととしてはアプリで何かしらの値を管理画面で設定した際にTheme Extensionでストア上に拡張したアプリブロックに設定した値を持ってきたいのですが、Liquidでのデータの指定方法や、どのAPIを使用すればいいのかわかりません。

やり方やドキュメントをご教授していただきたいです。

株式会社フルバランス · ‎10-25-2022

Sen25　様

はじめまして、フルバランスの道家です。

ご質問を確認いたしました。

すでにお読みになられたかもしれませんが、こちらのドキュメントが参考になりませんでしょうか。

https://shopify.dev/apps/online-store/theme-app-extensions/extensions-framework#app-blocks

また、以下は、ご参考までに私の過去やったことがある構成です。

theme-app-extension/blocks/app-block.liquid

<body>
  <div id="target"></div>
</body>


{% schema %}
{
"name":"Sample App",
"target":"section",
"javascript":"**.js", ←/theme-app-extension/assets配下のJSファイルを指定してください
"templates":[　←テーマ内のどこにアプリを設置するか
"product",
"index"
]
}
{% endschema %}

上記のように、liquidファイルを設置し、assets配下のJSでアプリから情報を取得し、id="target"をもとにDOM操作により表示しております。

なにかヒントになれば幸いです。

私たちの励みにもなりますので、

お役に立てていればBest Answerボタンを押して頂ければ嬉しいです。

分からない点があれば、またいつでもご連絡ください。

フルバランス　道家

株式会社フルバランス（Shopify Experts）
Shopify専門のEC成長支援会社です。ストアの新規構築から運用や改善のサポートなどShopifyに関する幅広いサービスを行なっております。
ECの技術・実務・成長、お悩みのことがあれば、お気軽にご相談ください。
『すべてのブランドの特大成長エンジンを搭載する』株式会社フルバランス

sen25 · ‎10-26-2022

道家様ご回答いただきありがとうございます。

基本的にはTheme app extensionsで作成したアプリブロックに管理画面で設定した値などを表示する場合にはassets配下のjsファイルにてデータ操作をするという認識であってるでしょうか？

またjsではAPIなどを使用して行うのでしょうか？

アプリ開発したばかりで追加の質問になってしまい申し訳ないのですがご教授いただければ幸いです。

アプリで設定した値をストア上で表示する方法について

アプリで設定した値をストア上で表示する方法について

コミュニティ・ブログ記事