ポップアップバナーの2度目以降のリサイズ

Question

ECマスターズの会員サイトへアクセスした時に出てくる
ポップアップバナーですが、２度目以降は右下に小さく表示されます。

これ良いなぁ〜、真似したいな〜と思ったのですが、
この設定方法をぜひ教えてください！

宜しくお願い致します！

Accepted Answer

ECマスターズの田中です。

ご質問いただいたリサイズですが、
特に同じバナーをリサイズする処理は行っておりませんので、
おそらく

・１回だけ、画面全体に大きく表示されるポップアップバナー（モーダルウィンドウ）
・画面右下端に表示される固定バナー

上記２つが、それぞれ表示されている様子を
ご覧いただいているものと思われます。

楽天市場にて設置される方法ですが、
ポップアップバナーは下記デザインレシピを、
https://club.ec-masters.net/index.php?design_popup_bunner
固定バナーはバナー設置君を、
https://manual.ec-masters.net/index.php?ecm-tools-manual-banarsetti
それぞれ利用してご設置いただくことができます。

実際に設置される場合は、各ツールの注意事項をお含みおきの上、
お客様の利便性を欠くことのないようにご設置いただきますよう
お願いいたします。

Answer

田中さま

回答ありがとうございます。

ポップアップバナーとバナー設置君の合わせ技だったのですね！

中央に表示される大きなバナーと、その後の右下の小さなバナーが、同じ画像だったので、一つのスクリプトで実現しているのかと勘違いしてました。

常時表示のポップアップだとしつこいし、一度きりだと印象薄いし、どうしようかと悩んでました。

ありがとうございます！

あと欲張りなお願いです。
もう少しスクリプトの文字数が少なくなると嬉しいです。

特にスマホで埋め込む時に、文字数オーバーで、何を消そうか悩ましいです(^_^;)

Answer

ECマスターズの田中です。

> もう少しスクリプトの文字数が少なくなると嬉しいです。

スクリプト自体の削除は難しいのですが、
RMS上での文字数制限が問題ということでしたら、
外部ファイルの利用をお試しいただけますでしょうか。

タグの中に記入するJavaScript、
およびタグの中に記入するスタイルシートは
楽天GOLDの中に外部ファイルとして保存し、読み込ませることで、
RMS上に記載する文字数を削減することができます。
https://techacademy.jp/magazine/6124

スマートフォン用項目では各タグは
本来利用が禁止されているタグとなりますので、

JavaScriptの外部ファイルを読み込む際は

スタイルシートの外部ファイルを読み込む際は


上記の形式で、説明文にご記載いただきますようお願いします。

作業の際、変更前の説明文の内容をメモ帳に保存するなど、
万が一の際にいつでも元に戻せるよう、
バックアップを取りながら作業を進めていただきますようお願いします。
実際の作業の上で、不明な点がございましたら
返信にてお知らせ願います。

Answer

外部ファイル！その手がありましたね。試してみます。ありがとうございます‼︎

Answer

関連質問なので、こちらに失礼します。

田中さんがおっしゃっている下記の

・１回だけ、画面全体に大きく表示されるポップアップバナー（モーダルウィンドウ）

→現在、うちでもポップアップバナーを出していますが、１回目だけ画面全体に大きく表示され
回遊される時には、いちいち出てこないような仕組みにしたいのですが
無理でしょうか？

他フォーラムの投稿で、テンプレートを使い分けるというのも拝見していますが
PC商品説明文の中に、htmlで テンプレートをAとB二つ入力する、ということなのでしょうか。

よろしくお願いします。

Answer

ECマスターズの田中です。

ミントさんのショップを確認したところ、
ポップアップバナーが出ている様子が見当たらなかったため
正確なご案内ができないのですが、

商品ページなどで、
CSSのみを利用して表示している場合は無理となっており、
楽天GOLDで作成した特設ページなどで、
JavaScriptを利用した仕組みで表示している場合は
改変することで可能な場合がございます。

Answer

ご返信ありがとうございます。

ポップアップバナー出てないですか？

↓下記、あまりよくわからないですが
商品ページは基本compassを使って作成しています。


商品ページなどで、
CSSのみを利用して表示している場合は無理となっており、
楽天GOLDで作成した特設ページなどで、
JavaScriptを利用した仕組みで表示している場合は
改変することで可能な場合がございます。


私から見たら、毎回回遊するたびにポップアップ出ていますが
お客様から見たら出ていないということでしょうか。

何人かに確認とりましたが、ポップアップ見えるそうですが…

Answer

ECマスターズの田中です。

失礼しました、
元質問の会員様のショップをチェックしてしまっておりました。
改めてミントさんのショップにて、
ポップアップバナーが出ていることを確認いたしました。

残念ながら、こちらはヘッダー・フッター・レフトナビに設置できるよう、
CSSのみを利用して表示しているタイプとなっており、
どうしても回遊時に毎回表示されてしまいます。

Answer

ご回答ありがとうございます。

よかったです！PCではポップアップは出るようなのですが
アプリで見るとどうも出てこなそうなのですが、それは普通でしょうか？

回遊の度に出るのは、このタイプだと仕方ないのですね。

フッターに入れるタイプでなければ、毎回表示ができなくなる仕様もあるのでしょうか。

お応えいただける範囲で構いませんので、よろしくお願いします。

Answer

ECマスターズの田中です。

> アプリで見るとどうも出てこなそうなのですが、それは普通でしょうか？
はい、PCとスマホ、さらにアプリは異なる仕組みで表示されておりますので、
出てこないのが普通となっております。

> フッターに入れるタイプでなければ、毎回表示ができなくなる仕様もあるのでしょうか。
JavaScriptを利用する必要があるため、
GOLDで作成したトップページや特設ページでのみ、1回のみ表示するポップアップを導入することができます。
PC・スマホ問わず、商品ページではどうしても困難となりますことをお含みおき願います。