【バナー管理】楽通のパーツをフローティングバナーにする方法

お知らせ, 小技タグ, 楽々通販2の使い方

【バナー管理】楽通のパーツをフローティングバナーにする方法

こんにちは!
今回は「小技タグ」の一部をご紹介いたします!

楽々通販2を普通につかうだけじゃなく、
ちょっとしたワンポイントで
もっと便利に使いこなせる内容を
目指していきます!

そもそもフローティングって何?

マウススクロールをしたときに、
一緒にスクロールせずに画面端や、画面下部でとどまり、
常に目のつく位置にPRすることができるバナーのことです。
楽々通販2のサイトでも「無料体験」「資料請求・お問合せ」のバナーが
フローティングバナーに当たりますね!

どうやって貼り付けるの?

まずは楽々通販2のバナー管理で、iframe部分をコピーしてください。
コピーした後、「メモ帳」や「EmEditor」などに貼付け、以下のように編集をします。

 

貼付けタグ

<iframe style=”width: 50px; height: 450px; position: fixed; right: 0; top: 150px; z-index: 9999;”
src=”https://www.rakuten.ne.jp/gold/ストアアカウント/rakuraku/shopbanner○○○/” width=”300″ height=”150″ frameborder=”0″ scrolling=”no”>
</iframe>

styleに書かれている部分が、場所の指定となります。

width: 50px; →バナーの横幅
height: 450px;  →バナーの縦幅
right: 0; →rightの場合は、画面右側から0距離に設定となり、画面端ぴったりに配置となります。
左端にぴったりに配置の場合は、left: 0;という表記になります。
top: 150px →こちらは上下の位置の指定となりますtopの場合は上から150pxの位置に固定となります。
下位置ぴったりの場合は、bottom: 0;という表記となります。

実際はどこに貼り付けるのか?

楽天市場の場合、「デザイン設定>フッター・ヘッダー・レフトナビ
スマホの場合は「共通説明文」などに貼り付けると、すべてのページに表示させることができます!
また、商品だけの表示は「商品説明文」や「販売説明文」をご活用くださいませ。

関連記事一覧