トップページや商品詳細ページなど、画像点数が多いページでは、
ページ読み込み時のタイミングによって、一時的にスライドショーやレイアウトが崩れて表示される場合があります。
こちらはシステムやブラウザの読み込み順の影響が考えられますが、このような挙動が気になる場合、
ページ読み込み完了まで画面を一旦非表示（白表示）にし、
画像やレイアウトが整ったタイミングでページ全体を徐々に表示させる対応を、
CSSの追記によっておこなうことが可能です。
ショップデザイン / テンプレート選択・編集 / クリエイターモード / 各ページ（トップ、商品詳細などの）「CSS」欄
入力欄の末尾に下記を追記し、表示タイミングの調節をおためしください。
追記例）
/* ページ読み込み時レイアウト調節 初期設定 */
body {
opacity: 0;
visibility: hidden;
transition: opacity 1s ease-in-out;
animation: fadeIn 0.5s ease-in-out 0.5s forwards; /* 遅延表示のアニメーション */
}
/* レイアウト調節 遅延表示のアニメーション */
@keyframes fadeIn {
to {
opacity: 1;
visibility: visible;
}
}
表示までの秒数の変更は、
transition: opacity 1s ease-in-out;
animation: fadeIn 0.5s ease-in-out 0.5s forwards; /* 遅延表示のアニメーション */
こちらの数値(1sや0.5sの部分)を変更してください。
＜各数値の説明＞
transition: opacity 1s
→ 画面が表示される際のフェード（透明→表示）にかかる時間です。
画像の読み込みに時間がかかる場合は、1s を 1.5s や 2s など、やや長めに設定してください。
animation: fadeIn 0.5s
→ フェードインのアニメーション自体の長さです。
よりゆっくり表示させたい場合は、この数値を大きくします。
ease-in-out 0.5s
→ ページ読み込み後、実際に表示を開始するまでの待ち時間（遅延）です。
スライドショーや画像が多い場合は、0.8s や 1s などに変更し、
画像の読み込みが完了してから表示されるよう調節してください。
画像点数や通信環境によって最適な秒数は異なりますので、
表示が安定する値になるまで、少しずつ数値を変更しながら調節をおためしください。