楽天ショップデザインにて使えるサイドバーのみのテンプレートを用意しました。

内容はHTML+CSSとなっていて、コピー＆ペーストで使用できるようになっています。
各位リンク先や画像のURLを張り替えて仕上げます。

商品をダウンロード購入し、sidebar.zipを開くと以下のファイルが展開されます。



HTMLファイルを開きコードをコピーします

おまけに、

・飛び出すサイドバナー
・固定サイドエリア
・上部固定ヘッダーナビ

も同梱されています。（ファイル名:side5）

■side01.htmlの無料版サンプルをご用意しています　購入前にお試しください
楽天サイドバー　テンプレート無料サンプル

PSDデータも同梱されていて、オリジナルの写真を入れ替えて書き出せばサイズの合った画像を作ることができます。
※PSDデータを編集するにはPhoto shopが必要です。

作るとややこしいサイドバーですがテンプレートを使い管理しやすく、視認性の良い物に仕上げましょう。

楽天デザインslide1.html 基本的なサイドバー

楽天デザインside2 枠で強調されたサイドバー

各エリアで色を変えるのもありです。

楽天デザインside3 画像を使ったサイドバー

画像を使うと視認性が良くなります。

楽天デザインside4　2列仕様のサイドバー

2列にすると楽天特有のごちゃごちゃした感じが増します。
カラーで選べるボタンもつけておきました。
カラーで検索しURLをひとつづつ張り替えて使用します

楽天デザインside5　固定型ナビゲーション（おまけ）

よく見るようになったサイド固定のデータもつけておきました。
またサイドではないですが上部に固定できるナビも同梱しました。

使い方

楽天サイドバーテンプレート詳細動画

楽天・ヤフー＆レスポンシブデザインテンプレートセットもご用意しています！

https://www.lopweb.net/?pid=109865946