【商品ページ】ページが左寄りに表示されます(商品画像や動画の表示サイズが原因)

商品画像や動画を大きく表示されていませんか?

商品ページが左寄りに表示されます場合、商品画像や動画の表示サイズが大きいことが原因となる場合がございます。

なお、商品ページが左寄りに表示される原因は、目玉商品や共通説明文の設定による影響の場合もございますため、以下よくある質問ページも併せてご確認くださいませ。

▼商品ページが左寄りに表示されます(目玉商品や共通説明文の設定あり)
https://lab.biiino.com/faq/item-page-displayed-to-left/

問題の現象

下の商品ページのようにレフトナビやフッターがヘッダーの横幅より左側へ表示されることがあります。

原因について

商品画像や動画の横幅による影響(楽天市場の仕様)

まず、楽天市場の仕様により、商品ページのメインエリア(中央の商品説明や商品名等があるエリアです)の横幅が広くなりますと、レフトナビやフッターが左寄りに表示されるといったことが判明しております。

そのため、店舗様にてRMSでご設定されている、商品画像や動画の表示サイズ(横幅)が大きい場合、には商品ページが左寄りに表示される場合がございます。

商品画像や動画の表示サイズは 横幅400px 程度がおすすめです!

詳細はこちらのよくあるご質問をご確認ください。
👉 商品画像の推奨サイズはありますか?(楽天市場)

解消方法

商品画像や動画の表示サイズを変更する

商品画像の表示サイズ変更方法

1. 「店舗設定」をクリック

「店舗設定」をクリック

2. 「4 デザイン設定」をクリック

「4 デザイン設定」をクリック

3. 「商品画像サイズの設定」をクリック

「商品画像サイズの設定」をクリック

4. 「サイズを設定する方向」で「幅」を選択

「サイズを設定する方向」で「幅」を選択

5. 「サイズ」へ「400」と入力

ビーノでは全体のバランスから400px程度での表示を推奨しています。

それ以上のサイズとなりますと、楽天市場の商品ページ仕様上、左寄りに表示されますためご注意くださいませ。

「サイズ」へ「400」と入力

6. 「変更する」をクリックして完了

「変更する」をクリックして完了

Click on 	…

動画の表示サイズ変更方法

まず、商品ページでの動画はRMSにてご設定いただいているものとなります。

また、RMSでの動画ご設定時は、R-Cabinet(画像・動画管理)よりHTMLソースをコピーして貼り付けられているかと存じますため、HTMLソース自体を変更していただく必要がございます。

1. 「店舗設定」をクリック

「店舗設定」をクリック

2. 「1 商品管理」をクリック

「1 商品管理」をクリック

3. 「商品一覧・登録」をクリック

「商品一覧・登録」をクリック

4. 「編集」をクリック

「編集」をクリック

5. 動画(HTMLソース)の「R-Cabinetを開く」をクリック

動画(HTMLソース)の「R-Cabinetを開く」をクリック

6. 「ユーザーフォルダ」を開く

「ユーザーフォルダ」を開く

7. 動画の保存先フォルダをクリックする

動画の保存先フォルダをクリックする

8. 対象の動画を選ぶ

対象の動画を選ぶ

9. サイズは「S:320×240」を選ぶ

MサイズやLサイズは横幅が400pxを超えるため、左寄りに表示される可能性がございます。

サイズは「S:320x240」を選ぶ

10. HTMLソースをコピーする

HTMLソースをコピーする

11. 「動画(HTMLソース)」欄へ貼り付ける

「動画(HTMLソース)」欄へ貼り付ける

12. 「更新」をクリックして完了

「更新」をクリックして完了

Click on     …

 

上記手順にてご対応いただきますことで商品ページの左寄りが解消されるかと存じますため、お試しいただけますと幸いです。

 

関連FAQ

 

関連キーワード
商品ページがずれている 商品ページが崩れている

この記事について評価をお願いいたします
  • 役に立った (0)
  • わかりにくい (0)
  • 必要な情報がなかった (0)
  • 探しにくかった (0)

関連しそうなFAQなど

ビーノとSUMAOU!の違い 次の開発予定 動画で学ぶビーノ 導入事例