アクセスの少ない(記事が少ないとも言う)当ブログにおいてもっとも需要がありそうなエントリーがこちら
楽天のページで縦バナーを両側に設置して、お祭り感を演出するの巻
楽天ショップでページの左右に別々の縦バナーを設置する方法
楽天のショップを運営している人で、「縦バナー」の設置で困っている人は意外に多いようです。自分も右も左もわからない状況で店舗運営の担当者にされて、かなりの試行錯誤をした記憶があります。
試行錯誤の経験ももちろん後々生きてくるのですが、時間に追われるネットショップの店舗運営担当者のために、簡易ながらもすぐに設置できる様に改めてこの記事を用意してみました。誰かの役にたったら嬉しいです。
用意するもの
縦バナーの画像(左右それぞれに必要)
下記ソースをメモ帳などにコピペしておく
.tban {
visibility:visible; /*消したい時はhiddenに変更*/
height:2000px; /*高さを設定*/
_height:2000px;
min-height:100%;
width: 100px; /*画像の横幅に合わせる*/
z-index: -1; /*ページの背面に廻る様に*/
position: absolute; /*位置調整用です*/
display: block;
top:0px; /**/
list-style:none;
}
#t_left{
left:20px; /*左側に20pxの隙間を空けます*/
background: url(「画像のURL」) repeat-y scroll;/*左のバナー画像URL*/
}
#t_right {
right: 20px; /*右側に20pxの隙間を空けます*/
background: url(「画像のURL」) repeat-y scroll;/*右のバナー画像URL*/
right: 20px; /*右側に20pxの隙間を空けます*/
}
実際の作業の流れ
用意した画像をR-cabinet(GOLDでも可)にアップする
アップした画像のURLをメモ帳にコピーしたソースの「画像のURL」部分と置き換える
URLを置き換えたソースをページに貼り付ける(一番上など解りやすい部分でOK)
最後に
こちらの記事は初級編で、とりあえず設置出来ればOKと言う方向けに書いています。そのため、バナーのサイズや位置を調整したり、全ページに一度に反映したり、表示非表示を簡単に切り替えたり、縦バナー自体にリンクを設定したりという事は考慮していません。
上級編は近いうちに記事にしますので、少々お待ちください。また、こんな事に困っているなどコメント頂けると対応するかも知れません。
博士様
ご丁寧に教えて下さってありがとうございます。楽天市場のトップページに店舗ブログを貼りたいのですが教えて頂けますか?就職先でhp の管理から、楽天市場、Yahoo!ショップ全部しています。お時間ありましたら、御指導よろしくお願い致します。