質問: 楽天pc用商品説明文 お世話になっております。下記urlの商品ページのpc用商品説明文についてお伺いします。https://item.rakuten.co.jp/●●●/314/特徴やサイズが記載してある四角枠組みと、その下の画像(ゆうメール対応商品ご注意とお知らせ)の部分が右寄りになっているので、バランス良く中央に表示されるようにしたいです。また、そのままネクストエンジンから商品ページを複製し、ヤフーショッピングとメイクショップにも反映させる予定です。3店舗共通で都合良く表示させるには、どのように修正すればよろしいでしょうか?
回答: ecマスターズの田中です。> 特徴やサイズが記載してある四角枠組みと、その下の画像(ゆうメール対応商品ご注意とお知らせ)> の部分が右寄りになっているので、バランス良く中央に表示されるようにしたいです。まずは、商品ページの構造をご理解いただく必要がございます。基本的に楽天市場のページは、大本のタグが中央揃えで表示されている状態となっております。上から見ていくと、ヘッダーは大本のタグの横幅全体を使って中央揃えで表示されており、その下より、レフトナビと、商品関連の情報(pc用販売説明文など)の2つに別れます。さらに、右側の情報の中で、商品画像とそれ以外(キャッチコピー、商品名、商品番号、販売価格など)に分かれております。つまり、pc用商品説明文の左側には、レフトナビと商品画像の分、余白ができている状態となっております。これを中央揃えに見せるには、対策をご検討いただく必要がございます。たとえば、・レフトナビ・商品画像を、pc用商品説明文の左側に表示されるまで長くする・必要に応じて「レフトナビゲーション」の内容を空にする・商品関連の情報を表示するためのテンプレートを変更する https://navi-manual.faq.rakuten.net/item/000009619といった方法で、pc用商品説明文(+左側のコンテンツ)が中央揃えで表示されるように見せる、という形になります。> また、そのままネクストエンジンから商品ページを複製し、ヤフーショッピングとメイクショップにも反映させる予定です。> 3店舗共通で都合良く表示させるには、どのように修正すればよろしいでしょうか?各モールは、ページ全体の構造が大きく異なっており、予め表示の崩れる部分を予測することが難しいため、どうしても、実際に反映させながら、表示が崩れた箇所を確認および修正、を繰り返していただく(過程で法則を見つけていただく)必要がございます。