阿駕零零壹 © 學習筆記

最近看到一個很棒的東西 - SimpleViewer。他提供樣板，讓你快速的建立起漂亮的 Flash 相簿。

首先看看範例吧：SimpleViewer Demo 1、SimpleViewer Demo 2。

有興趣了嗎？往下看看吧^^ 

有兩個方法，可以產生這種相簿。

首先是正常的方法，先下載 這個 範例，然後照著裡面的說明去依樣畫葫蘆。不過，看到這邊你就不會想學了吧，太麻煩，這也是我為甚麼看到很久後都沒去碰他的原因，哈。太麻煩了，沒有實用的價值。不過這樣的話，我還介紹幹嘛，哈，往下看看^^

第二個方法，這才是說正格的。他們提供了很多方便的模板，給一些常見的處理軟體使用，例如：Picasa (Windows)、Porta (Windows)、iPhoto (Macintosh)、SimpleViewerExport (Linux)。

下面就來教學一下 Picasa 的使用方法吧。

1. 首先，到 Picasa 的網站，下載安裝起來，這是一套很好用的相片管理軟體，如果沒有使用可以用用看。

2. 安裝後，下載這個 SimpleViewer Picasa Template。將他解壓縮放到 「C:Program FilesPicasa2webtemplates」的路徑下。

3. 不過根據我的使用，原本的模板對中文支援有問題。所以到剛剛的模板路徑下，編輯「indexTemplate.html」這個檔案，將第四行最後面改成「charset=utf-8"」，這樣就不會有問題了。

這樣就完成安裝的作業了。

4. 接下來，打開 Picasa，點一下你想要製作成網頁的資料夾，右鍵選單。最下方有個「製作網頁」，照著步驟選擇你要的尺寸、資料夾名稱、Title 名稱。下一步會進到模板的選擇頁面，請選擇「SimpleViewer」，匯出，就完成了。

5. 接著可以自己修改一下頁面的參數，編輯匯出資料夾的「imageData.xml」檔案。官方提供的資料如下：

maxImageDimension: largest height or width of your largest image (in pixels). Images will not be scaled up above this size, to ensure best image quality.

textColor: Color of title and caption text (hexidecimal color value).

frameColor: Color of image frame, viewed icon, load bars, thumbnail arrows (hexidecimal color value).

bgColor: Color of background.

frameWidth: Width of image frame in pixels.

stagePadding: Distance between image and thumbnails in pixels.

thumbnailRows: number of rows of thumbnails.

thumbnailColumns: number of columns of thumbnails.

navPosition: Position of thumbnails relative to image. Can be "top", "bottom","left" or "right".

navDirection: Direction of navigation. Can be "LTR" (Left to Right) or "RTL" (Right to Left)

title: title of the Image Gallery.

imagePath and thumbPath: Ignore unless you are customizing the SimpleViewer file structure.

6. 接著，只要上傳就可以了。

很快吧，輕輕鬆鬆就完成了。 

隨機文章：
» Gallery 2.2 RC1
» 在 Blog 內秀你的 Flickr 相片
» Layeredtech 的優惠 - 天天都有新花樣？
» Flickr 與 Zooomr
» [試用] 讓感動不只在電腦前的「好感動。相簿」