アメブロ・カスタマイズ 「スライドショーバナー」の設置

※こちらは2016/3/8以降使えるようになった新しいCSS編集用デザインにも対応しています

お店の雰囲気や商品の紹介などで効果を発揮(インパクトを与えてくれる)するスライドショー。そのスライドショーをアメブロに設置することができます。

またその画像に対して、リンクを貼ることができるので、リンク先への誘導にも最適です。

11224170_899246936835789_3694642275499572307_n
11998968_896715980422218_398175447595788238_n
12019910_898235043603645_476730299069799355_n
12039548_905241446236338_2460117700599302049_n
11287620_1613162105563950_15127841_o (2)

見え方としてはこんな感じ☆

 

>>参考事例

スライドショーバナーの設置

設置場所①:フリープラグイン

下記のコードをフリープラグインにコピペしてください

<script src="https://www.google.com/jsapi"></script>
<script>google.load('jquery', '1.6.2');</script>
<script>(_JQ162_=jQuery)(function(){$=jQuery=_JQ162_;});</script>
<script src="https://dl.dropboxusercontent.com/u/227966126/jcarousellite_1.0.1.pack.js"></script>
<script src="https://dl.dropboxusercontent.com/u/227966126/jquery.easing.1.3.js"></script>
<script>
$(function() {
$(".jCarouselLite").jCarouselLite({
btnNext: ".next",
btnPrev: ".prev",
auto: 2000,
visible : 4,
speed: 1000,
scroll: 1
});

$(".jCarouselLite2").jCarouselLite({
btnNext: ".next2",
btnPrev: ".prev2",
visible : 2,
speed: 500,
easing: "linear",
scroll: 2
});
});
</script>

こちらは基本設定のようなものです。

設置場所②:フリースペース

下記のコードをフリースペースにコピペしてください

<div class="carousel"><div style="width: 300px; margin: 0pt auto;" class="jCarouselLite"><ul><li><a href="リンク先①" target="_blank"><img src="画像URL①" /></a></li><li><a href="リンク先②" target="_blank"><img src="画像URL②" /></a></li><li><a href="リンク先③" target="_blank"><img src="画像URL③" /></a></li><li><a href="リンク先④" target="_blank"><img src="画像URL④" /></a></li><li><a href="リンク先⑤" target="_blank"><img src="画像URL⑤" /></a></li></ul></div></div>

画像URL①~⑤にそれぞれの画像のURLを入れてください。

同じく画像URL①に対してリンク先①にそのリンク先を入れてください。

画像のみ表示させたい場合はリンク先を入れる必要はありません。

その場合は<a href=“リンク先*” target=“_blank”>をそれぞれ消してください

 

以上で設定が完了となります。

まとめ

リンクを入れるところが多いので、わかりにくいとは思いますが、出来た時の感動はちょっと興奮するかもしれません(笑)

画像サイズとしてはアメブロのサイドバー(幅が広い方)が300pxとなっているので、300px以内で、全てのサイズを統一することをおすすめします。

そうしないと見栄えがあまり良くないかと思います。


20171028 大阪・梅田
「脱キラキラ 女性経営者への道」

~目指せ月商100万円~

コメントを残す

ABOUTこの記事をかいた人

伝説プロデューサー岩本あきら

起業家、サロン経営者、人気カウンセラー、セラピスト、飲食店などにブログ、SNSを使ったマーケティング、コンサルティングを行っています。WEBサイトの制作、WEBツールの活用でサポートを行っています。