下面是 Lightbox JS v2.0 光箱特效 的展示
這是阿杰老師的弟弟家養的小狗 - 吉娃娃 - 哈利。
今年一歲啦！由於是從小養起。並且實施嚴格的家庭教育。
所以是我家從小到大，唯一養過會到廁所上大小便的有家教乖狗。只是偶然會做點小記號宣告勢力範圍。
一般使用者只需要在 header.template 中加入如下的程式碼就可以在插入預覽小圖或中圖時加上 LightBox 的效果
1.「登入管理介面」/「個人網誌設定 」/「網誌模版編輯器」
2.編輯你的個人模版裡的 header.template 這個檔案
3.在</title>後面按下鍵盤的「Enter」鍵來空行，再將底下的四段文字貼在<head>之後。
<script type="text/javascript" src="{$url->getUrl("/lightbox2/js/prototype.js")}"></script>
<script type="text/javascript" src="{$url->getUrl("/lightbox2/js/scriptaculous.js?load=effects")}"></script>
<script type="text/javascript" src="{$url->getUrl("/lightbox2/js/lightbox.js")}"></script>
<link rel="stylesheet" href="{$url->getUrl("/lightbox2/css/lightbox.css")}" type="text/css" media="screen" />
這樣就大功告成啦！
2.02版的Lightbox JS提供了群組展示的功能，只要使用圖片將之設成群組，就可以方便的看多張圖片，在看圖的時候，可以將滑鼠移到圖片的左半部或右半部，就會自動顯示上一張、下一張的提示，可點下面的圖片體驗看看。
【設定群組的方法】將連結上rel="lightbox"改成rel="lightbox[自定名稱]"，群組名稱要用中括號包起來。
範例：將三張圖片設定為「jay」的群組
<a href="圖片1.jpg" rel="lightbox[jay]">圖片 #1</a>
<a href="圖片2.jpg" rel="lightbox[jay]">圖片 #2</a>
<a href="圖片3.jpg" rel="lightbox[jay]">圖片 #3</a>