BloggerでSlimbox2を導入しました

2011年2月6日2015年5月21日

画像をポップアップで表示させるLightbox派生系で動作が軽いSlimbox2を導入しました。
http://www.digitalia.be/software/slimbox2からSlimbox2をダウンロードします。
ダウンロードした、Slimbox2-xxx.zipを解凍し、jsフォルダ、cssフォルダ内の以下５つのファイルをインターネット上の任意のところへアップロードします。
Bloggerでは画像以外のファイルをアップロードすることはできませんので、プロバイダなどの無料ホームページサービスやレンタルサーバーなどを利用します。

slimbox2.js
closelabel.gif
loading.gif
nextlabel.gif
prevlabel.gif

同じく解凍したcssフォルダの中のslimbox2.cssの以下の部分をアップロード先のURIへ変更し、同じく任意の場所へアップロードします。

.lbLoading
#lbPrevLink:hover
#lbNextLink:hover
#lbCloseLink

Bloggerのテンプレートのheadタグ内に以下を入力します。

<link href=’アップロードのURI/slimbox2.css’ rel=’stylesheet’ type=’text/css’/>
<script src=’http://www.google.com/jsapi’ type=’text/javascript’/>
<script>google.load(‘jquery’, ‘1’);</script>

<script src=’アップロード先のURI/slimbox2.js’ type=’text/javascript’/>

を入力すると完成です。

後は、記事中に画像を挿入した際、