導入方法
設置するだけで、すぐに導入
埋め込みJS と Shopify アプリ連携に対応。既存のシステムの大きな改修なしで、設置と設定を中心にローンチできます。
埋め込みJSで導入
共通のローダースクリプトを読み込み、表示したい場所にタグを置くだけ。3つの製品はそれぞれ設置するタグが異なります。
index.html
<!-- 1. 商品データの設定 -->
<script type="application/json" id="reselfit-plugin-script-config">
{
"item": {
"id": "item-unique-id-001",
"name": "Shirt",
"images": [
{ "id": "look1", "imageUrl": "https://example.com/look1.png" }
]
},
"userId": "user-unique-id-001"
}
</script>
<!-- 2. ローダースクリプト（config を参照） -->
<script
id="reselfit-plugin-script-loader"
data-site-id="your-site-id"
data-config-tag-id="reselfit-plugin-script-config"
src="https://plugin.reselfit.com/loader/loader.js"
defer
></script>
<!-- 3. 表示位置 -->
<reselfit-plugin-placeholder></reselfit-plugin-placeholder>index.html
<!-- 1. ローダースクリプト --> <script id="reselfit-plugin-script-loader" data-site-id="your-site-id" src="https://plugin.reselfit.com/loader/loader.js" defer ></script> <!-- 2. 表示位置 --> <reselfit-plugin-staff-styling-embed></reselfit-plugin-staff-styling-embed>
index.html
<!-- ローダースクリプトのみ。配置は管理画面から指定します --> <script id="reselfit-plugin-script-loader" data-site-id="your-site-id" src="https://plugin.reselfit.com/loader/loader.js" defer ></script>
Shopify アプリで導入
アプリ連携・テーマ設定・表示の ON/OFF で、コードを書かずに導入できます。
- 1
アプリを連携
Shopify アプリから Reselfit を連携し、対象サイトを選びます。
- 2
テーマにローダーを追加
テーマ編集でローダースクリプトを有効化します。
- 3
表示を ON にする
表示したい商品ページで機能を有効化すれば公開できます。
