プライマリドメインを.myshopify.com以外のドメインにし
.myshopify.comからリダイレクトをかけて表示をしているのですが、
ページ内で「戻る」を選ぶと画面が真っ白になります。
上記現象が出ているのが
chrome
safari
firefox
でして、edgeは問題がないです。
同じような現象が出た方、また回避されたいらっしゃいましたら解決策を
ご教示いただきたいです。
Topic summary
- 事象: プライマリドメインを独自ドメインに設定し、.myshopify.comからリダイレクト後、ブラウザの戻る操作で画面が真っ白に。Chrome/Safari/Firefoxで発生し、Edgeでは再現せず。
- 切り分け: ドメイン設定自体が原因の可能性は低い。ページ全体のフェードイン（表示制御）用JavaScriptが動かず、要素を非表示のままにしている挙動が確認された。
- 再現条件: 開発者ツールでキャッシュ無効化時は再現しない。コンソールにはJSエラーが2件表示。
- 想定要因: 1) Slick（カルーセル用ライブラリ）のCSSをlinkではなくscriptタグで読み込んでいる誤り。2) equalHeights（要素高さ揃え用jQueryプラグイン）関連のエラー。
- テーマ/カスタマイズ: PrestigeのデモにはSlick/equalHeightsが見当たらず、外部サイトからのコピーに伴う独自カスタマイズが原因の可能性。該当箇所の見直しやテーマ開発者・エキスパートへの相談が推奨。
- 対応状況: 投稿者は指摘内容を制作元へフィードバックし、別会社への改修相談も検討。解決報告予定。現時点で未解決。
少し興味があっておそらく該当のストアと思われるページを拝見しましたが、「戻る」というのはブラウザバックのことでしょうか？
その場合以下のような状態になっているようなので、ドメインが原因となる可能性はかなり低いと思います。
- ページ全体がふわっと表示される機能(JavaScript)が動かず、全体を隠した状態のままになっている
有料テーマのため原因などの詳細不明ですが以下は気になりました。
- 開発者ツールを開いてキャッシュを無効にしていると再現されない
- 開発者ツールのコンソールにJSのエラーが2つ出ている
1つ目に関しましては、SlickのCSSがlinkタグではなくscriptタグで呼び出されているのが原因の模様です。
2つ目に関しましては、equalHeightsという名称からおそらくEqualHeights jQuery Pluginあたりが原因かなと思います。
Prestigerのデモストア( https://themes.shopify.com/themes/prestige/styles/allure/preview )で少し確認したところSlickもequalHeightsも確認できずでしたので、もしも独自でカスタマイズされたのでしたら各部の見直しをされた方が良いように思います。
以上ですが、推測ばかりなので間違っていましたら申し訳ありません。
特に何も手を加えていない場合は、テーマ製作者に問い合わせることをお勧めします。
または、このまま待たれるか、エキスパートやパートナーに相談されることをお勧めします。
1 Like
ご丁寧な、ご回答ありがとうございます。
「戻る」はブラウザバックでございます。
もともと外部に製作をお願いしていたようなのですが、その時の指示が本国のサイトをまるまるコピーすること、という指定だったらしく。どちらのテーマを使っているのかすら定かじゃない状態になっておりまして。
製作者に問い合わせたところ、こちらで検証しろという回答がきてしまい路頭に迷っておりました。
一度いただいたご意見を製作者にフィードバックしてみます。
立ち上げ時のメンバーが誰一人、現在関わっていないので、困りました。
他のサイトでお世話になっている別の会社の方にも一度改修できるか相談しみます。
解決しましたら、改めてご連絡とその時ベストソリューションの承認をさせていただきます。