ＰＣレイアウト崩れの修正方法をお教えください。

Question

表題の様にＰＣレイアウトにおいて、商品ページ・カテゴリーページ表示の際にレフトナビ及び商品説明文などが左にずれてしまう現象が長らく続き困っております。

この現象を修正する方法がありますでしょうか？
すみません、お教え頂けますと助かります。

Accepted Answer

ECマスターズの田中です。

実際の商品ページを確認したところ、
ほとんどが、コンテンツの横幅が長すぎることが原因でした。

楽天の商品ページやカテゴリページは、テンプレートAの場合、
左にレフトナビ、右にそのページ用の内容を表示する仕組みとなっておりますが、
右側のページ内容に入っている要素のいずれかが、本来のページ内容用の横幅よりも長かったため、
ページ全体の横幅が延び、
結果として左寄せ表示しているヘッダー部分が左にずれているように見えてしまいます。

現在、横幅が長くなっている一番の原因が目玉商品の欄ですので、
RMSトップメニュー ＞ 1-2 デザイン設定 ＞ 1 PC デザイン設定 ＞ 目玉商品
より、画像の幅や横に並べる商品数、
RMSトップメニュー ＞ 1-2 デザイン設定 ＞ 1 PC デザイン設定 ＞ 固定文言・フォントカスタマイズ
より、価格表示部分のフォントサイズの変更をお試しください。

目玉商品の横幅を短くしてもまだ左寄りになる場合ですが、
たとえば商品ページの項目選択肢別在庫の部分や商品説明のテーブル、
カテゴリページの商品一覧など、
目玉商品の次に横幅を広げている要因を探し、
十分短くなるように調整を繰り返していただきますようお願いします。

Answer

とりあえず目玉商品を調整し、ある程度の修正ができました。
考え方を理解致しましたので、今後商品説明文や項目選択肢別を確認していきます。

ありがとうございました。