RMS　スマホ用商品ページ設定について

Question

楽天RMSの「商品ページ設定（スマートフォン）」についてです。
画像のボタンを横に5つ並べたいのですが、商品ページは縦に並んでしまいます。
画像を改行なしで横並びに、各画像は幅20％のサイズ指定、全部で横幅100％になるようにしています。
カテゴリページ設定にも同様のタグを入れているのですが、こちらは正常に横に並びます。

残りの制限文字数が少ないため、テーブルに入れるなどしてタグを増やしたくないのですが、
原因と対策が分かればと思い質問させていただきました。

どうぞよろしくお願いいたします。

Answer

ECマスターズの田中です。

楽天のスマートフォン用商品ページで使われている外部スタイルシートにて、
下記の規則が記載されていることが原因です。

#shopCommonText img {
display: block !important;
max-width: 100% !important;
margin: 0 auto !important;
}

上記のdisplay属性が原因で、スマートフォン用商品ページにおいて、
共通説明文に含まれる画像は全て
ブロック要素となり、要素１つで１行を占めるようになります。

スタイルシートによる指定を無効にするには、
元々の規則より詳細な規則を設定する必要があります。

また、どうしてもスタイルシートが必要となるため、
楽天RMSの、禁止タグを入力できるバグを利用する必要があります。
そのため、今後、RMSの改修により、使用できなくなる可能性がありますので
ご承知おきください。

最初に、楽天GOLD内に、
下記の内容で外部スタイルシートファイル(■)をご用意ください。

===== この下の行から ================
body #shopCommonText img { display: inline-block !important; }
===== この上の行まで ================

ご用意ができましたら、
スマートフォン用の共通説明文に、下記内容を追記していただくことで
商品ページでも、画像を一行にまとめることができます。

===== この下の行から ================

===== この上の行まで ================
※(■)のURLは、実際の内容に置き換えてご利用ください。

Answer

ご丁寧にありがとうございます。
原因が分かりました。
なぜ商品ページだけそのような仕様なのかと疑問を持ちましたが、
取り急ぎ提案していただいた方法で回避しようと思います。
ありがとうございました。

RMS スマホ用商品ページ設定について

RMS　スマホ用商品ページ設定について