楽天スマホサイトの下部に追従型固定メニュー設置する方法について

Question

お世話になります。

楽天市場のスマートフォン用商品ページに
買い物かごボタンなどに重ならないようにフローティングメニューを下部に設置したいのですが、簡単に設置する方法はありますでしょうか？


また、スマートフォン用商品説明文にお勧め商品画像をeasypageさんを利用しiframでスライダーを表示させたいのですが、その設置する方法も教えて頂きたいです。

他社サイトさんのものですが、イメージ画像をお送りいたします。
ご教授宜しくお願いいたします。###HR######IMG04b449e1375ab1e44cfb394a963d8bbbe.pngIMG0### ###IMG14134b7c5d42ed23bd8aa5f66223fe769.pngIMG1###

Accepted Answer

ECマスターズの田辺です。

> 楽天市場のスマートフォン用商品ページに
> 買い物かごボタンなどに重ならないようにフローティングメニューを下部に設置したいのですが、簡単に設置する方法はありますでしょうか？

フローティングバナーは
バナー設置君で簡単に作成することができるのですが、
https://manual.ec-masters.net/index.php?ecm-tools-manual-banarsetti

メニューとなりますと
記述が多くなり現実的に難しいので
以下の手順で作成をお願いいたします。

最初に、楽天GOLDにて、
バナーを表示するためのHTMLファイルを
ご用意ください。

次に、下記の内容を
メモ帳に貼り付けていただき、
ファイル名の末尾を「.css」にして
外部CSSファイルとして保存し、
楽天GOLDにアップロードしてください。

= この下の行から ====================
#spFixedBanner {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
}
= この上の行まで ====================

最後に、下記HTMLソースを
スマートフォン用共通説明文にご記載いただくことで、
画面下部にバナーを固定表示させることができます。

= この下の行から ====================


= この上の行まで ====================
※外部CSSファイルのURL、バナー表示用HTMLのURLは、実際のURLにご変更ください。

スマホ画面の限られた範囲内で
フローティング部分が広くなりますと
お客様が操作しづらくなるという懸念がございますので
過度な記述にはお気をつけくださいませ。


> スマートフォン用商品説明文にお勧め商品画像をeasypageさんを利用しiframでスライダーを表示させたいのですが、その設置する方法も教えて頂きたいです。

easypageはすでにご利用いただいているということでしょうか。

そして具体的にどのような操作で
お困りでしょうか。

easypage上で操作方法がわからない場合には
お手数ですが操作画面のスクリーンショットをいただけますと幸いです。

また、こちらのページより
https://club.ec-masters.net/index.php?ecm-ecstoolbox
ツールボックスに無料でお申し込みをいただくことで
スライドバナー作成ツールをご利用になれますので、
こちらもご検討くださいませ。

Answer

ECマスターズ 田辺さま

お世話になっております。
御礼が遅くなり申し訳ありません。
参考になるご返信ありがとうございます。

普段私が購入しているサイト『はりねずみんみん共和国さま』でフローティングメニューを見てから、見やすさや使いやすさを感じ、弊社SHOPでも同じようなメニューが作れないかを考えていたので、メッセージを参考にチャレンジしてみます！

easypageは利用中です。
スライドバナー作成ツールを利用してみます。
ありがとうございました。