livedoor
アフィリエイトは儲かんないってば2008年04月22日12:43
前回の記事に、「Lightbox2を使っている」という内容のコメントをK子さまより頂きました。以前からLightboxは知っていたのですが、私は初めてLightboxを見た時、画面が暗転したものだから「うわ、なんか怪しい事をされる！」と驚いてしまって、それ以来Lightboxを敬遠していました（笑）。そのころからLightbox2（ツー）だったのかどうかは定かではありませんが。
あ、Lightboxと言うのはjavascriptのひとつで、前回使用したFancyZoomのような効果の「画像を見せる」javascriptです。
早速、Lightbox2でサンプルページを作ってみました。
ギャラリー（Lightbox2バージョン）
また導入の仕方などを解説してみます。
Scriptの配布サイトはこちら。
Lightbox 2
■ライセンス
さて、気になるのはまずはライセンスですよね。
「クリエイティブ・コモンズ」ライセンスのAttribution 2.5 Licenseです。
えっと、Attributionと言うのは「表示」という意味みたいですね。
（Javascriptのライセンスがわからない時は、そのjavascriptをテキストエディタで開いて見ると大体最初の方に書いてあります。）
「クリエイティブ・コモンズ」ライセンスには、いくつかの項目があるみたいです。
クリエイティブ・コモンズ − ウィキペディア
表示(Attribution)
その作品の利用に関しての著作者の表示を求めるか
非営利(Noncommercial)
非営利目的に限ってその作品の利用を認めるか
改変禁止（改変の禁止）(No Derivative Works)
その作品をそのままの形でのみ利用を認めるか
継承（同様に共有）(Share Alike)
その作品につけられたライセンスを継承することを求めるか
「クリエイティブ・コモンズ」ライセンスという表記とともに、これらの項目の組み合わせを書いてあるみたいです。
つまり「クリエイティブ・コモンズ」ライセンスだから使用可能だ！と判断するのではなく、その後に続く項目を見ることが大事だというわけです。
今回のLightbox2に関しては、javascript内に下記のリンクが書いてありました。
Licensed under the Creative Commons Attribution 2.5 License - http://creativecommons.org/licenses/by/2.5/
表示2.5というクリエイティブ・コモンズのようです。
アクセスしてみると、英語でした（笑）。
ですが、言語を選ぶとそれぞれの言語のページに行く事が出来ます。
http://creativecommons.org/licenses/by/2.5/deed.ja
あなたは以下の条件に従う場合に限り、自由に
* 本作品を複製、頒布、展示、実演することができます。
* 二次的著作物を作成することができます。
あなたの従うべき条件は以下の通りです。
*表示. あなたは原著作者のクレジットを表示しなければなりません。
* 再利用や頒布にあたっては、この作品の使用許諾条件を他の人々に明らかにしなければなりません。
* 著作[権]者から許可を得ると、これらの条件は適用されません。
* Nothing in this license impairs or restricts the author's moral rights.
なるほど、よくわかりました。
と思ったら、一番下の方に「このライセンスは廃止されました。新しいものはこちらです。」と書いてあります。廃止って、オイオイ（笑）。
リンク先に行ってみたら、表示 3.0 Unportedと書いてあるのですが、表示2.5一般との違いがわからない（笑）。
まあそういうわけで、とにかくクレジットを表示しておけば改変しようが、複製しようが、配布しようが、商用だろうが、オッケーですよ、ということみたいです。
ちなみに、Lightbox2を配布ページでダウンロードして解凍すると、他にもいくつかのjavascriptが含まれています。他のJavascriptを利用して動いているのです。
prototype.js ・・・ MITライセンス
scriptaculous.js ・・・ なんかよくわかりませんが、コピー、修正、配布など自由みたいです（要各自確認）。
effects.js ・・・ MITライセンス
builder.js ・・・ MITライセンス
MIT License − ウィキペディア
■設置
そういうわけで、ライセンスの確認が長くなりましたが、わりと自由に使えそうなので、設置してみました。
http://main.matrix.jp/のフォルダを「main」とします。
http://main.matrix.jp/lightbox/lightbox2.htmlにHTMLファイルを置くとします。
＜ディレクトリ構造＞
＜lightbox2.htmlの内容＞
<html>
<head>
<meta http-equiv="Imagetoolbar" content="no">
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<script src="js/prototype.js" type="text/javascript"></script>
<script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
<script src="js/lightbox.js" type="text/javascript"></script>
</head>
<body>
<a href="image1.gif" title="title1" rel="lightbox[Illust]"><img src="image1s.gif" width="125" height="100"></a>
<a href="image2.gif" title="title2" rel="lightbox[Illust]"><img src="image2s.gif" width="125" height="100"></a>
</body>
</html>
シンプルですね〜。
[Illust]の部分は、「前の画像」「次の画像」を表示するためのグループ分けと考えてもらっていいかもしれません。同じグループの画像が「前の画像」「次の画像」のアイコンで見れます。
「前の画像」「次の画像」が要らないなら、ぶっちゃけ[Illust]の部分は、フようです。
それから、imagesフォルダに入っている画像「prevlabel.gif」「nextlabel.gif」「prevlabel.gif」などを加工してアップロードすると、ちょっとしたオリジナリティが出せます。
ライセンスの説明で疲れて、設置の方の説明が激しく簡単になってしまいましたが、そのくらい設置は簡単です。
トライされてみて下さいませ〜。
この記事にコメントする
注：livedoorBlogの仕様により、コメントは400字以内となっております。
コメントが長くなりそうな場合は、
メモ帳にコピペなどされておかれることをお勧めいたします。
