ヘッダー・フッターをレスポンシブ対応に作ったが、GOLDにアップロードすると思ったように反映されない。

Question

[PCデザイン設定]→[ヘッダー・フッター・レフトナビ]→[編集]から商品ページのヘッダー・フッター を設置しました。レスポンシブ対応に作ってあります。

[ヘッダー・フッター・レフトナビ]画面で iframeの中にwidth="1000px" height="670px" を指定すると正しく表示されますが、幅がレスポンシブではなくなってしまいます。
 width="1000px" height="670px" を外してしまうと表示がおかしくなってしまいます（画像のとおり、幅が狭くなってしまう。）
商品ページのヘッダーフッター をレスポンシブ対応で正しく表示するにはどうしたら良いでしょうか？
[PCデザイン設定]→[ヘッダー・フッター・レフトナビ]→[編集]の画面では次のように指定しています。

【ヘッダー】
お使いのブラウザはiframeに対応しておりません。iframe対応のブラウザでご覧いただきますようお願いいたします。



【フッター】
お使いのブラウザはiframeに対応しておりません。iframe対応のブラウザでご覧いただきますようお願いいたします。###HR######IMG06eb9224de999e5b1eda606e0a89c3bd9.jpegIMG0### ###IMG1f6af0d6ab18c7a4fb60ee6c3063a4f14.jpegIMG1###

Accepted Answer

ECマスターズの田辺です。

iframeは中身の大きさに合わせて表示されませんので、
読み込みたいページの大きさに合わせて
横幅と縦幅を指定する必要がございます。

そのため、今設定していただいている
width="1000px" height="670px" 
は必要です。

iframeの特性につきましては
こちらで詳しくご案内しておりますのでご確認ください。
https://club.ec-masters.net/index.php?design_tags#iframe

そして、1000pxで指定しているということは、
それより小さく表示したときに…
という指示が効かなくなる、
つまりレスポンシブデザインは反映されません。

また、基本的に楽天ではRMSで
PC用とスマホ用それぞれのデザインを
設定していただく仕組みとなっており、
スマホ画面ではヘッダー・フッター・レフトナビの内容は読み込まれませんので
レスポンシブデザインにしていただかなくても結構です。

GOLDで作成したページ以外で、
レスポンシブデザインにされている
他のショップがございましたらお知らせください。