縦型バナーの表示

楽天ショップなどでよく見かける縦型バナー、「送料無料」や「ポイント10倍」など目立たせたいものを右端や左端に表示させるものです。

これは背景画像の設定をスタイルシート(CSS)を使って行います。

まず、画像の準備。

画像は縦に繰り返して表示するために、上と下に切れ目のない画像が適しています。
幅や高さは、特に気にする必要はありませんが、
あまり幅が広すぎる画像は、表示したときに商品と重なってしまったりするのでおすすめではありません。
私はだいたい幅100pxくらいで作ることが多いです。

「送料無料」と「ポイント10倍」のバナーをいくつか載せておきますので
よろしければダウンロードしてお使いください。

送料無料画像5種類
「送料無料画像」5種類 >> soryo.zip

ポイント10倍5種類
「ポイント10倍画像」5種類 >> point10.zip

設置方法です。

楽天ショップの場合

まず、R-Cabinetで、バナー用の画像を登録しておきます。
画像のURLをコピーしておきましょう。

RMS > デザイン設定 > ヘッダー・フッター・レフトナビ
使用しているヘッダー・フッター・レフトナビの編集に入ります。
ヘッダーコンテンツの一番上に以下のソースを書きます。