Conceptでは、カスタム Javascript イベント リスナーとトリガーを使用できます。
テーマをカスタマイズするとき、カスタム スクリプトを実行したり、サードパーティ アプリと統合したりした後に、いくつかのイベントに接続することが必要になる場合があります。サポートされているイベントの JavaScript パターンを提供します。
- トリガーページがロードされました
- トリガーカードを引いて更新する
- 製品が Ajax カートに追加されました
- 商品をカートに追加できませんでした
- クイックビューモーダルが開きます
- クイックビューモーダルがロードされました
- バリエーションの選択が変更されました
- コレクションページが再レンダリングされます
トリガーページがロードされました
HTML ドキュメントとすべての遅延スクリプトは完全に解析されました。
document.addEventListener('page:loaded', function() { // Page has loaded and theme assets are ready });カードを引いて更新をトリガーする
数量の変更後にカート オブジェクトを更新するには、次の JavaScript パターンを使用します。
document.addEventListener('cart:updated', function(evt) { console.log(evt.detail.cart); });製品が Ajax カートに追加されました
document.addEventListener('ajaxProduct:added', function(evt) { console.log(evt.detail.product); });商品をカートに追加できませんでした
document.addEventListener('ajaxProduct:error', function(evt) { console.log(evt.detail.errorMessage); });クイックビューモーダルが開きます
document.addEventListener('quickview:open', function(evt) { console.log(evt.detail.productUrl); });クイックビューモーダルがロードされました
document.addEventListener('quickview:loaded', function(evt) { console.log(evt.detail.productUrl); });バリエーションの選択が変更されました
document.addEventListener('variant:change', function(evt) { console.log(evt.detail.variant); });コレクションページが再レンダリングされます
document.addEventListener('collection:reloaded', function() { console.log('collection:reloaded') });