【楽天】スマホ　ヘッダーのカスタマイズについて

Question

お世話になります。

添付した画像の赤枠部分を、実装してみたいのですが
手順等、教えていただければと思いご質問させていただきました。

お手数ですが、どうぞよろしくお願いいたします。###HR######IMG035623717f04e14022b7e44eedd29ca3d.jpegIMG0###

Answer

ECマスターズの田中です。

オーガランドさんは、
https://www.rakuten.ne.jp/gold/oga/item_page/header/SP_All.html
このようなページを作成し、ヘッダーとして埋め込んでおります。

OT1203さんのショップでも同様に、
ヘッダーとして埋め込むページをご用意の上、
下記のような設置用のタグを、
スマートフォン用の商品ページ共通説明文に挿入していただくことで
実現することができます。

= この下の行から ====================
jQuery(function($){ $('#itemImageSlider').before($('.iframeBefore')); });


= この上の行まで ====================
※インラインフレーム用ページのURL・高さは、
　実際のURL・半角数字に置き換えてご利用ください。
※高さの値は、iframeの内容に応じてご設定いただくか、
　jQueryプラグイン「iframeResizer」を導入して自動設定をお願いします。
　https://forum.ec-masters.net/post_view.php?id=7206

HTMLを作る上で実現できない部分がある、など、
不明な点がございましたらお知らせください。

Answer

お世話になっております。
ご回答頂きましてありがとうございます！

一度チャレンジしてみますね。

また別件になりますが、こちらも
オーガランドさんを参考にさせて頂いたのですが
添付しました画像の赤枠部分を、挿入したい場合
手順を教えて頂ければと思います。

リピーター様向けに、複数買いセットを用意して
転換率を上げたいなと思いまして、添付のような
方法ができたらと思っています。

お手数ですが、どうぞよろしくお願いいたします。###HR######IMG07a71a51e63c646725f45b9fa51144122.jpegIMG0######BR###

Answer

ECマスターズの田中です。

> 添付しました画像の赤枠部分を、挿入したい場合
> 手順を教えて頂ければと思います。

前回は商品画像上に設置していたところを、
別途、商品画像下にも設置されたい、ということですね。

その場合は、私から申し上げたソースの
before を after にご変更いただければ結構です。
実際のソースにすると、下記のようになります。

= この下の行から ====================
jQuery(function($){ $('#itemImageSlider').after($('.iframeAfter')); });


= この上の行まで ====================

なお、インラインフレームにすると
高さの調整が必要になり、
内容の変更やスマホごとの横幅にご対応いただく必要がございますが、

商品ページ共通説明文に、通常通りバナーをご設置いただいた上で、
下記のように、HTMLタグで囲むことによって
そのまま商品画像下（上も同様）に移動させることができますので、
ぜひお試しください。

= この下の行から ====================
jQuery(function($){ $('#itemImageSlider').after($('.divImgAfter')); });

バナー設置用のタグ

= この上の行まで ====================

【楽天】スマホ ヘッダーのカスタマイズについて

【楽天】スマホ　ヘッダーのカスタマイズについて