スマホ画面の飛び出しバナー

Question

お世話になります。

https://item.rakuten.co.jp/angers2e/137260/

こちらのサイト様のように、スマホ画面で、飛び出したバナーを設置したいです。
方法はありますか？

Answer

ECマスターズの星です。

飛び出したバナーは、具体的にはどのバナーになりますでしょうか。
ご教示いただけると幸いです。
どうぞよろしくお願いいたします。

Answer

ECマスターズの田中です。

※RMSの、禁止タグを入力できるバグを利用する方法ですので、
　今後、RMSの改修により、使用できなくなる可能性があります。

「飛び出したバナー」とは、
商品画像の上にあるスライドするバナーの事でよろしいでしょうか。
その場合は、楽天GOLDを利用して設置する方法がございます。

まずは、バナーを表示するページを
楽天GOLDにてご用意ください。
ページ内に、アンジェGIFTさんでも利用されている
「Flickity」という仕組みを導入することで、
横幅全体に広がる表示をすることができます。
http://webism.jp/js-jquery/flickity/

次に、iframeタグで共通説明文に埋め込むことで設置ができます。
（利用禁止タグのため、バグを利用して埋め込む必要があります）
そのまま埋め込むと、共通説明文の表示位置、
つまりページの下方に表示されるのですが、
アンジェGIFTさんのように、商品画像の上に差し込むことも可能です。

https://club.ec-masters.net/index.php?design_page4
にてご説明差し上げている、商品ページ共通説明文への記述に含まれる
スライドバナー用HTMLファイルのURL
を、今回作成いただいたバナー用ページのURLに置き換えてご利用ください。

また、私の誤操作により「解決済」の表示にしてしまい、申し訳ありません。
「解決済」の表示でも、問題なく引き続きご返信いただけますので、
Flickityの導入がうまくできない、
楽天GOLDの使い方がわからない、
など、不明な点がございましたらご返信ください。