正妹報時（美人時計）彙整＋大尺寸圖片 hack

Blog 剛開張時，曾在側邊欄安裝過「美人時計」這樣的小工具。也許是 PC 配備太老舊（到現在仍死守 P4、AGP卡、XP系統），覺得這很吃資源拖慢網頁速度，沒多久就從側邊欄移除了。不過相信大部分使用者的配備都比 WFU 好，所以把之前網路上 google 來的資料整理一下，順便看看有沒有可以 hack 之處，有需要的安裝程式碼就請自取囉！

「正妹報時（美人時計）彙整」系列標題：
一、安裝說明＋大尺寸圖片 hack
二、小尺寸展示頁
三、大寸展示頁之一
四、大寸展示頁之二

➢➢ 快速選單： １ ２ ３ ４

　

一、小尺寸版本

1. 安裝程式碼

一般提供給部落格、網頁使用的美人時計版本多半是 240 x 320 大小，這樣的尺寸放在側邊欄還滿合適的。以「小尺寸展示頁」為例，按下按鈕後會顯示安裝這個小工具的安裝碼。

如果想在部落格或網站安裝這樣的美人時計小工具，得先確定部落格或網頁是否支援 javascript，若是可以的話，請將程式碼貼在部落格或網頁想要出現的位置。以「痞客邦」為例，可參考「重灌狂人」的這個網頁。

以 Blogger 為例，安裝步驟為：進入後台 → 設計 → 網頁元素 → 新增小工具 → 選擇安裝 「HTML/JavaScript」→ 填上標題、將以上的安裝碼貼到內容 → 儲存

如此側邊欄就會出現這個小工具了。



2. Google Gadget 程式碼

有沒有發現以上大部分都是「Google Gadget」(Google 小工具)所提供的？開發美人時計的元老網站 「bijint-tokei」與 Google Gadget 合作了許多版本的美人時計，只要到 Google 小工具的首頁，輸入 "bijint"，就可以搜尋到所有 bijint-tokei 開發的「小尺寸美人時計」。

也由於是 Google Gadget 贊助的關係，我們可以發現每個版本的程式碼都非常一致，這樣給了我們可以利用 javascript 來處理的空間。例如「東京版」的程式碼為：

<script src="http://www.gmodules.com/ig/ifr?url=http://www.bijint.com/gadget/tokyo/gadget.xml&synd=open&w=240&h=320&title=%E7%BE%8E%E4%BA%BA%E6%99%82%E8%A8%88+%E6%9D%B1%E4%BA%AC%E7%89%88(bijin-tokei+ver.tokyo)&lang=all&country=ALL&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script>
A. 紅色的部分會顯示標題，這部分可以自訂，將 unicode 字元用 escape 函數處理後替換即可。

B. 藍色部分 "tokyo" 代表「東京版」存放路徑的關鍵字串。

如果我們將各個版本字串放在一個陣列，例如 var AAA = new Array("東京","香港","韓國".....)；接著將各個路徑字串放在一個陣列，例如 var BBB = new Array("tokyo","hk","korea".....)；最後用 for 迴圈就可以一次顯示出所有的版本，例如：

1. <script>
2. var AAA = new Array("東京","香港","韓國")
3. var BBB = new Array("tokyo","hk","korea")
4.  
5. for (i=0; i&lt;AAA.length; i++){
6.  
7. var title=new Array(AAA.length)
8.  
9. title[i]=escape(AAA[i])
10.  
11. document.write("<script src=\"http://www.gmodules.com/ig/ifr?url=http://www.bijint.com/gadget/" + BBB[i] + "/gadget.xml\&synd=open\&w=240\&h=320\&title=" + title[i] + "+(bijin-tokei)\&lang=all\&country=all\&border=%23ffffff%7c3px%2c1px+solid+%23999999\&output=js\"></scri" + "pt>");
12.  
13. document.write("<p/>")
14. }
15. </script>

B：請填入所有要顯示的版本字串。

C：請填入所有的路徑字串，順序必須與 B 行相同。

I：將標題用 escape 處理，才能顯示中文

K：最後面將 "</script>" 拆成兩個字串，以免有些瀏覽器無法執行。

當然，以上只是簡易的 javascript 概念，如果想要安排版面的話，就得自行修改一下程式碼比較美觀。


3. UNIQLOCK

這是今年引進台灣造成熱潮的日本平價服飾品牌 UNIQULO 所開發的美人時計，安裝方法在「此網頁」已經說明得很清楚，請按步驟做即可。


二、大尺寸版本

1. Google Gadget 程式碼 hack

如果覺得小尺寸不過癮，想要看大尺寸的版本，那就需要 hack 一下了。在上一節 Google Gadget 程式碼中，可看到程式碼中都會包含一個 XML 檔，下載後檢視發現以下內容：

PHOTO_DOMAIN = "http://www.bijint.com",
PHOTO_DIR = "240x320",
PHOTO_DIR_L = "590x450",
PHOTO_EXT = ".jpg",

感覺上 bijint-tokei 準備了兩套尺寸的圖片，一套 240 x 320 給 Google Gadget 用，另一套 590 x 450 給自己官網使用。於是試著把 240 x 320 的設定改成 590 x 450，果然偷天換日，顯示出來的就是大尺寸的圖了。以「東京版」為例，請按以下步驟進行修改：

A. 將 http://www.bijint.com/gadget/tokyo/gadget.xml 貼到網址列，另存新檔，建議檔名取為 "tokyo.xml"。

B. 將此檔用編輯軟體開啟，將所有字串 "240" 取代為 "590"；將 "320" 取代為 "450"；存檔。

C. 將修改後的 XML 檔放到自己的網頁空間（免費的存放空間可參考「Google Code 簡易使用教學」）。

D. 最後要安裝的大尺寸程式碼如以下：

<script src="http://www.gmodules.com/ig/ifr?url=http://你的網頁空間/tokyo.xml&synd=open&w=590&h=450&title=tokyo(bijin-tokei+ver.tokyo)&lang=all&country=ALL&border=%23ffffff%7C3px%2C1px+solid+%23999999&output=js"></script>
(1) 紅色部分改為自己的網頁空間

(2) 藍色部分可將長寬尺寸改為符合自己網頁的大小。

(3) 綠色部分可改為自己想顯示的標題，如要顯示中文需用 escape 函數處理再置換。

另外，想批次顯示大尺寸的美人時計，可參考「二、小尺寸版本」→「2. Google Gadget 程式碼」來修改。


2. bijint-tokei「台灣版」大尺寸 hack ＋ 「香港隱藏版」hack

bijint-tokei 與 Google Gadget 合作的小尺寸版本，並沒有發現「台灣版」的存在，但在「香港版」的官網卻有台灣的「大尺寸版本」，或許 bijint-tokei 的香港公司與日本母公司是個別獨立運作，所以 Google Gadget 才會漏了掛在香港公司之下運作的台灣版。

不過，把香港版的 XML 檔拿來 hack 一下後，還是可以將台灣版的大尺寸圖秀出來。請先參考上一節「1. Google Gadget 程式碼 hack」的步驟，開啟香港版的 XML 檔內容，找到以下的內容：

TIEUP_LINK = "http://www.bijint.com/",
TIEUP_RE = /^(999|999)/,
//
PHOTO_DOMAIN = "http://www.bijint.com",
PHOTO_DIR = "240x320",
PHOTO_DIR_L = "590x450",
PHOTO_EXT = ".jpg",
DEFAULT_PHOTO_PATH = "/assets/pict/hk/"

A. 改成「台灣版」需將以上置換為以下內容：

TIEUP_LINK = "http://www.bijint.com.hk/",
TIEUP_RE = /^(999|999)/,
//
PHOTO_DOMAIN = "http://www.bijint.com.hk",
PHOTO_DIR = "590x450",
PHOTO_DIR_L = "590x450",
PHOTO_EXT = ".jpg",
DEFAULT_PHOTO_PATH = "/assets/pict/tw/"

B. 香港版有另一個版本──「TIEUP 版」，不過每天只有固定的時段會出現，將原始香港版置換為以下內容即可：

TIEUP_LINK = "http://www.bijint.com.hk/",
TIEUP_RE = /^(999|999)/,
//
PHOTO_DOMAIN = "http://www.bijint.com.hk",
PHOTO_DIR = "590x450/tie-up",
PHOTO_DIR_L = "590x450",
PHOTO_EXT = ".jpg",
DEFAULT_PHOTO_PATH = "/assets/pict/hk/"

另外以上兩個版本都需將所有字串 "240" 取代為 "590" 及將 "320" 取代為 "450"。存檔後接續上一節「1. Google Gadget 程式碼 hack」的步驟處理即可。


3. UNIQLOCK

UNIQLOCK 能顯示最大的尺寸就是官網入口畫面的那個 swf 檔了，而小尺寸的安裝碼中有一段是長這樣：

<embed src="http://www.uniqlo.jp/uniqlock/swf/blog_large.swf?user_id=xLcs9iEFTZFBDrht" width="424" height="278" allowScriptAccess="always" base = "." quality="high" wmode="transparent" pluginspage="http://www.adobe.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" />
將原本的 swf 檔名及尺寸更改一下，就能顯示入口畫面的 swf 檔，請修改為以下：

<embed src="http://www.uniqlo.jp/uniqlock/swf/index.swf" width="560" height="373" allowScriptAccess="always" base = "." quality="high" wmode="transparent" pluginspage="http://www.adobe.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"/>
藍色部分可將長寬尺寸改為符合自己網頁的大小。

不過 uniqlock 大尺寸的版本有個缺點，因為這個 index.swf 檔無法設定地區，所以會一律顯示日本時區的時間。


三、將美人時計放在桌面

一些大陸製作的美人時計只有網頁版，例如「搜道網」，因此無法放在自己的部落格或網頁，不過倒是有軟體可以搬到自己的桌面顯示。

請參考 重灌狂人 的「Snippage 在桌面「訂閱」任意網站區塊」教學網頁，Snippage 這個軟體可以將任何網頁的任何位置、各種尺寸大小的區域搬到自己桌面，如此就可以在自己桌面看到各種版本的美人時計了。


「正妹報時（美人時計）彙整」系列標題：
一、安裝說明＋大尺寸圖片 hack
二、小尺寸展示頁
三、大寸展示頁之一
四、大寸展示頁之二

➢➢ 快速選單： １ ２ ３ ４
美人時計 美女時計 美女時鐘 收集大集合