highslide JS是一種近來很流行的光箱效果，跟很多同類的例如lightbox, thickbox, fancybox不同，它有很酷的展視效果，還可以根據你的BLOG/網頁來創造單張或相簿形式的展示效果，更可以自行修定CSS以襯托網站呢。詳細效果請進官網的中間部份瞧瞧。

今回介紹的並非只是下載檔案然後上傳再在圖片中加上代碼般這樣簡單，而是懶人方法！甚麼叫懶人方法呢？當然是給懶惰的你們(被狠狠頭槌)喔，不開玩笑了，其實只是官方網頁的其中一個功能: Highslide Editor。這個網頁能幫助你輕鬆設定各項功能，不須動到任何代碼呢！

進入網頁後，首先會看到這樣的畫面。

這個編輯器有著各式各樣的功能，隨便點點選項區上的標籤？不管是單張、相簿樣式或是網頁樣式的效果也可以集大成在一起喔！

設定

首先，我們先由語系開始教大家怎樣設定心中想要的highslide JS吧~
進入General，看到Language，當然就是要把它撥成"Chinese traditional"了。
之後的Load examaple就是指你想要那一款外型的highslide了~為了方便教學，我沿用了預設的Gallery: Basic white

然後就要去Gallery設定嚕，可能有的人並不想要相簿樣式顯示圖片，沒問題！只要把General上的Enable gallery的方格的勾給刪除就可以了。然後可以忽略了相簿樣式，繼續去設定其他項目。想看怎樣設定相簿樣式的請看下圖：

說出來的話肯定比較沉悶，先讓各位自行按按看喔，結果會同步顯示於預覽區。
(接下來的"HTML"也是同樣操作，只看你想要怎麼樣的功能而已……←因為懶寫而被遠方高遠飛來的菜刀砍頭了

在Style部份，如果沒把在之前的gallery中的thumbnail設定開啟，第一行的"thumbnail"將不會有任何反應喔。
loading label是圖片載入時的顯示字句、popup styles是圖片說明的底色、dimming就是遮罩效果啦~

之後的Behavior就是設定圖片應該以怎樣的形式秀出來，animation一欄就讓你選擇喜歡的顯示方法。我比較喜歡把Hide thumbnail on expand (not gallery)的勾去掉，這樣顯示出來的圖片比較有fancyzoom的效果。

最後一提：版權字句可以刪除，只要把Overlays最底的show credits的勾剔除便可。

嵌入方法

一切都已經完成了嗎？下一步就應該下載整個檔案連demo包帶回家了，在預覽欄看見樓上一列標籤－－最右邊的"Publish"！猛擊按鈕然後載下來吧 ～

載好以後就來離線觀看效果吧。

當一切滿意，就來上傳檔案嚕！先在highslide-custom-example.htm右鍵看源碼，應該是在第8行開始，會看到以下(也許會有不同)代碼:

把以上有關檔案找出然後上傳FTP吧，應該不太難吧(歪頭想
順帶一提：

• graphics這個資料夾是highslide JS的圖檔，必須上傳。
• highslide-with-gallery.js / highslide-with-gallery.packed.js ，前者是未壓縮，後者已加密壓縮，上傳哪一個都沒所謂，如果傳了pack.js的話請緊記要修改highslide/highslide-with-gallery.js為highslide/highslide-with-gallery.packed.js
• highslide.config.js中第4行需要使用者鍵入"graphics"資料夾的絕對路徑，這樣系統才會去讀取所需要的圖片素材。

上傳好以後在WP後台修改主題部份，進入header.php編輯。
在</head>之前加上剛才框框內的代碼，

(<?php bloginfo('template_url'); ?>這個函數是指向你正在使用的佈景。)

快完成了~! 在文章加上圖片時注意格式：

加到文章後，預覽一下是不是OK了?