オンラインストアのテーマにPrestigeを利用している場合に発生することが考えられる不具合とその対処方法について案内します。

なお、この対処方法については、Omni Hubで一般に考えられる解決策を記載しているものとなり、本記事を参考にしたいかなる操作についても、Omni Hubでは責任を負いかねますのでご了承ください。

カートページにおいてOmni Hubが提供するポイント利用のUIが表示できない

Prestigeテーマには、ブラウザの「前のページへ戻る」を使用した際に、カートの中身が古いものになることを防ぐための機能が付いています。

しかしながら、この機能は各Shopifyアプリが提供するカートページでのUI描画を、意図せずに阻害するような仕組みで実装されています。

以下のステップで Layout/theme.liquid を編集することで、ポイント利用のUIが表示出来るようになります。

1. Layout/theme.liquid で document.documentElement.dispatchEvent と記述されている箇所を探す

   // When the page is loaded from the cache, we have to reload the cart content
   document.documentElement.dispatchEvent(new CustomEvent('cart:refresh', {
   	bubbles: true
   }));
   

2. 以下のコード片の通りに変更する

   // When the page is loaded from the cache, we have to reload the cart content
   if (window.theme.pageType !== 'cart') {
   	document.documentElement.dispatchEvent(new CustomEvent('cart:refresh', {
   		bubbles: true
   	}));
   }
   

3. ポイント管理機能の導入手順 で説明されている通りに {% render 'omnihub_cart' %} を設置する