WFU BLOG

(Pic from: findicons.com)新世代的 Opera 換了引擎核心後，最為人詬病的其中一個項目為 "無法設定首頁"。其實沒有首頁功能不是很嚴重，如果能每次開啟瀏覽器，都固定出現快速撥號頁面，也是不影響作業。

偏偏 Opera 15 重啟時，會自動打開上次關閉前的所有頁面，如果有 5 個分頁就會重啟這 5 個分頁，這樣的設計未免太沒彈性了，很難想像這是過去注重使用者體驗的 Opera 所做出來的事，總不能每次都要一個個關閉之前留下的分頁吧？

一、Opera 作業的原理

看了「Startup not Continue from last time」這個討論串後，瞭解到 Opera 每次關閉後，會把未關閉分頁的資訊寫入 session 檔，以待下次開啟前，Opera 可以讀取這些資訊。

瞭解機制後，破解 Opera 的方法就很簡單了，把 session 設定檔改成 "唯讀" 的狀態，造成 Opera 關閉時無法寫入分頁資訊，那麼 Opera 開啟時自然無法顯示之前的所有分頁了！

更進一步的作法，例如想讓 yahoo 成為首頁，那麼只要 Opera 關閉前只留一個 yahoo 的分頁，那麼關閉後 yahoo 分頁的資訊便會寫入 session 檔，此時再將 session 檔改成 "唯讀" 狀態，將來每次 Opera 開啟時，便會固定只顯示 yahoo 這一個分頁，形同恢復了首頁功能一般！

二、實作設定 Opera 首頁流程

由於我的作業系統是 XP，跟原討論串不同，不過瞭解原理後就不難實作，以下是對 PC 各個作業系統都有效的流程──

1. 首先叫出 Opera 的「關於」畫面(例如在網址輸入 opera:about)，如下圖紅色橢圓框，記下自己的 "設定檔" 路徑，例如我的 XP 路徑為 "C:\Documents and Settings\Wayne Fu\Application Data\Opera Software\Opera Stable"。

2. 接著只留下一個要當成首頁的分頁，如下圖，我習慣把「快速撥號」頁面當成首頁，然後將 Opera 關閉。

3. 從檔案總管進入步驟 1 所記下的路徑(複製貼上網址列即可)，如下圖，找到 "session.db-journal" 這個檔案，接著按滑鼠右鍵 → 內容 → 將屬性勾選「唯讀」→ 再按確定即可。

完成以上 3 個步驟後，Opera 15 的首頁功能便設定完畢；以後想變更首頁，先將 session 設定檔取消唯讀，再重複 1~3 步驟即可。

延伸應用：如果每次開啟 Opera 時都需要固定在多個頁面作業，例如 Gmail、Google Drive、Google Calendar 等，那麼就可以留這三個頁面後關閉 Opera，再來將 session 檔設定唯讀即可。

三、搬移 Opera 暫存檔(cache)的路徑

既然前面 Opera 「關於」的畫面也提供了快取的路徑，那麼順便說明一下如何將網頁龐大的暫存檔，移動到 C 槽以外的地方。

由於 opera:config 調整所有細項參數的功能已被拔除，無法更改 cache 路徑，不過可以用軟體 junction 來達到目的，想瞭解原理可參考這篇文章「讓Junction來解決您電腦C槽磁碟滿的問題」，以下提供搬移的操作步驟──

1. 下載「junction.zip」，解壓縮後，將 junction.exe 這個檔放在 C:\Windows\System32\之下。根據原文說明，可能第一次執行 junction 時會要求允許條款聲明，需要按「Agree」。

2. 再次看到 Opera 的關於畫面，如下圖方框，記下自己的 "快取" 路徑，例如我的 XP 路徑為 "C:\Documents and Settings\Wayne Fu\Local Settings\Application Data\Opera Software\Opera Stable"。

3. 從檔案總管進入這個路徑，如下圖，可看到裡面有一個資料夾名稱為 "cache"，用沒多久已經有快 300 mb，得儘快搬離 C 槽才是上策。

將 "cache" 這個資料夾剪下(不是複製喔！)，貼到自訂的磁碟路徑，例如我搬到 E 槽的 Opera 資料夾後，其路徑成為 "E:\Opera\cache"。

4. 叫出 DOS 視窗，以 XP 為例，按「開始」→「程式集」→「附屬應用程式」→「命令提示字元」

然後在 DOS 視窗輸入以下命令格式：

junction原本的快取路徑搬移後的快取路徑

以我的路徑為例，就像下面的形式：

junction "C:\Documents and Settings\Wayne Fu\Local Settings\Application Data\Opera Software\Opera Stable\cache" E:\Opera\Cache

這樣就大功告成了，如果 junction 的操作上有什麼問題，也許可以參考前面所提的 junction 原教學文章說明。

(Pic from: stevefullmer.tumblr.com)Opera 引領先驅的原生滑鼠手勢系統，在新世代的 Opera 15，竟被縮編到剩下五種手勢，這應該是支持者最失望的一部份了。能有一點小安慰的是，Opera 15 可經由安裝套件後，移植 Chrome 的套件在 Opera 上使用。由於 Chrome 的眾多滑鼠手勢套件並非為了 Opera 而設計，那麼在 Opera 環境上能發揮幾成功力，請看以下的測試心得。

一、準備動作

首先到以下網址，按下「加到 Opera」即可安裝 "Download Chrome Extension" 這個套件：

https://addons.opera.com/zh-tw/extensions/details/download-chrome-extension-9/

安裝完畢後，接著可進入以下「Chrome 商店」網址，搜尋需要的 Chrome 套件：

https://chrome.google.com/webstore/category/apps?hl=zh-TW

如上圖，請依 A～D 比對以下內容──

A.搜尋 "gestures"(手勢)

B.按下 "擴充功能"，每個套件原本應該出現 "加到 Chrome" 的按鈕，現在成了 "加到 Opera"' 的按鈕。如果沒出現 "加到 Opera" 字樣的話，通常只要重新整理頁面即可。

C.假設選擇 "Smooth Gestures" 來試安裝

D.上方通常會出現這些字樣，按下確定即可。如果該套件還是沒有啟動，請到「Opera」→「延伸套件」的畫面去啟動或安裝該套件。

以上流程為安裝 Chrome 套件的準備動作及示範流程，以下分別介紹適合安裝在 Opera 的滑鼠手勢套件。

二、滾輪換頁

以下測試著名的 chrome 滑鼠手勢套件在「滾輪換頁」功能的效果，安裝完套件後，可能要重啟 Opera 才能生效。

1. 效果比較

Pig Toolbox：Chrome 最強大的滑鼠手勢套件，不過在 Opera 似乎不相容，能生效的功能不多。

Smooth Gestures：Chrome 五顆星套件，效果不佳，無法連續換頁，一次只能滾動一頁。

CrxMouse：四星半套件，滾輪換頁無法生效。

Mouse Stroke：這是在 Chrome 商店找不到的套件，在 Opera 上實現滾輪換頁效果最佳。

由以上測試結果可知，Mouse Stroke 為最佳選擇，以下說明如何安裝這個套件。

2. 安裝 Mouse Stroke

這是 Mouse Stroke 的官網網址，可在這裡下載最新版本 1.9.5.2 的 crx 檔：

http://code.google.com/p/chrome-mouse-stroke/downloads/list

安裝 crx 檔的方式很簡單，首先叫出「Opera」→「延伸套件」的畫面，再將 "mouse-stroke-1.9.5.2.crx" 從檔案總管用滑鼠拖曳過來，再按畫面的指示安裝即可。

接著仍舊在「延伸套件」的畫面，按下 Mouse Stroke 的 "選項" 按鈕──

依上圖 A～B 的順序：

A. 請按圖中指示分別設定「滑鼠滾輪向上」、「滑鼠滾輪向下」

B.按下存檔

完成以上流程後，可能需要重啟 Opera，就能讓滾輪換頁的功能生效。

三、滑鼠手勢

先說結論，很不幸地，Opera 的滑鼠手勢與所有套件相衝，只有原生的五種手勢能生效，其他任何套件的滑鼠手勢完全無效。

唯一剩下有作用的，是滑鼠滾輪、滑鼠按鍵、滑鼠拖曳的動作，因此還可以利用滾輪及左右鍵進行一些排列組合。

1. Mouse Stroke

由於我的滑鼠沒有滾輪向左、向右的功能，所以只有以下四種組合能設定：

按著右鍵時點擊左鍵
按著左鍵時點擊右鍵
(按右鍵時)滑鼠滾輪向上
(按右鍵時)滑鼠滾輪向下

再參照一次之前的圖，有作用的是「搖桿手勢」及「滾輪手勢」──

2. CrxMouse

如果還想設定其他的滑鼠滾輪按鍵組合，推薦再多安裝 CrxMouse，因為他的排列組合方式最多，除了 Mouse Stroke 的那四種以外，還可以有以下其他的設定方式。

A.滾輪手勢：多了左鍵與滾輪的組合

B. 搖桿手勢：多了滑鼠中鍵與左右鍵的排列組合

四、總結

這篇測試了四種 Chrome 滑鼠手勢套件，結論為對新版 Opera 比較有用的是 Mouse Stroke 與 CrxMouse 兩款。其實我對滑鼠手勢的需求不大，除了現有的那五種，主要是滾輪換頁、字體大小縮放、及滑鼠拖曳的功能而已，在這情況下只要安裝 Mouse Stroke 即可。

如果有更多的需求，可以多安裝 CrxMouse，且這些套件的功能其實都很強大，能夠執行自定義的 javascript。當 Mouse Stroke 已經沒有多餘滑鼠按鍵組合可用時，多安裝 CrxMouse 後可利用執行 js，來拯救 Opera 摒棄書籤列的缺陷，這一點將另外再專文說明。

(Pic from: iconarchive.com)新版 Opera 15 摒棄書籤及書籤列，認為用「快速撥號」可以取代，但相信沒幾位使用者能夠同意這件事。其操作不但花時間，「快速撥號」畫面能擺放的網頁 logo 也是有限。

我想到的解決方法為利用滑鼠手勢套件，藉滑鼠按鍵組合來執行 javascript，在畫面中央直接顯現含書籤的快速選單，可以解決沒有書籤列的困境。而且使用起來，比原本書籤列的設計更方便、快速。

因此這個方案，不但 Opera 適用，Chrome 也可以嘗試看看。如果想先測試效果，可以按下面這個按鈕，模擬滑鼠按鍵組合所跳出的快速選單──

一、功能介紹

首先下面這是效果圖──

1. 選單位置：使用滑鼠按鍵組合所跳出的快速選單，會自行調整高度、位置，在畫面正中央浮動，不會隨畫面捲動消失。

2. 自訂書籤：使用者需自行設定快速選單中的書籤，例如網站名稱及網址。

3. 自訂細項：快速選單的字體大小、顏色、CSS 配置等細項都可自訂。

4. 執行效果：按下網址後會另開視窗，並關閉快速選單。

5. 關閉選單：開啟選單後若不使用，滑鼠只要曾移到選單上，那麼滑鼠只要離開選單，在網頁任何地方按一下，選單即會自動消失。

二、安裝準備動作

執行程式碼必須先安裝滑鼠手勢套件，請參考「讓新版 Opera 15 能滾輪換頁+滑鼠手勢加強」：

1. Chrome：如果是 Chrome 瀏覽器，任一能夠執行 js 程式碼的滑鼠手勢套件都可以。

2. Opera 15：建議先安裝 Mouse Stroke，如果滑鼠手勢不敷使用，再另外安裝 CrxMouse。

三、快速選單 js 程式碼

以下為快速選單的 javascript 程式碼──

以下為修改細項的說明，請配合以上的程式碼行號對照。

不過建議稍後再回來看怎麼修改，請先將以上的程式碼複製起來，然後跳到「四、從套件安裝程式碼」，先將這個功能安裝起來，測試一下效果。

C～E：每一行都可看到兩組藍色字串，左邊的字串請置換為網站名稱，右邊的字串請置換為網址。

F：超過三組書籤時，可複製本行程式碼，參照 C～E 行的模式填入網站名稱及網址即可。

H～L：這幾行如何修改參數或 CSS 配置，請參考後面綠字的備註即可。

M行為了節省空間，將程式碼壓縮了，若要參考原始檔請下載這個檔案「bookmark-menu-source.js」。

四、從套件安裝程式碼

下面兩個套件只要擇一安裝即可。

1. Mouse Stroke

如果是新版 Opera 的話，建議優先安裝 Mouse Stroke，以下為安裝程式碼的流程：

從「Opera」→「延伸套件」→ Mouse Stroke 的「選項」→ 捲到最下方的右下角區塊──

如上圖，按下「創建自訂手勢」

依上圖 A～D 順序：

A.自訂這個手勢的名稱，例如圖中的「書籤選單」

B.選擇「the top frame」

C.貼上「三、快速選單 js 程式碼」的程式碼

D.按「確認」

接著畫面捲回最上方，依上圖 A～C 順序：

A.按下「存檔」

B.假設我們使用的是「按著右鍵時點擊左鍵」這個手勢，如圖拉下這個選單，應該可以在最下面看到剛剛設定的「書籤選單」，選擇這個手勢即可。如果沒看到的話，可以按 F5 重整頁面就可以了。

C.最後再按一次「存檔」

這樣就完成所有動作了，可以隨便開個網頁，例如 google.com 試試看效果，「按著右鍵時點擊左鍵」就能叫出書籤選單。

效果沒問題後，再回到「三、快速選單 js 程式碼」輸入自己的書籤。

2. CrxMouse

如果 Mouse Stroke 的手勢不敷使用，那麼新版 Opera 可利用 CrxMouse 來安裝程式碼：

從「Opera」→「延伸套件」→ CrxMouse 的「選項」

假設利用搖桿手勢來啟動書籤選單的話，如上圖勾選「開啟搖桿手勢」

依上圖 A～E 順序：

A. 進入搖桿手勢後，假設一樣用「按著右鍵時點擊左鍵」的方式啟動選單的話，如上圖在「按住滑鼠右鍵」勾選「啟用」。

B. 在「點擊左鍵」的下方選擇「運行自定義腳本」

C. 填入腳本的名稱，例如圖中的「書籤選單」

D. 貼上「三、快速選單 js 程式碼」的程式碼

E. 按「保存」

這樣就完成所有動作了，可以隨便開個網頁，例如 google.com 試試看效果，「按著右鍵時點擊左鍵」就能叫出書籤選單。

效果沒問題後，再回到「三、快速選單 js 程式碼」輸入自己的書籤。

五、小結

這個快速選單有書籤列沒有的優點：

滑鼠操作方便，不必移動到網頁上方才能點選書籤。
書籤另開新頁面，不會在當前頁面打開。

不過也有其缺點：

在非網頁的狀態下無法生效，例如 Opera 的「快速撥號」頁面，或是一些系統設定的頁面。這是因為在這些頁面下，滑鼠手勢的套件無法生效，這也是舊版 Opera 原生滑鼠手勢，強大的全域生效功能令人懷念的原因。

無論如何，既然 Opera 的書籤列已經回不來了，相信花點時間安裝這個快速書籤選單，會是個很好的替代選擇。

在使用 Blogger 之前，一直是 Opera 的愛用者，可惜 Opera 與 Blogger 不太相容，為了網頁的展現效果只能轉投 Chrome 陣營。

不過現在 Opera 改採 Chromium 引擎後，Blogger 網頁得以正常顯示，加上越新版本的 Chrome 越來越常當掉、資源越吃越多，此時 Opera 反而成了可以考慮的選項。

新世代的 Opera 15 多數評價不高，認為只是掛上「Opera」招牌的 Chromium。不過對我這種「XP 再戰十年」的舊配備而言，倒是很高興有這樣的產品現身(精簡版 Chrome + 執行效率 + Opera 的某些友善設計)，也認真地考慮如何調整目前 Opera 的操作不便之處。因此這篇算是個人的調校心得，也許不能套用到每個人的使用習慣，不過相信對於 Opera 基本操作的改進還是具有參考價值。

一、Opera 15 的缺點

下面列出對於新版 Opera，個人覺得操作上不方便之處：

瀏覽器開啟時，會自動打開上次所有未關閉的分頁。
沒有滾動換頁功能，滑鼠手勢太少。
沒有新信件通知功能(Gmail)
沒有書籤快捷列

以下敘述如何解決上述問題的過程，並在相關主題一併提及其他公認不便之處的應變方法：

首頁功能
改變網路暫存檔(cache)的路徑
簡易書籤的替代方案

二、首頁及未關閉分頁

以 Chrome 為例，能夠自訂「首頁」及「啟始時自動打開的分頁群組」，而新版 Opera 則完全無法設定。

還好經由將 Opera 設定檔改為 "唯讀" 狀態後，可以同時解決這兩個問題，詳細操作方法請參考：

讓新版 Opera 15 能使用首頁功能+搬移暫存檔(cache)路徑

這篇也一併解決了 Opera 無法設定暫存檔路徑的問題。

三、滾輪換頁及滑鼠手勢

藉由安裝「Download Chrome Extension」這個套件後，Opera 得以安裝 Chrome 商店的滑鼠手勢套件。只是 Opera 畢竟不是 Chrome，套件會有相容性問題，而這些 Chrome 上的套件能夠將「滾輪換頁」及「滑鼠手勢」做到什麼程度，請參考這篇：

讓 Opera 15 能滾輪換頁+滑鼠手勢加強

四、Gmail 新信通知

新版 Opera 已經將郵件管理、檢查及通知功能的部分抽離，因此想要有新信通知只能繼續仰賴 Chrome 套件。由於我主要的作業是利用 Gmail、且有多個 Gmail 帳號，以下內容主要以能檢查多重 Gmail 帳號的套件為主。

經測試後，Chrome 最強悍的「Checker Plus for Gmail™」很可惜跟 Opera 不相容，而能跟 Opera 和平共處的套件，建議使用以下兩者(請先參考「三、滾動換頁及滑鼠手勢」安裝 Chrome Extension)：

1. Mail Checker Plus for Google Mail™

安裝網址：

https://chrome.google.com/webstore/detail/mail-checker-plus-for-goo/gffjhibehnempbkeheiccaincokdjbfe?hl=zh-TW

優點：

可直接標記星號
檢查間隔短
刪除郵件速度快速

缺點：

不能批次執行指令

2. Google Mail Multi-Account Checker

安裝網址：

https://chrome.google.com/webstore/detail/google-mail-multi-account/mcpnehokodklgijkcakcfmccgpanipfp?hl=zh-TW

優點：

郵件預覽時，打開、收合郵件的操作介面設計方便友善。
可直接回信，不需打開 gmail 網頁。
可選擇多個郵件，批次執行指令。

缺點：

郵件時間會顯示 "Invalid Time"
不能標星號

若要使用多重 Gmail 帳號，建議先登入所有的帳號後，再安裝以上套件，系統便可自動抓到帳號。

以上兩個套件各有不足及無可取代的優點，在還沒有統整的方案出現前，我暫時採取兩者皆安裝的方式。

五、書籤列的替代方案

如果要說新版 Opera 操作上最讓人無法忍受的，會直接導致拒用的不便之處，我會選擇「沒有書籤列」這一項。

「快速撥號」雖然是用來取代書籤列的設計，不過叫出「快速撥號」的過程比較花時間，且能顯示的網站圖示有限。因此在 Opera 上這件事若無法解決，他終究無法成為我日常作業的選擇。

意外的是在「三、滾輪換頁及滑鼠手勢」的流程中，有了靈感找出可以達到跟書籤列一樣的功用，操作上甚至更方便、迅速。我的解決方法為利用滑鼠按鍵組合來執行 javascript 程式，呼叫出書籤選單，這就解決了沒有書籤列的大問題。

想要測試這個快速書籤選單，下面按鈕可模擬選單效果──

想瞭解如何安裝書籤選單的功能，請詳讀這篇說明：

可以取代新版 Opera 15 書籤列的快速書籤選單

六、簡易書籤

是否有書籤的需求算是見仁見智，如果真的需要大量書籤的話，Opera 官方提供的書籤套件 "Bookmarks Manager" 只能形容為「有比沒有好」：

https://addons.opera.com/zh-tw/extensions/details/bookmarks-manager/?display=en

看他的評價目前只有兩顆星就知道做得慘不忍睹，無法編輯、調整順序、執行反應速度差。對我而言，由於作業上的需要，書籤是很有必要的一項功能。除了使用「五、書籤列的替代方案」的書籤選單之外，我還需要不少的 google 工具、雲端工具、部落格作業工具的連結，至少二、三十個常用書籤跑不掉。

如果讀者對書籤的需求沒有到上百個，只需要數十個常用書籤的話，那麼或許可以考慮安裝這個 Opera 的套件「Favourite Sites」：

https://addons.opera.com/zh-tw/extensions/details/favourite-sites/?display=en

上圖是官方提供的畫面，介面看起來清爽多了。雖然不能直接拖拉改變書籤順序，至少在後台可以手動調整順序。

他的使用限制為：

最多設定 4 個群組
一個群組最多 8 個書籤

所以最多只能設定 32 個書籤。總之，在書籤這個部分想要有令人滿意的解決方案，只能等待更好的套件出現了。

七、小結

Opera 15 看得出是個未完成品，甚至感覺有點倉促推出。本文為這陣子以來摸索的心得，希望能增加新版 Opera 的完整度。實際上過去 Opera 很多設計都是注重使用者體驗的，這也是過去曾為忠實使用者的緣故。如果 Opera 對這方面的理念仍然一致的話，希望在未來的更新版本能向使用者展現出來。

寫完「部落格浮動側邊欄」之後，對於這樣的功能還可以有什麼樣的應用，直覺想到的是水平導覽列選單(也就是 Blogger 的 "網頁" 小工具)，認為直接把程式碼拿來套一下應該就能浮動置頂、凍結在網頁的最上方。

試了一下發現小改程式碼即可，於是再加了一點透明的效果，滑鼠經過導覽列時解除透明，就像本站上方這個水平導覽列一般，或是請看下面的示意圖：

一、導覽列置頂的優點

其實此功能不少網站都看得到，例如「Google+」的上方就有，這個設計有不少優點：

1. 減少跳出率：如果是從搜尋引擎而來的訪客，對我們網站不熟，文章讀完、資料找到後，沒有個吸引注意力的設計，通常就直接離開了。那麼如果浮動導覽列恰巧有個訪客有興趣的主題，就有機會留住這位客人了。

2. 隨時提供導航：不是每個上網的人都很熟悉網站的構造、擺設位置等，那麼這個浮動導覽列只要項目設計得好，就能讓這位迷途羔羊的網路生手有一個很好的重點指引。

3. 節省操作：導覽列置頂可以省去按「回到頂端」這個按鈕，網頁可以少安裝、執行一個區塊，而且「回到頂端」按鈕有時會遮住一些文字。

二、安裝程式碼

1. 以 Blogger 的操作為例，到後台「範本」→「編輯 HTML」，如果範本裡已經安裝過 jqeury 的話，就不必執行這個步驟(可搜尋看看有沒有 "jquery" 的字串)；如果沒安裝過 jquery，請搜尋 </head>這個字串，找到後在此字串的前一行，插入以下程式碼：

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'></script>

2. 接著請搜尋 </body>這個字串，找到後在此字串的前一行，插入以下程式碼：

3. 如果想要修改參數的話，請依以上程式碼行號參考以下說明：

E：如果是 Blogger 官方的範本，這一行通常不需要改，導覽列區塊就是在這裡；如果不是官方範本、或改過範本的話，可參考「Google Chrome 開發人員工具」來找到導覽列的區塊，然後置換本行的紅色字串：

如果要填入區塊的 id，請填入 "#" + id 名稱，例如 "#navbar"。
如果要填入區塊的 class，請填入 "." + class 名稱，例如 ".navbar"。

F：藍色數字的參數為導覽列到網頁頂端的距離(px值)。

G：本文的程式碼設計了導覽列透明程度的參數，可填入 0 ～ 1 的數字，0 代表完全透明，1 代表不透明。

改完以上三項即可存檔。

三、注意事項

雖說在本站很容易就完成這個效果，不過拿了其他 Blogger 官方範本測試一下後，發現不一定每個版面都適合安裝，為什麼呢？

1. 頁籤形狀

以分站「三國志 11」為例，原始導覽列的頁籤為上面圓角、下面直角，這樣的形狀如果漂浮在頁面頂端，畫面倒變得有些滑稽，像是漂浮的城牆～

2. 顏色、透明度

後來我把導覽列拉到畫面最上方，經由修改 CSS 讓頁籤的形狀成為四邊圓角，這樣的形狀漂浮在頁面頂端就不會突兀了。拉到畫面最上方及修改 CSS 的過程可參考：

將 Blogger「標籤」小工具放在導覽列實作

不過這樣的浮動導覽列看起來還是比不上本站導覽列的效果，原因就出在分站的導覽列，個別頁籤的底色本身就有一定的透明度，而且整個導覽列的底色為透明，那麼在滑動的過程中，這個視覺效果會讓眼睛看起來不那麼舒服。

3. Blogger 導覽列不能拉動位置

就算使用了非透明底色的導覽列，如果像前面所提的三國志11分站那樣，把 Blogger 導覽列拉到別的位置，再使用本文的浮動導覽列，也可能出現問題，因為浮動的時候可能會發現，底色怎麼不見了？

因為 Blogger 把導覽列的 CSS 拆成好幾個地方放，把導覽列拉到別的位置後，本文的程式碼可能不知道原本底色的 CSS 在哪。因此我想要對 CSS 十分熟稔，才能解決這個問題。

4. 導覽列未設寬度

感謝 +Ken Lo於【留言 #01】回報，原來本站的導覽列在不同螢幕解析度下(例如 ken 的螢幕為 1600 x 900)，浮動導覽列會亂跑，就像下圖一般──

測試了各種 CSS 的調整方法後，發現這是因為本站使用的範本，導覽列沒有設定寬度的緣故，才會一浮動就超出邊界四處遊走。如果讀者也有上圖這樣的情形，只要在導覽列的 CSS 區塊設定寬度為 100% 即可。例如程式碼 E 行所填入的導覽列區塊為 .tabs-outer，那麼就在範本裡搜尋 ".tabs-outer"，找到後加入以下紅字部分即可(如果範本沒有，就自己在 <style> ～ </style> 的區間新增以下全部內容)：

.tabs-outer {

....  // 原參數內容
 width: 100%;

....  // 原參數內容

}

四、小結

結論是，想安裝本文的浮動導覽列，得先檢視導覽列的頁籤形狀、底色、位置等等的因素，才能有滿意的效果。

如果 Blogger 範本的導覽列不符合以上提到的因素，不過有 HTML/CSS 基礎的話，那麼還是有機會經由調整 CSS 來實現浮動導覽列的效果。不然的話，就是關閉官方導覽列，自己直接設計一個導覽列，會是可能的解決方案。

(Pic from: shimivn.blogspot.com)「回到頂端」按鈕是很常見的設計，且 code 不難寫。那麼特地撰寫本文的目的為何呢？其實主要是拜讀了 +Bin Ye的「改善 Google Blogger 返回頂部按鈕的使用體驗」覺得很有道理，因此雖然未使用這個按鈕(已經有「置頂導覽列選單」了)，不過這個友善的使用者體驗設計，值得把他做出來，讓有需要的站長自取，因為本站的作品基本上也是朝使用者體驗的方向在前進。

一、符合使用者體驗的設計要點

以下所提的各種效果，可先請參考這個 DEMO 網頁對照：

「回到頂端」按鈕 DEMO 網頁

1. 按鈕的位置

「回到頂端」按鈕很常見的位置放在頁面的右下角，不過根據 Bin Ye 原文及留言，使用者視線的焦點大致落在螢幕中央的水平線(也就是 1/2 處)，而滑鼠指標大致會落在螢幕中央約 2/3 的區域。

經觀察自己實際操作滑鼠的模式，的確不自覺會將鼠標落在畫面中央水平線稍微下面一點之處，那麼「回到頂端」按鈕如果放在螢幕 1/2 ～ 2/3 這個高度區間，可減少滑鼠移動的距離，對於使用者而言將是最方便的操作。

2. 透明度

這個按鈕可能會遮住一些文字，因此有必要加入透明度的設計，當滑鼠經過按鈕時再取消透明。

3. 出現時機

畫面尚未捲動時沒必要回到頂端，因此用 jqeury 監測捲動事件，當畫面開始捲動後才出現按鈕。

4. 滑動效果

直接跳到頂端稍嫌粗魯，用 jquery 內建的動畫效果，可以達到簡單的滑動效果。

二、安裝程式碼

1. 以 Blogger 的操作為例，到後台「範本」→「編輯 HTML」，如果範本裡已經安裝過 jqeury 的話(需至少 1.7 以上的版本)，就不必執行這個步驟(可搜尋看看有沒有 "jquery" 的字串)；如果沒安裝過 jquery，請搜尋 </head>這個字串，找到後在此字串的前一行，插入以下程式碼：

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'></script>

2. 接著請搜尋 </body>這個字串，找到後在此字串的前一行，插入以下程式碼：

3. 如果覺得預設效果就很好了，那麼請直接存檔即可；想要修改參數的話，請依以上程式碼行號參考以下說明：

G：想使用自訂圖案，請置換藍字圖片網址。

H：紅字 "1/2" 代表按鈕無論螢幕在任何情況、解析度下，都會出現在約 1/2 的高度，建議填入 1/2 ～ 2/3 之間的數值。

I：按鈕距離螢幕右邊界的 px 值

J：按鈕的透明度可填入 0 ～ 1 的數字，0 代表完全透明，1 代表不透明。

K：可自訂捲動的速度，綠字 500 代表以 0.5 秒的速度捲到頂端，若填入 1000 代表 1 秒。

E：title 裡面的中文字串可改為自訂的提醒文字

三、小結

如果對 js 熟悉的話，本文的程式碼還可以有非常多的應用，例如自行修改加入其他按鈕，可快速跳轉到留言區、自訂錨點的功能，或加入幾個常用的社交分享按鈕等等。由於 WFU BLOG 尚未考慮使用這些功能，因此要請自行研究了。

(Pic from: google search)Google+ 留言框推出幾個月來，沒有留言通知與管理介面的問題一直未見改善，導致訪客何時在哪篇文章留過言，站長沒有管道可以察覺這件事，一切只有 "隨緣" 兩字堪可形容，因此國外許多的 Blogger 部落客紛紛將 G+ 留言框改回 Blogger 原生系統，並發文呼籲或批判此事。

而我的感覺也差不多，前陣子在某篇文章偶然發現，原來不少讀者曾用 G+ 留言框問了一些問題，那麼訪客想得到的解答，在 WFU 不知情之下自然是石沈大海。這樣的狀況讓人感到事態十分嚴重，不想辦法徹底解決實在不行。

一、Google+ 留言框的通知機制

要解決這個問題，得先從瞭解其留言通知的機制著手。

1. G+ 留言框使用方式

可參考這篇「Blogger 可用 Google+ 留言系統了！與舊有原生留言系統併用還是直接取代？」，有詳細的介紹說明。

2. G+ 留言通知模式

從這篇 Blogger 社群討論串「能收到部落格 G+ 留言框的留言通知之方法」，以本站 WFU BLOG 為例做簡單說明：

A. 公開留言：如果 Wayne Fu 想得到公開留言的 G+ 通知，那麼留言者得配合以下動作：

勾選「在Goole+ 上分享」
分享對象選擇「公開」
分享對象包含「Wayne Fu」(且選擇正確的頭像)

B. 私密留言：如果 Wayne Fu 想得到私密留言的 G+ 通知，那麼留言者得配合以下動作：

勾選「在Goole+ 上分享」
分享對象包含「Wayne Fu」(且選擇正確的頭像)

3. 本站案例

只要訪客使用 G+ 留言框留言，而沒有按照「2. G+ 留言通知模式」的步驟，那麼站長是 "絕對" 收不到留言通知的。但是想當然爾，訪客哪裡會知道這樣的事情，就算我在留言框上方放了「G+ 留言框提示」的區塊，也幾乎沒有人點開來看，下面就是血淋淋的案例：

本站最熱門的小工具「Blogger 多層樹狀標籤」，某天偶然間才發現，原來一個月間有這麼多人從 g+ 留言框提問，對 WFU 不瞭解的話，說不定以為這個站長是不是很傲慢，都不回覆的啊？？

二、解決之原理

在 Google+ 留言框未公開 API 之前，是不可能自己寫外掛，替其增加任何功能。要解決這個問題，只能繞道而行。

我所設想的方案為，既然訪客不會主動去點開留言注意事項，那麼能否預測訪客何時留言，並在其留言的瞬間，自動將留言注意事項展開來，以吸引其注意力，那麼訪客自然會去閱讀？

上圖紅框為留言時必須點擊的區域，經由監控這塊區域，當訪客按下滑鼠時(偵測到滑鼠按下的動作)，立刻將留言注意事項展開，如此可達成任務。

想要先測試一下效果，可在本站任一篇文章的文末，測試 G+ 留言輸入框的點擊效果。

當然了，訪客看了注意事項是否會照做、是否會操作正確，仍然不是我們能夠控制的。不過該做的都做了，如果還是覺得沒有成效的話，WFU 只能建議換掉 G+ 留言框吧～

三、安裝留言提醒功能

本站寫了兩種版本，請依照自己的需求，選擇對應的版本來安裝：

1. 官方安裝版

不管是不是 Blogger 平台，只要你安裝的 G+ 留言框具有 "排他性"，會把在 G+ 留言框下面的其他留言外掛(包含 Blogger 原生留言系統)都自動移除的，都屬於「官方安裝版」，可按照下面這篇文章來安裝留言提醒功能：

「Google+ 留言框_官方安裝版」+留言提醒功能

2. 多種留言外掛並存版

如果曾安裝過本站的「Google+ 留言框__網頁版」，那麼不但能控制 G+ 留言框的高度，還能與其他各種留言外掛(包含 Blogger 原生留言系統)同時並存，可按照這篇文章來安裝留言提醒功能：

「Google+ 留言框__與其他留言外掛並存」+留言提醒功能

四、幾種可能的狀況

假如一切順利，訪客都按照指示操作留言，是否我們就可收到各種留言通知呢？訪客做了該做的事，站長也有該做的事要做，以下是幾種可能的狀況──

狀況1：在訪客 A 的留言討論串，其他人的留言站長都會收到通知嗎？

如果訪客 A 按照指示，留言分享對象包含站長的話，那麼站長自然一開始就能收到這則討論串的 G+ 通知。

但如果這個討論串站長從未去回覆過，那麼之後所有其他人的留言，站長都不會再收到通知。

所以站長可以在收到通知後，立刻到該則討論串留言，那麼之後所有其他人在該討論串的留言，站長都可收到通知(直到站長受不了留言轟炸，選擇 "忽略" 該則討論串為止)。

狀況2：若是訪客沒有使用 G+ 留言框的 "輸入框" 來留言(就不會自動出現提醒事項)，而是選擇在比較舊的討論串按 "回覆"(或 "reply" 按鈕)來留言，那站長就無法收到留言通知了？

這是有可能的，只要站長沒有在該則討論串留過言，如狀況 1 所提，站長不會收到任何通知。

說實在這沒有什麼有效的解決辦法，一種想法是「我們盡量向前看，舊事(舊的留言串)已逝就隨他去吧！」；否則的話就要累一點，站長把全站每篇文章的每則 G+ 留言串，打卡般地留個訊息，可以確保收到 "所有" 的 G+ 留言通知。

狀況 3：如果站長的名稱是「菜市場」名，例如 Wayne Fu 也是有很多人取這個名稱，導致訪客留言時的分享對象無法選取站長時怎麼辦？

這是很有可能發生的，因為同名同姓時，若訪客與站長不是同一個社交圈，G+ 能列出來的頭像是有限的，說不定站長根本不在名單之內而導致無法選取。解決的方法就是不要取菜市場名...

但是名字早已經取好了還能怎樣呢？這時只能替 G+ 留言框搞一個備案了，例如使用 Blogger 原生留言系統、Disqus 等等，然後在「留言提醒事項」之中告訴訪客，在這種情況下請改用 XXX 留言系統，就像上圖一般，我的「G+ 留言提示」內容最後一點，建議在這種狀況下，請訪客選擇使用 Blogger 原生留言系統來留言。

無論使用哪種備案，建議安裝「多種留言外掛並存版」的 G+ 留言框，可順利安裝其他的留言板，以解決這個問題。

狀況 4：訪客留言分享的對象只要包含站長，站長就一定能收到 G+ 通知了嗎？

正常來說是這樣沒錯，但也是有某些狀況可能會收不到的，原因出在 Google+ 的隱私權設定，請見下圖──

A. 進入 Google+ 的選項

B. 在「你要接收誰的通知」這項設定，請檢查你是否設定為「任何人」，代表可以收到任何人的留言通知。

Google+ 在這一項的預設值為「延伸社交圈」，若沒有手動更改為「任何人」的話，的確會有一定的可能性，收不到「延伸社交圈以外」的訪客留言通知，

五、小結

其實訪客很少願意耐心細讀注意事項，本文的工具算是救急之用，真正需要用心的是 Google 官方，早日做出不需說明事項、依照直覺就能正確操作的 G+ 留言框，才是根本之道。

另外感謝 +Mark X的「G+ 留言版提示 - 展開收合」效果，才有這個功能的發想。

也藉機提醒，若曾在本站用 Google+ 留言框提問過，但未收到回覆者，麻煩請重新留言一次，相信這次 WFU 就能收到通知了。

(Pic from: google search)安裝本文的工具，可解決訪客使用 G+ 留言框時，站長無法收到留言通知的問題。不過安裝之前，請務必配合閱讀這篇說明，以瞭解 G+ 留言框運作原理、各種可能遇到的狀況、及解決方法：

徹底解決 Google+ 留言框無法收到留言通知的問題

另外，本文的工具只適合「Google+ 留言框_官方安裝版」；若使用的是「多種留言外掛並存的版本」，請參考這篇文章：

「Google+ 留言框__與其他留言外掛並存」+留言提醒功能

一、什麼是「Google+ 留言框_官方安裝版」

不管是不是 Blogger 平台，只要你安裝的 G+ 留言框具有 "排他性"，會把在 G+ 留言框下面的其他留言外掛(包含 Blogger 原生留言系統)都自動移除的，都屬於「官方安裝版」。

「官方安裝版」可經由下列幾種管道來安裝：

1. 從 Blogger 後台直接轉換的 G+ 留言框(如果不成功，請參考「Blogger 轉換為 Google+ 留言系統的各種方法」)。

2. 無論是否為 Blogger 平台，利用這個網頁「How to add Google+ Comments to any website」裡面任何一種安裝方式的 G+ 留言框。

二、安裝「自動提醒功能」程式碼

1. 以 Blogger 的操作為例，到後台「範本」→「編輯 HTML」，請搜尋 </head>這個字串，找到後在此字串的前一行，插入以下程式碼(非 Blogger 平台一樣放在這個位置)：

<style>

.Gplus { /* 開合標題 */

margin: 0px;

padding: 5px;

text-align: center;

background: #eeeeee;

border: solid 1px #000000;

cursor: pointer;

}

.Gnote { /* 留言提示 */

margin: 0px;

padding: 5px;

background: #ffffff;

border: solid 1px #000000;

height: auto;

display: none;

}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'></script>

如果範本裡已經安裝過 jqeury 的話(可搜尋看看有沒有 "jquery" 的字串)，可刪除最後面的程式碼 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'></script>。

以上內容為留言提醒區塊的 CSS，想修改樣式的話請參考「G+ 留言版提示 - 展開收合」有進一步說明。

2. 接著請搜尋 </body>這個字串，找到後在此字串的前一行，插入以下程式碼(非 Blogger 平台一樣放在這個位置)：

以下請參考以上程式碼行號──

J：藍字「Google+ 留言提示」為留言提示區塊的標題，可改為自訂字串；藍字「按此展開．收合」為提示字串，一樣可自訂。

E：紅字「留言框提示內容」必須填入自訂的提示內容，依照 HTML 格式(內容請使用單引號「'」、勿使用雙引號「"」)。如不清楚要填入什麼內容，可參考「三、留言提示範例」。

三、留言提示範例

以本站使用的 G+ 留言提示內容為例，效果如下圖──

上圖的 HTML 格式內容如下：

◆ 必須有 G+ 帳號才能留言。<br/>◆ 【公開留言】的分享對象，除了「公開」以外，還必須輸入「<b style='color: #cc0000; font-size: 120%;'>Wayne Fu</b>」之後選擇正確的頭像，我才能收到留言通知，請參考下圖步驟：<p style='text-align: center;'><img src='http://4.bp.blogspot.com/-i3FGz2WR75M/UiFZumjPUII/AAAAAAAAHo8/l8EhTF2ohsM/s1600/gplus-comment-guide.jpg'/></p>◆【私密留言】請將上圖步驟 1 去除即可<br/>◆ <b style='color: #cc0000; font-size: 120%;'>若需要站長回覆，但萬一分享對象無法選擇正確的「Wayne Fu」頭像時，建議使用 Blogger 留言框。</b>

可以把以上 HTML 碼內容略做修改後，置換 E 行程式碼的紅色字串(以上的字串內容不能按過 Enter 鍵)：

HTML 碼有個綠色字串的圖片網址，這圖片含有 Wayne Fu 頭像，建議拿這張圖片稍做修改，換成自己的頭像即可。更改後的圖片網址請置換綠色字串的圖片網址。
HTML 碼裡的紅色字串「Wayne Fu」請換成自己的暱稱。
最後一點的內容請依自己的需求修改、或刪除。

若想先測試一下效果，可在本站任一篇文章的文末，測試 G+ 留言輸入框的點擊效果。訪客想留言時必定會點擊留言輸入框，系統會強制出現留言提示訊息，提示訪客依照正確的流程留言；接著訪客再度點擊留言輸入框時，即可正常留言。

徹底解決 Google+ 留言框無法收到留言通知的問題

另外，本文的工具只適合「Google+ 留言框_多種留言外掛並存的版本」；若使用的是「官方安裝版」(會把在 G+ 留言框下面的其他留言外掛，包含 Blogger 原生留言系統，都自動移除)，請參考這篇文章：

「Google+ 留言框_官方安裝版」+留言提醒功能

一、什麼是「Google+ 留言框_多種留言外掛並存的版本」？

就是本站所寫的「Google+ 留言框__網頁版」，此版本可以同時與其他的留言外掛在同一個頁面並存。

二、安裝「自動提醒功能」程式碼

如果安裝過「Google+ 留言框__網頁版」，請將原本程式碼移除，用本文的程式碼代替。

1. 以 Blogger 的操作為例，到後台「範本」→「編輯 HTML」，請搜尋 </head>這個字串，找到後在此字串的前一行，插入以下程式碼(非 Blogger 平台一樣放在這個位置)：

<style>

.Gplus { /* 開合標題 */

margin: 0px;

padding: 5px;

text-align: center;

background: #eeeeee;

border: solid 1px #000000;

cursor: pointer;

}

.Gnote { /* 留言提示 */

margin: 0px;

padding: 5px;

background: #ffffff;

border: solid 1px #000000;

height: auto;

display: none;

}

#gplus_comments { /* G+留言框 */

text-align: center;

}

#gplus_comment_switch { /* 展開文字設定*/

margin-top: 10px;

font-size: 14px;

}
</style>
<script src="https://apis.google.com/js/plusone.js">{lang: 'zh-TW'}</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'></script>

如果範本裡已經安裝過 jqeury 的話(可搜尋看看有沒有 "jquery" 的字串)，可刪除最後面的程式碼 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'></script>。

以上留言提醒區塊的 CSS，想修改樣式的話請參考「G+ 留言版提示 - 展開收合」有進一步說明。

2. Blogger 接著在範本內搜尋類似以下字串──

<b:if cond='data:blog.pageType == "static_page"'>
<b:include data='post' name='comment_picker'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comment_picker'/>
</b:if>

應該會有兩個搜尋結果，目前先裝在第一個搜尋結果即可；第二個是手機版的內容，這個工具在手機版也許無效(沒測過)。

接著在以上 <b:if cond='data:blog.pageType == "item"'>的下一行，插入以下有顏色的程式碼(如果非 Blogger 平台，請將有顏色的程式碼貼在欲顯示的位置)──

以上黑字部分為範本裡的原程式碼，有顏色的部分為安裝碼。下面修改請參考以上程式碼行號──

G：藍字「Google+ 留言提示」為留言提示區塊的標題，可改為自訂字串；藍字「按此展開．收合」為提示字串，一樣可自訂。

H：深紅色字串「留言框提示內容」必須填入自訂的提示內容，依照 HTML 格式(內容請使用單引號「'」、勿使用雙引號「"」)。如不清楚要填入什麼內容，可參考「三、留言提示範例」。

N：設定收合留言框時的高度

O：設定留言框的寬度

P～Q：可自訂收合字串

三、留言提示範例

以本站使用的 G+ 留言提示內容為例，效果如下圖──

上圖的 HTML 格式內容如下：

◆ 必須有 G+ 帳號才能留言。<br/>◆ 【公開留言】的分享對象，除了「公開」以外，還必須輸入「<b style='color: #cc0000; font-size: 120%;'>Wayne Fu</b>」之後選擇正確的頭像，我才能收到留言通知，請參考下圖步驟：<p style='text-align: center;'><img src='http://4.bp.blogspot.com/-i3FGz2WR75M/UiFZumjPUII/AAAAAAAAHo8/l8EhTF2ohsM/s1600/gplus-comment-guide.jpg'/></p>◆【私密留言】請將上圖步驟 1 去除即可<br/>◆ <b style='color: #cc0000; font-size: 120%;'>若需要站長回覆，但萬一分享對象無法選擇正確的「Wayne Fu」頭像時，建議使用 Blogger 留言框。</b>

可以把以上 HTML 碼內容略做修改後，置換 E 行程式碼的紅色字串(以上的字串內容不能按過 Enter 鍵)：

HTML 碼有個綠色字串的圖片網址，這圖片含有 Wayne Fu 頭像，建議拿這張圖片稍做修改，換成自己的頭像即可。更改後的圖片網址請置換綠色字串的圖片網址。
HTML 碼裡的紅色字串「Wayne Fu」請換成自己的暱稱。
最後一點的內容請依自己的需求修改。

(Pic from: tinquantam.blogspot.com)昨天參加了「G+團圓度中秋」活動，有機會與 google 行銷部門高層當面請教一些 Blogger 成員會關心的問題，以下是一些概況與個人心得。

一、會前預排

G+ 團隊在活動上預備跟所有部落客傳達的主題為「G+ 社群的經營經驗分享」，獲邀分享心得的部落客還有 esor huang(數位工作研討會)、藥師吉米(G+攝影論壇) 、Liou-Shih Sie(台北美食聚餐何處去)，他們經營的 G+ 社群人數都很龐大，而 Blogger 社群相較之下沒那麼大，會獲邀的原因是因為最近「無名」、「Yahoo」宣布要關閉，是推廣 Blogger 的一個時機點，因此請我介紹一下 Blogger 的優點，而有關社群經營經驗的分享就由其他幾位負責了。

活動之前的預排地點在台北 101 的 Google 辦公室，見識到他們的娛樂設施、零食飲料區、書房、按摩室等等也滿新鮮的。

會前預演由 Google 行銷副總 Richard，跟四位負責分享的部落客先溝通好要詢問的問題。我的部分是說明「Blogger 跟其他平台部落格相比有什麼優點」、「Blogger 跟 G+ 的功能整合有何推薦之處」。

二、Blogger 站長關心的問題

在排演的過程中，找機會問了一些 Blogger 站長、甚至有意搬家的站長所關心的問題──

Q1：Blogger 會不會收起來？

A：網路生態不斷在改變，下個時期網路流行的是什麼沒有人能預測，因此這不是能夠保證的事情。

不過 G+ 是目前 Google 強力主打的產品，而 Blogger 有越來越多功能與 G+ 在做結合，至少 Blogger 的存續不是現在需要擔心的事。

Q2：其他中文部落格平台有首頁、客服、部落客互相交流很容易，Blogger 能否由官方進行這些服務？

A：Google 的宗旨精神是「DIY」，提供免費資源，不過使用者需要自行運用，無法提供 end to end 服務。全世界各地有很多使用者自發成立的討論群組，都是符合這樣的精神。

三、Blogger 中文社群的定位

瞭解 Google 官方抱持的理念後，對於 Q1，我的分析寫在「Blogger 的未來」；而對於 Q2 的答案則是令人洩氣的，不過得到篤定的答案，至少可以拋開過去的心裡期待。

我想，「Blogger 中文社群」就是 Richard 口中的 "自發性組織" 了，如果經歷過其他的平台，有客服可以隨時提問、有「誰來我家」功能很容易與其他部落客交流、有首頁讓自己文章增加曝光的機會，目前在 Blogger 可能會不適應。

對於「首頁、客服、交流」這些功能，或許有的人覺得非常需要，或許有的人符合 google 精神──認為自己「DIY」就行。

而既然 google 的精神需要使用者自發，那麼對於習慣「首頁」、「客服」、「交流」的族群，在沒有官方資源挹注下，對於有限空間與功能的「Blogger中文社群」，我想真的需要 "自發性" 地產生這些共識：互動、互助、與互諒──

1. 互動

若希望「別人來我家」，那麼有新成員自介時，打個招呼、歡迎一下，有所互動後，新朋友也可能到自己家參觀，自然能產生交流。

2. 互助

在社群詢問時，需要的認知為 "幫忙回答的人非 Blogger 客服"，回覆不是義務，因此得到幫助時，記得表達一下感謝之意。

另外，如果大家多注意、幫忙回答別人的發問，而不是有問題時才上社群發問，相信當自己有問題時，受過幫忙的人也會互相提供經驗，成為良性循環。

3. 互諒

對於 Blogger 缺乏讓文章曝光的機制，導致新手徬徨無措，這一點是很讓人心疼的。因此雖然有時也不願意看到社群版面被被同一部落格的閒聊分享文洗版，導致重要資訊被分散目光，不過如果能夠不硬性制訂規定來禁止，管理員盡量還是站在體諒的立場來看待。

一點小小建議給老手及新手：

如果不想看到某些太頻繁的閒聊分享文，可以手動「封鎖」該作者，那麼在社群就不會再看到該作者的所有文章。
對於新手，如果想短期頻繁貼文的話，建議貼到副社群「Blogger文章分享社群」，那裡沒有發文限制。雖然目前副社群看起來成員數較少，而主社群的成員數較多好像比較有宣傳效益，但如果在主社群被很多人封鎖的話，其實算是得不償失的。

以上是一點想法，藉由從 G+ 活動得到的訊息，給期待社群能提供哪些功用、關心社群定位的成員思考。由於篇幅的關係，其他活動內容分享及感想放在下一篇：「Blogger 的未來」

(Pic from: tinquantam.blogspot.com)「上一篇」是稍微有點壓力的內容，這一篇個人則抱持比較正面的看法，對於 Blogger 的未來，從各種面向角度來切入分析。

一、Google+ 與 Blogger 的功能結合

這是我分享的主題之一，內容主要有三點：

1. Blogger 最近的新功能，後台可設定發文章時自動分享到 G+。

2. 將 Blogger 帳號轉換為 G+ 帳號，並使用個人頭像後，Google 的搜尋結果有機會顯示作者頭像，這有助於提昇自己網站的流量，因為有作者頭像的文章相對之下顯得較有權威性，容易被搜尋者點擊。相關的操作可參考「讓作者頭像出現在搜尋結果__申請Google Authorship的撇步與心得(流程篇)」、「讓作者頭像(Google Authorship)在搜尋結果恢復顯示」。

3. Blogger 安裝 G+ 留言框較方便，而 G+ 留言框有不少優點：

只要有留言就等於自動分享轉貼、在社群的傳播效益很大
一篇文章中看到所有的討論串
留言可編輯
私密留言
留言排序

但 G+ 留言框有個很大的缺點──站長收不到留言通知。目前官方還沒有解決方案，我寫了一個小工具可解決這個問題，請參考「徹底解決 Google+ 留言框無法收到留言通知的問題」。

另外 G+ 最近還有將貼文內嵌到部落格的功能發佈，而以上之所以詳細敘述這些 G+ 與 Blogger 結合的優點，是讓大家感受，Google 正在持續不斷地為 Blogger 添加跟 G+ 有關的新功能，Google 一方面是利用 G+ 來增加 Blogger 的效用，也是誘使其他部落格平台來使用 Blogger，進而轉換為 G+ 使用者。

G+ 是 Google 主打的明星產品，只要 Blogger 持續與 G+ 綁在一起，在 G+ 失去光環之前，我認為沒有必要擔心 Blogger 被收起來；另外，Blogger 的 Adsense 廣告是 Google 的重要收入來源，這也會是 Blogger 不容易收起來的原因之一。

二、其他中文部落格平台

回到上一篇「Blogger 社群的定位」我問 Richard 的第二個問題，關於其他中文部落格平台所提供的首頁、客服、交流等服務。

現在開始覺得，其實中文的部落格平台相對於 Blogger 而言，算是在做 "善心事業" 了，主機的頻寬流量、工程師維護都是在燒錢，首頁需要請人編輯、每日評選好文章，客服需要請人回答問題，每一項都是支出。

當使用的部落客人數成長，也代表需要增加的人事及設備成本，但是並沒有相對應的收入，因為寫部落格不用錢啊！

在各個產業都是大者恆大，小企業先被淘汰，何曾看過最大的先倒、小的屹立不搖？現在我們就見識到了，最大的 Yahoo 與無名同時宣布退出市場，那麼難道是比較小的 Xuite、天空等等的體質比較好嗎？其實只是因為使用者不夠多，錢還夠燒而已，反倒是使用者越多會越快把錢燒完。

所以，現在痞客邦接收了最多數的無名、Yahoo 使用者，成了最大的部落格平台，我開始擔心痞客邦能撐多久？我相信使用者數應可達到原來的兩倍或以上，燒錢的速度也會是兩倍以上，希望痞客邦能有智慧的因應之道。

三、Blogger 的未來

寫完前一篇，現在回過頭看，Blogger 沒有首頁、客服、交流等等的服務，也許正是他能屹立不搖的原因，沒有多餘的人事支出，還能有一些收入(Adsense)，也讓 Blogger 的站長們沒有受過需要搬家的痛楚。

魚與熊掌不可兼得，或許這是我們所必須的自我調適，在享受免費穩定的平台之餘，若需要更多的服務與交流，就參考上一篇的作法吧！

所以我要下的結論也呼之欲出，在免費的前提下，中文部落格平台最適合、穩定的選擇，就是 Blogger，沒有之一，這是目前最有未來的選項。

四、進可攻退可守

會不會有那麼一天，萬一 Blogger 還是消失了，到時怎麼辦呢？

在 G+ 活動的會場遇到一位從痞客邦搬到 Blogger 的部落客(跪婦阿冠)，請教她搬到 Blogger 是因為強制加廣告的事件嗎？她表示痞客邦無法自訂網域，而 Blogger 可以自訂網域，將來就算不用 Blogger，網域還是能帶著走。

的確是如此，且 Blogger 後台可將網站匯出為 XML 格式，要搬到其他平台也是很方便。

使用 Blogger 平台並搭配自訂網域(約一年 NT. 300)，對於有心長期經營的部落客而言，的確算是「進可攻、退可守」的好選擇。

五、後記

當然 Google 是世界頂尖的公司，拿來跟台灣公司比較不太公平。不過台灣科技業的確不好經營，如果做的比較好的部落格平台，經濟許可的話，建議付費讓其增加獲利，比較能夠長久地經營。

最初選擇 Blogger，其中一點原因就是可以不放任何廣告。不過後來想法有些調整，在網站放了 Adsense，因為 Google 可抽成 32%。讓 Google 有收入，部落格平台才能長久穩定。

但是我是很在意版面美觀的人，不喜歡廣告出現在我覺得礙眼的地方，像我把廣告控制在右邊這個位置，這是 Blogger 平台做得到，而其他平台不一定做得到的地方，嗯！另一個 Blogger 優點。

(Pic from: iconfinder.com)對於從搜尋引擎而來的訪客，首次拜訪對於作者總是不太瞭解，在不熟悉的情況下看完文章很容易直接離開。如果自認經歷能夠引起陌生訪客的注目，那麼文末放個作者簡介會是個留住讀者的好主意。

感謝 +Almighty Demiurge於這個「Blogger社群討論串」提到 "今天發現在版面配置的網誌文章編輯區塊裡有增加「在文章下方顯示作者簡介」的選項"，不過對很多人來說，這可能是個「看得到吃不到」的功能。

如果也有同樣問題的話，以下先說明原理及簡易修復方法，若想直接瞭解安裝方法及進階修改，請跳至「三、安裝步驟」。

一、無法顯示的原因

從「原討論串」發現，大部分參與討論的成員都無法成功顯示此功能，可見都是喜歡修改範本的同好！其實不止這個功能，也有一些使用者反應，「網誌文章」裡的許多選項，例如 "星號評等"、"分享按鈕"、"標籤" 等等，為何不能出現在自己排列的位置、或是根本無法顯示？

如果範本是很乾淨、沒有變動過的情況下，Blogger 可以輕易地依據資料庫中的程式碼字串順序，來找到並搬移例如 "星號評等"、"分享按鈕" 等等的位置。

但因為 Blogger 的自由度，使我們很方便地自行修改範本中的程式碼。那麼當範本的程式碼位置有變更、甚或增減內容後，整個字串順序已經不一樣，Blogger 就不一定能判斷出 "星號評等"、"分享按鈕" 等等的位置，因此別說要搬移，有時連顯示都很困難。

二、簡易修復方法

這招是萬用修復方法，在過去文章多次提及，不過只適合範本修改程度不大、或修改範本曾經手誤(不小心刪了某些程式碼)的情形。若是範本有大量修改，絕對不能用這個方法，否則所有安裝的 hack、外掛會全部毀於一旦！

修改範本前請記得備份範本，接著到「後台」→「範本」→「編輯 HTML」→「將迷你組件恢復為預設值」→ 選擇「Blog1」→「還原所選小工具」。

這樣就 ok 了，範本已經回復到最乾淨的狀態，可以到「版面配置」→「網誌文章」→「編輯」，來勾選要出現的項目及調整位置。

此時也可勾選 "在文章下方顯示作者簡介"，不過缺點是官方預設「位置固定於最下方」且不能搬移。如果不喜歡這個位置的話，請參考「三、安裝步驟」。

三、安裝步驟

以下為測試可行的步驟，若未按照這個程序不確定效果如何──

1. 轉換為 G+ 帳號

如果 Blogger 帳號未轉換為 G+ 帳號的話，可到「後台」→「Google+」來轉移帳號。

程式碼中有一段會讀取 G+ 的個人簡介敘述，若是原 Blogger 帳號沒轉換的話，不確定讀取出來的畫面會是什麼樣子。因為我的帳號已經轉移到 G+ 帳號，無法再測試 Blogger 帳號的情形，因此不想轉換帳號的話，得請自行測試了。

2. 勾選 "顯示作者簡介" 功能

如上圖，請到「版面配置」→「網誌文章」→「編輯」→ 勾選「在文章下方顯示作者簡介」→「儲存」。

且從上圖可看到，「作者簡介」的區塊背景色為白色，代表不能移動，其他灰色區塊代表可移動。

3. 安裝程式碼

以下為要安裝的程式碼內容，如想放在自訂位置請參考「四、樣式修改及擺放位置」，以下假設放在文章結尾處。

請到後台 →「範本」→「編輯 HTML」，搜尋類似以下字串(這是繼續閱讀的位置)：

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>

在以上程式碼的下一行，插入以下程式碼：

<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.authorAboutMe'>
<div style='width: 400px; margin-top: 30px; padding: 10px; border: 1px dotted lavender; background-color: #eeeeee; border-radius: 10px;' class='author-profile' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<b:if cond='data:post.authorPhoto.url'>
<img expr:src='data:post.authorPhoto.url' itemprop='image' width='50px'/>
</b:if>
<div>
<a class='g-profile' expr:href='data:post.authorProfileUrl' itemprop='url' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</div>
<span itemprop='description'><data:post.authorAboutMe/></span>
</div>
</b:if>
</b:if>

以上可修改的部分為有顏色的字串──

藍字部分：第一行與最後一行的藍色字串，代表「文章頁面時才顯示作者簡介，其他頁面不顯示」。應該不會想要首頁也顯示吧？真的想的話請把藍色字串全部刪除。

綠字部分：請先參考以下的效果圖，

覺得這個作者簡介效果還 ok 的話，那就不必修改。
如果不需要任何樣式、用官方原本的效果即可，請刪除所有綠色字串。
如果想自訂整個作者簡介區塊的樣式，那麼請參考「四、樣式修改及擺放位置」。

四、樣式修改及擺放位置

1. 樣式修改

程式碼綠字的部分，及代表的樣式如下，請依需求自行修改參數、或增添樣式：

width: 400px;  /* 區塊寬度 */

margin-top: 30px;  /* 與上方區塊的距離 */

padding: 10px;  /* 內襯寬度 */

border: 1px dotted lavender;  /* 邊框形式 */

background-color: #eeeeee;  /* 背景色 */

border-radius: 10px;  /* 圓角程度 */

2. 擺放位置

請參考「Blogger 範本__(三)文章及留言區塊的程式碼」，對於文章區塊的各個位置有詳解，可將本文程式碼放到範本中的自訂位置即可。

五、小結

許多大站都會在文末安插作者資訊，這是顯示作者經歷及權威性的好方法，因此 Blogger 這項功能是值得肯定的。

可惜目前對 WFU 而言，文末若放作者資訊怕會搶了讀者目光，其他更想傳達的資訊就比較不被注意了，因此這個功能留待將來時機成熟再使用了～

G+ 社群提供了一個平台，讓相同興趣的愛好者互動交流。他的性質類似論壇、BBS 討論區，雖然無法達到「主題深入討論」的功能(回覆無法置頂、不能深入及持續地討論)，不過社群也是有獨特的優點是論壇所不能及，例如──

一、G+ 社群的優點

1. 實名制：論壇、PTT 養分身較容易，容易造成筆戰、匿名攻訐等情事。

2. SEO：由於 G+ 社群與 G+ 帳號綁在一起，在社群發表的內容，google 搜尋引擎可判定其著作權，而在論壇、討論區發表的文章則不一定。

若在論壇與自己部落格重複發表文章，可能會影響「原創文章」的判定，而 Google 搜尋引擎對於非原創文章，排名是很後面的。

另外這個「Blogger社群討論串」也是個值得參考的案例，在論壇與部落格重複發文，也可能因為被判定非原創文章，導致 Google Adsense 申請不過。

3. Hashtag：G+ 社群可使用 hashtag(話題標記)，讓相同主題的討論串集合在一起。

4. 交流：藉由 hashtag，社群成員可以方便找到同好進行交流，這也是本文要介紹的應用之一。

二、什麼是 Hashtag

簡單說，hashtag 就是 "標籤" 的功能，使用者在 G+ 任一則貼文，都可自訂標籤，能快速達到 "索引" 的功能。只要按下這個標籤，配合 Google 本家的搜尋能力，就能快速列出同一標籤的所有文章。

至於如何操作，現有教學已有很多，可參考「讓話題圈自動聚合！ Google+ 啟動hashtag關鍵字連結標記」。

而 hashtag 的由來及進一步的介紹，請參考「社交網絡為何對主題標籤（Hashtag）功能趨之若鶩？」

三、利用 Hashtag 幫 G+ 社群成立精華區

G+ 社群比不上 BBS 討論區的其中一點是「精華區」功能。真要硬做的話就是管理員另外成立一個社群(或專頁)，專門存放精華文章，再手動一個個複製貼文網址過去。

這麼做不但辛苦(步驟多)，而且很大的缺點就是留言討論的內容無法一起搬移，效果比不上以下介紹的方法。

1. Hashtag 設定方法

目前「Blogger 中文社群」的作法是，由管理員為兩種文章設定 hashtag──

精華文章：使用 "#精華文章B" 這樣的 hashtag
熱門討論文章：使用 "#熱門文章B" 這樣的 hashtag

管理員雖無法編輯成員的貼文，但可在貼文留言，加上 hashtag 即可，就像下圖紅框這樣：

2. 列出精華、熱門文章的操作方法

請參考下圖──

先選擇討論區，例如「所有訊息」、或是個別討論區。
接著在討論區上方的搜尋框(如上圖的紅框)複製貼上 "精華文章B" 或 "熱門文章B" 這樣的字串，即可搜尋出所有的、或個別討論區的精華文章、熱門文章。

以上需要管理員配合整理相關文章，並設定合適、不與常用字串衝突的 hashtag 名稱，且發佈公告讓成員知道操作方法。

四、利用 hashtag 促進 G+ 社群成員交流

LinkedIn 是專業人士的人脈網，幫助自己也幫助別人找到需要的人脈。G+ 社群是以興趣所結合的一群人，也是有機會能交到許多朋友。

在「Blogger 中文社群的定位」提過 "Google 的宗旨精神是「DIY」，提供免費資源，不過使用者需要自行運用"。如果社群管理員能增加一個「自介」討論區，提供成員互相交流的機會，相信也是一個交朋友的好管道。

但是，「自介文」這麼多，怎麼樣能讓成員快速篩選想認識、交流的對象呢？這時 hashtag 就能提供強大的過濾功能了。

例如「Travel Photography」是個兩萬多人的龐大社群，提供了「Introduce yourself」自介討論區，如果該社群能夠公告當自介時，在貼文內依照地區別加入 "#旅遊asia"、"#旅遊europe" 等 hashtag，那麼相同區域的成員很容易能互相交流了。

以下以「Blogger 中文社群」進行實作──

1. 設定 hashtag

為了促進 Blogger 平台上、擁有相同部落格主題成員之間的交流，利用「G+名人推薦」的分類來設定 hashtag:

#blogger音樂
#blogger娛樂
#blogger時尚美容
#blogger政治
#blogger藝文
#blogger攝影
#blogger新聞
#blogger運動
#blogger旅遊
#blogger美食
#blogger科技

當成員自介時，請根據自己部落格的性質，附上以上對應的 hashtag。以 WFU BLOG 的自介為例，主題是 Blogger，分類為「#blogger科技」，就像下圖這樣，在紅框處即為加上的 hashtag──

2. 操作方式

管理員發佈公告，在該公告內列出所有相關的 hashtag。
接著管理員將這篇公告的連結，放在置頂「關於」之中的超連結(例如「Blogger 社群這篇公告」)。

如此成員隨時都可在置頂的超連結，找到相關的自介 hashtag，就像下圖這樣──

如上圖，在這篇公告的內容，點擊 hashtag 後便可列出所有該主題的 Blogger 同好，方便成員互動交流。當然，前提是成員得記得幫自己的自介加上 hashtag 囉！

五、小結

社群網站的訊息洪流來得龐大又湍急，消失的速度也是逝去於無聲無息，我們所發表的高見、留下的自介，在兩三天後還有誰會知道呢？

運用本文 hashtag 的技巧，雖不能保證可存留永久，但至少不會只停留於一時。hashtag 能讓 G+ 社群的效益擴展到什麼樣的地步，本文是我所能想到的，歡迎一起分享更好的應用。

另外也歡迎把這些應用分享到別的自己喜愛的社群，讓 G+ 社群有更不一樣的風貌。

Evernote 每個月有免費的 60MB 上傳使用量，如果只是寫筆記、作待辦或任務規劃等純文字使用，絕對不會超過這個配額。

如果身為部落客，需閱讀大量 RSS 來源，或需常常從網路獲取靈感、資訊，由於擷取到 evernote 的資料也會包含圖片，一天很快就會超過 2MB。

若不是每篇文章都需要參考圖片，主要用途為閱讀資訊的話，那麼可參考本文，提供在 PC、Android、MAC 等平台，只複製文字到 evernote 的操作技巧。

一、什麼是 Evernote？

Evernote 是個跨平台、雲端的個人筆記本，資料庫可同步到各種裝置(PC、Android、Mac..等)。根據每個人不同的創意，可發展出各種獨特的使用方式，詳細介紹及應用可參考「EverNote 3.5 雲端同步筆記資料庫新版軟體詳解」、「活用 Evernote ，你應該學會的 10 個特殊操作技巧教學」。

對於 WFU 而言，目前 evernote 主要是處理待辦事項、收集寫作資訊及材料，因此還沒有大量圖片的需求，這也是本文的由來。等某天有圖片需求時，或許會考慮買專業版吧！

二、擷取 PC 網頁資料、不含圖片的方法

在 PC 上，evernote 提供一組熱鍵，用滑鼠選取網頁上要複製的範圍後，按下 Win+A後，所有的格式(圖片、超連結、顏色...)會自動複製到所產生的新記事中。

不過 evernote 本身還有幾十組鮮為人知的熱鍵，請見這個網頁「Evernote快捷鍵大全」。其中跟本文主題有關的是 Ctrl+Shift+V這組熱鍵，能夠複製 "去除格式" 後的內容(也就是純文字)，詳細操作步驟如下：

選取要複製的網頁內容
按下 Ctrl+C複製
開啟一個新記事(例如按下熱鍵 Ctrl+Alt+N)
按下 Ctrl+Shift+V貼上純文字內容

雖然以上步驟沒有 Win+A來得方便，不過當每月配額超過 50MB 後，也許就用以上步驟擋一陣子吧！

三、Android 裝置擷取 RSS 資料、不含圖片的方法

自從「Google Reader 關閉」後，現在閱讀 RSS 比較習慣使用 android 裝置上的 gReader 這個 app。

不過最近才偶然發現，gReader 竟然有個強大的功能，可以擷取 RSS 的內容到 evernote、且不包含圖片，以下就來看如何操作：

1. 操作步驟

A. gReader → 設定 → 服務 → 自訂發送至，出現下圖──

建議選擇圖中的格式「title + link + summary」

接著，如果之前 gReader 設定分享的對象不是 evernote 的話，請按圖中左下角紅框「清除預設」。

B. 找篇文章來測試，只要在文章中點一下，上方就會出現一排黑底的選項，如下圖──

其中分享的按鈕就在圖中紅框內，請按下去。

C. 接著便會出現下圖的選項──

先勾選左上角的「Set as default」，再選取 evernote，以後就不會再出現這個畫面，而直接傳到 evernote 了。

D. 剛剛那篇文章的內容，就會自動傳送到 evernote 的新記事了，並去除所有的格式及圖片──

從上圖可看到，這個新記事的內容包含了「標題」、「超連結」、「內文」，正是步驟 A 所設定的排列方式。

若是有需要圖片輔助才能看得懂的內文，隨時可以點超連結查詢。

2. RSS 只有摘要的解決方式

不是每個 RSS 都能傳送完整內文到 evernote，因為某些網站並未開放全文 RSS 讀取權限。如果真的很想讀取全文的話，以下是兩個 WFU 常用的「強制 RSS 全文輸出」線上網站：

使用上也很簡單，應該不用特別介紹，把 RSS 網址輸入，按下轉換按鈕就會產生新的 RSS 網址。接著再改訂閱新的 RSS 網址，以後就能接收全文的 RSS 內容了。

四、擷取 MAC 裝置網頁資料、不含圖片的方法

由於 WFU 手上沒有 Mac 裝置，以下資料是尋找解決方案時一併看到的內容，但無法驗證結果，就供 Mac 讀者參考了：

On the Mac, the easiest way to do this is with an app called FormatMatch (free), which will copy text as plain text and paste it (just like running it through a text editor, except without having to recopy/paste -- a one-step process. For many people (I guess), this will probably be enough.

http://discussion.evernote.com/topic/16777-howto-force-plain-text/page-3

資料來源為以上討論串網址，位於 #47 的留言，意思是使用「FormatMatch」這個 app。其他還有一些關於 mac 裝置的討論，可參考整個討論串其他樓層的發言。

五、其他應用

長期使用 LCD 背光的裝置閱讀，對眼睛是不小的傷害，因此 WFU 習慣利用 Kindle Dx 閱讀較長的文章，E-ink 螢幕是閱讀的最佳選擇。

從各種裝置擷取到 evernote 的文章，若要在 Kindle Dx 閱讀，可參考以下操作：

1. 選擇要匯出的文章(按 Ctrl 複選)

2. 檔案 → 匯出 → 匯出為多個網頁 → 可存成多個個別的 html 檔。

3. 將所有的 html 檔複製到 Kindle Dx 即可。

4. Kindle Dx 有安裝「多看系統」就能閱讀 html 檔。

以上為個人使用的一點心得，如有更好的操作方法，歡迎討論補充。

這個問題看起來不像是個問題，只要重複安裝兩次不就好了？其實官方提供的小工具中，有某些只准安裝一次，因而這些「獨一無二」的小工具，無法在部落格上重複出現。

本文除了介紹如何重複安裝這些「獨一無二」的小工具，也探究一下有哪些合適的應用情境。

一、只能裝一次的小工具

在安裝小工具的畫面，若出現「已加入」的字樣，表示這個小工具不能安裝第二次，如下圖：

上圖的「網頁」、「搜尋框」都只能安裝一次，而「Adsense」是可以重複安裝的。

以下是目前為止只能裝一次的小工具列表：

+1 按鈕
Google+ 追蹤者
Google+ 徽章
網頁
網誌統計資料
聯絡表單
網誌存檔
網頁標題
內容出處
簡介
搜尋框
翻譯
透過電子郵件追蹤

其中橘色的三個小工具，將是本文要重點介紹的三個應用。

二、重複安裝的技巧

以「網頁」小工具為例，操作步驟如下：

1. Blogger 後台 → 範本 → 編輯 HTML → 跳到小工具 → PageList1，如下圖──

2. 將上圖 <b:widget id='PageList1'.....</b:widget>複製起來，然後貼在 </b:widget>的後面

3. 如上圖，會有兩段 <b:widget id='PageList1' locked='false' title='網頁'...>這樣的內容，將第二段內容的 id 改為 'PageList2'、title 改為 '網頁2'，接著儲存範本。

4. 回到 Blogger 後台 → 版面配置，就會發現在原本「網頁」小工具的下方，多了一個「網頁2」小工具(沒看到的話，請整理頁面)，如下圖──

想要重複安裝任何(只准安裝一次的)小工具，只要依此要領，按以上步驟進行即可。

三、兩個「網頁」小工具的應用

兩個「網頁」小工具，可以讓 Blogger 出現兩個不同層次的導覽列，許多知名大站都是如此設計，例如「T客邦」、「INSIDE」、「前端觀察」等。因操作步驟較多，為了節省篇幅將另開一篇文章說明：

Blogger 如何安裝兩個導覽列？

四、兩個「網誌統計資料」的應用

1. 網頁瀏覽數據的鈍化

一般最常看到的「網誌統計資料」使用時間範圍，是 "所有時間"，也就是顯示開站以來的網頁瀏覽數。只不過這項統計指標，在某些情況下會鈍化，例如：

歷史悠久的網站，總瀏覽量很大，但實際上站長早已不寫部落格，已經很長一段時間未更新維護及管理。
剛搬家的新站，總瀏覽量很小，但實際上搬家前是個人氣網站。
中斷好幾年沒寫的部落格，近期開始用心經營。

以上無法列舉所有狀況，不過可明顯看出，單一統計指標無法看出一個網站的實力與發展潛力，那麼兩個「網誌統計資料」相信可以給予更客觀的評價。

2. 安裝兩個「網誌統計資料」

Blogger 後台 → 範本 → 編輯 HTML → 跳到小工具 → Stats1

接下來請參考「二、重複安裝的技巧」的流程，如法炮製兩個「網誌統計資料」，然後在「版面配置」的畫面，將小工具拉到想顯示的位置。

3. 調整設定

以 WFU BLOG 為例，「網誌統計資料」放在網頁的最下方，如下圖排列方式──

左邊的「網誌統計資料」設定為：

時間範圍：所有時間
樣式：只顯示數字、不顯示走勢圖

右邊的「網誌統計資料」設定為：

時間範圍：最近 7 天
樣式：顯示數字、顯示走勢圖

如此由左到右，剛好可顯示三種數據：

所有時間的網頁瀏覽數
過去一個月的網頁瀏覽數走勢圖
最近 7 天的網頁瀏覽數

就算是剛搬家到 Blogger 的人氣網站，藉由這三種數據，也能立刻讓訪客看出未來的潛力。

五、兩個「聯絡表單」的應用

1. 「聯絡表單」的用途

這是個可以暫時充當 "私密留言" 的小工具，其介紹及安裝方式請參考這個「Blogger 中文社群討論串」：

https://plus.google.com/108990319112241335296/posts/REbQuU6xM8c

由於「聯絡表單」是以小工具的形式存在，一般必須放在側邊欄或底部。但是如果另外還想在某些不方便公開留言的文章放表單，例如 "廠商合作提案"、"贊助管道"、"侵權通知"、"失效連結回報" 等等這類型的網頁，那就可以安裝兩個「聯絡表單」，例如這個「贊助頁面範例」。

2. 安裝兩個「聯絡表單」

Blogger 後台 → 範本 → 編輯 HTML → 跳到小工具 → ContactForm1

接下來請參考「二、重複安裝的技巧」的流程，如法炮製兩個「聯絡表單」。

3. 將其中一個聯絡表單安裝到文章或網頁

由於國外已經有很多文章介紹，如何將聯絡表單放在文章或網頁裡面，就不寫重複的內容了，以下是其中一個教學網頁：

How To Create A Contact Page Using The Official Blogger Contact Form

如果有這方面需求、而真的看不懂國外文章的操作流程，請另外留言反應了，再考慮補上中文說明。

六、小結

本文為 WFU 所想到的三個應用，對於其他「獨一無二」的小工具，如果也有不錯發想與應用，歡迎一起分享討論。

常可在一些知名的網站看到，在網站名稱(標頭)的上方放置了一排導覽列，在網站名稱的下方也有另一排導覽列。一方面可能是網站的主題很多，一方面也可將主要與次要的導覽項目區隔開來。

不過 Blogger 預設只能安裝一個導覽列，如果想要在部落格顯示兩個導覽列的效果，請參考本文以下的說明。

一、雙層導覽列的效果

下圖以「前端觀察」這個網站為例──

1. 上方導覽列：以介紹、聲明性質的項目、及功能性質的 "搜尋" 為主。

2. 下方導覽列：以網站文章的主題為主。

因此使用兩個導覽列的優點很明顯，將「網站主題」與「非網站主題」區隔開來，讀者很方便能找到需要導覽的項目。

另外也可參考其他使用兩個導覽列的知名網站效果：「T客邦」、「INSIDE」。

二、Blogger 安裝兩個「網頁」小工具

這部分的流程，請直接參考「Blogger 如何安裝兩個相同的小工具？」→「二、重複安裝的技巧」

三、如何調整「網頁」小工具的位置

安裝完兩個「網頁」小工具後，在 Blogger 後台 → 版面配置，會看到類似以下的畫面──

由於上圖的「標頭」(網站名稱) 左邊，預設並不會出現活頁孔圖案，導致無法將「網頁」小工具拉到「標頭」的上方。

因此要調整小工具的位置需要一些技巧，而讓「標頭」能移動位置的原理，請參考「Blogger 範本__(一)各種註解方式及區塊的修改」→「三、修改小工具的設定」。

以下直接說明操作步驟──

1. Blogger 範本 → 編輯 HTML → 搜尋 b:section class='header'這樣的字串，應可找到類似以下區塊──

如上圖反白的部分，修改的地方有──

maxwidgets 改為 3
showaddelement 改為 yes
locked 改為 false

2. 繼續在範本中搜尋 b:section class='tabs'這樣的字串，應可找到類似以下區塊──

如上圖反白的部分，修改的地方有──

maxwidgets 改為 3
showaddelement 注意是否為 yes
locked 注意是否為 false

完成後請儲存範本。

3. 進入「版面配置」的畫面，大致像下圖這樣──

現在「標頭」已有活頁孔，可將其拉到兩個「網頁」小工具中間，結果如下圖──

覺得滿意了，就可按下「儲存排列方式」按鈕。

4. 檢視一下網頁，效果大致如下──

由於「網頁」與「網頁2」的內容尚未調整，所以目前看起來一模一樣，只要再進行最後的設定可以了。

四、設定「網頁」小工具的內容

1. 從 Blogger 後台 → 網頁，可新增所有要顯示在導覽列上的網頁及名稱。

2. 從 Blogger 後台 → 版面配置 → 網頁→ 編輯，畫面類似以下──

在「要顯示的網頁」勾選第一排導覽列要顯示的項目
在「網頁順序」可調整要顯示的順序

3. 從 Blogger 後台 → 版面配置 → 網頁2→ 編輯，畫面類似以下──

在「要顯示的網頁」勾選第二排要顯示的項目
在「網頁順序」可調整要顯示的順序

4. 完成的效果如下，順利在 Blogger 配置了兩個導覽列──

五、注意事項

最後需要提醒的是，Blogger 每個範本的導覽列效果都不一樣，或許有些需要細調 CSS 設定才能有滿意的效果。

1. 頁籤形狀

分站「三國志11」的兩排導覽列的效果還不錯，是因為頁籤形狀經過修改的緣故，若未修改則會慘不忍睹。

修改 CSS 的方法可參考「將 Blogger "標籤"小工具放在導覽列實作」。

2. 導覽列長度

若導覽列背景色非透明，那麼導覽列長度就會是頁面寬度，無法像分站「三國志11」一樣變短。如果想要控制第一排的導覽列長度，得另外測試如何修改 CSS 了。

本篇為基本操作教學，算是少見的非應用類型文章，主要的原因，其一為網路上完整的教學不多；其二為長久以來，Blogger 在標籤的操作一直有個大 Bug 未解決，而教學文章很少提及。

最重要的原因為，本站最熱門的小工具「Blogger 多層樹狀標籤」在操作上需要大量修改標籤名稱，這也造成一定數量的留言詢問相關問題。因此相信寫一篇修改標籤的文章並附上連結，可減少操作過程遇上的困難。

一、批次新增標籤

先來個小提醒，如果剛從別的部落格搬過來，單一標籤有大量文章時要小心，Blogger 單一標籤一次最多只能修改 50 篇文章喔！

如上圖，假設要將標籤名稱為 "blogger" 的所有文章，批次改為樹狀標籤名稱。

先選擇標籤名稱 "blogger"

待系統篩出所有標籤名稱含 "blogger" 的文章後──

A. 選取所有標籤
B. 按下標籤圖示，選擇 "新標籤"

填入新的標籤名稱，例如樹狀標籤格式。

每篇文章都新增了新的標籤名稱，完成「批次新增標籤」任務。

二、批次移除標籤

趁每篇文章都還保持選取的狀態，新增完新標籤後，正是批次移除標籤的時機。

如上圖，按下標籤圖示，滑鼠移到原本的標籤名稱 "blogger"，會出現提示字串 "新增或移除「blogger」標籤"，按下後便可將這些文章的 "blogger" 標籤移除。

如上圖，標示為含有 "blogger" 標籤的文章都清空了，很簡單地完成「批次移除標籤」任務。

三、小心 Bug

1. 誤入陷阱的操作流程

但是一次要處理很多標籤時，此時就會面臨 Blogger 這個非常可怕的 bug。假設我們完成「二、批次移除標籤」後，此時繼續處理 "google" 這個標籤──

如上圖順序──

A. 選取 "google" 標籤的文章
B. 勾選所有文章
C. 新增新標籤
D. 輸入新的標籤名稱

文章成功地新增了新標籤 "電腦-google"，想不想猜猜看，總共會有幾篇文章的標籤含 "電腦-google" 呢？

答案絕對會令人驚訝，如上圖，選取 "電腦-google" 這個標籤後，發現──

列出了四篇文章
而且這四篇文章都還是勾選的狀態

為什麼會這樣呢？

2. 發生 Bug 的原因

如果有注意畫面的話，會發現 Blogger 後台處理標籤的過程，並沒有重整頁面，因為所有的動作使用 Ajax 技術，全部都是動態完成。也因為沒重整頁面，所以當畫面內容變更後，沒出現在畫面的參數並未重整。

以本文的例子來看，會出現 bug 就是因為──

A. 先前的新增標籤動作，會導致系統暗地裡自動勾選 "電腦-blogger" 標籤的所有文章
B. 畫面變更後，這樣的狀態並未解除
C. 後來處理 "google" 標籤的文章時，由於 "電腦-blogger" 標籤仍保持勾選狀態，導致含 "電腦-blogger" 標籤的文章，也連帶被新增了新的標籤 "電腦-google"。

四、正確步驟

瞭解原理後，就知道如何解決。因此以後進行完「二、批次移除標籤」的步驟後，切勿執行「三、小心 Bug」，請進行以下動作──

移除了原標籤 "blogger" 後，請立即選取「一、批次新增標籤」所新增的新標籤 "電腦-blogger"，就會發現，果然所有文章偷偷地處於被選取的狀態。

取消所有選取的狀態，此時就能安心地進行其他標籤的批次修改動作了。

五、小結

簡單作個小結，正確的批次修改標籤流程，請依照本文「一、批次新增標籤」→「二、批次移除標籤」→「四、正確步驟」→「一、批次新增標籤」這樣的循環即可。

在這個「Blogger社群討論串」有成員詢問 "如何令 blogger 標題圖片隨機出現 ?"，除了當時沒有閒暇研究 js 如何寫，另外就是直覺認為此功能或許使用率不高。

後來想想某些性質的網站，例如攝影、美食、旅遊、遊戲(模擬市民 ths sims)，也許站長會想把作品製作成橫幅圖片，能隨機出現在標頭的位置，讓常客每次來逛的時候都有新鮮感。

如此看來這個功能還是有一定的實用性，而且這個程式算是最簡單的等級，因此就稍微研究一下怎麼實現。想先看效果，可先參考這個 DEMO 網頁：

隨機輪播 Blogger 標頭圖片──DEMO 頁面

一、Blogger 如何處理標頭圖片

稍微 google 一下網路上的程式，大多已經失效，或許是 Blogger 改成新範本的緣故，無論如何沒有看到通用所有狀況的解決方案。

要在 Blogger 的標頭加入背景圖片，最簡單的方法為以下步驟：

Blogger 後台 → 版面配置 → 標頭 → 編輯

出現以上畫面──

圖片：可選擇「從電腦上傳」或「來自網路」。不過不建議選擇「來自網路」，因為這張圖片的網址將不會出現在網頁原始碼，本文的程式也將找不到這張圖片。

位置：不同的選項會導致 js 處理的方法不同──

1. 輸入標題和說明之後：此時圖片會以背景的方式呈現，滑鼠經過不能點擊。

網頁原始碼中圖片的位置在 <div id="header-inner" style="background-image: url(圖片網址);...>

2. 不需要使用標題和說明、於圖片下方附上說明：選擇這兩種狀況時，圖片會以物件的方式呈現，滑鼠經過可以點擊。

網頁原始碼中圖片的位置在 <div id="header-inner"><a href=...><img src="圖片網址"...>

瞭解以上原理及圖片位置後，就能利用簡單的 js 來置換為隨機圖片。

二、安裝程式碼

1. 後台「範本」→「編輯 HTML」，如果範本裡已經安裝過 jqeury 的話，就不必執行這個步驟(可搜尋看看有沒有 "jquery" 的字串)；如果沒安裝過 jquery，請搜尋 </head>這個字串，找到後在此字串的前一行，插入以下程式碼：

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js'></script>

2. 繼續搜尋以下字串：

<b:section class='tabs' id='crosscol-overflow' showaddelement='no'/>

找到後，在其下一行，插入以下程式碼：

3. 請參照以上程式碼行號，以下為注意事項：

F～I行藍色字串為圖片網址，請置換為自己的圖片網址。
若只想輪播三張圖片，請刪除 I 行程式碼；其餘圖片數量請類推。
若想增加輪播的圖片，請隨意複製 F～I其中一行的程式碼，插入 I行後面，並置換藍字圖片網址即可。
輪播的圖片網址，請包含最早上傳的那張圖片網址。
建議每張圖片的尺寸相同，版面效果比較統一。

三、效果展示

在程式碼中的四個圖片網址(藍色字串)，可在這個測試網頁看到隨機輪播效果：

隨機輪播 Blogger 標頭圖片──DEMO 頁面

只要重新整理，就可看到不同的頁首橫幅圖片。

四、小結

瞭解隨機圖片的 js 寫法後，在 Blogger 有很多的應用方式，例如側邊欄的照片輪播，或是配合「Blogger 最新文章＋任意尺寸縮圖」，就能做出首頁的隨機文章(附上大圖片)輪播了。

離開了 PC 可以盲打(自然+許氏鍵盤)的環境後，在行動設備的輸入成為一件痛苦的事，在不熟悉的注音排列之下加上選字時間，反而比手寫慢許多，還不如使用手寫輸入法。

在茫茫眾多輸入法中尋找到這款「訊飛輸入法」，雖是對岸的產品，不過剛使用的時候運氣很好，已經開始支援繁體，且幾個月來不斷地在更新與強化，以目前最新的功能(支援離線語音)來說，真的可以說是行動裝置最強悍的免費輸入法了！因此現在是一個很好的推薦時機點。

由於 WFU 使用的設備為 Nexus 7，本文將以 Android 的使用經驗為主，不過仍提供各種行動裝置的下載網址：

Andoird 版本：https://play.google.com/store/apps/details?id=com.iflytek.inputmethod&hl=zh_TW
iOS 版本：https://itunes.apple.com/cn/app/xun-fei-yu-yin-shu-ru-yuan/id411611739?mt=8

而最近推出的「Google 注音輸入法」也包含語音及手寫輸入功能，這兩個輸入法的效能比較請參考這篇：

Google 注音輸入法 vs 訊飛輸入法__輸入效能比較(手寫及語音)

一、主要優點 + 設定

雖然是免費軟體，但是目前最新版本的功能真的是具備專業等級。除了基本的辨識率極高之外，以下先大致介紹最強悍的功能：

連續書寫 + 疊寫
線上 + 離線語音輸入
簡繁都能辨識

(圖片來自官網)

1. 連續書寫、疊寫

Nexus 7 原廠使用的手寫輸入，一次只能辨識一個字，而且辨識率還很差。那麼就可以想像，可連續書寫是個多麼強大的功能了，而且還能疊寫。

而且更值得稱讚的是，訊飛對於非常潦草的字，辨識率也很高，這可歸功於連續書寫的功能，系統會比對詞庫，自動判斷最有可能的字。

連續書寫與疊寫的切換，請參照上圖──

訊飛輸入法設置 → 手寫設置 → 豎屏手寫模式

2. 線上 + 離線語音輸入

有些輸入法能夠在有連網的情況下，提供語音輸入。而訊飛更強悍，上個月開始提供了離線語音詞庫可下載使用，如此無論在任何地方，都能靠行動裝置輕鬆地用語音寫筆記了；更不用說如果使用手機的話，還可節省龐大的傳輸量！

其原理跟連續書寫一樣，一次寫的字越多，辨識率越高；那麼一次用語音輸入的句子越長，辨識率也越高。

不過要啟動離線語音需要一些步驟：

如上圖，訊飛輸入法 → A. 選右下角的「更多」→ B. 離線語音，點進去後可以下載離線語音檔。

P.S. 上圖的右上角有個齒輪圖案，如果「1. 連續書寫、疊寫」找不到設定的話，可以從齒輪圖案進去。

下載完語音檔後，還要注意是否按下「啟用」，才能使用離線語音的功能。

3. 簡繁都能辨識

如下圖，訊飛輸入法設置 → 輸入設置 → 勾選「繁體輸出」即可。

雖然設定成繁體，實際上手寫簡體、繁體都能辨識，如此一來真的非常方便，很多字其實在時間有限之下，寫簡體可以節省很多時間。

二、其他優點

訊飛輸入法還有非常多的小優點，可看出團隊在小地方非常之用心與細膩，讓這個軟體不只是輸入法，甚至可以說是一個文書解決工具！

1. 表情符號、特殊符號、其他符號

除了一些常用的中英文標點符號可以選，還可輸入表情符號、特殊符號，甚至是日文平假名、片假名等等。

2. 複製、剪裁、全選、移動

如下圖，按左下角的「全選」，能選取全部文字。

配合其他的按鍵，也能做到在行動裝置不容易操作的方向移動、選取、剪裁、複製、貼上等動作，這個設計十分令人激賞。

3. 候選用詞

輸入中、英文時會出現可能的單詞供選擇；而使用手寫的時候，也會根據筆跡，列出可能的字或詞供挑選。

4. 語音可辨識英文

語音功能除了辨識中文，訊飛還能辨識英文。不過由於離線語音檔只有中文，因此必須開啟網路的情況下才能啟用辨識英文的功能。

連上網後，語音輸入的右方會出現選項(如上圖紅框處)，點下後可選擇英文語音輸入(如下圖)。

5. 個性化設置

例如個性化語音、個人語音辭典、手勢、詞庫等等，這些都是非常有用、可增加辨識率的設計。

不過由於有的功能需要連上網路，且行動裝置是 WFU 拿來應急，非拿來作業、處理大量文字的環境，因此這部分的功能並沒有進一步研究。

6. 其他

訊飛還有很多其他細膩的設計：

提供各種背景範本
自訂筆跡樣式
支援外接鍵盤輸入
內建拼音輸入法

如詳細檢視訊飛的設定細項，還可發現其他貼心的功能。

三、個人操作心得

經過一段時間的操作，為了獲得最有效率的輸入過程，以下是我的歸納心得：

1. 比較長的內容：

我會選擇先用語音輸入，把全部內容說完。只要每個句子有停頓，訊飛會自動根據語意，加入逗號或句號。
如果有錯字時，再使用手寫輸入來更正錯誤。

2. 比較短的內容：

這方面稍微要使用經驗來輔助，如果判斷語音無法辨別這段短的內容時，就使用手寫。
如果是一定要正確的單字，只要寫的工整，正確率幾乎可以說是 100%。
如果是連續的詞句，那麼寫得潦草也沒關係，訊飛會根據語意辨識，且判斷能力相當強。

四、小結

很難想像一個輸入軟體可以總結出這麼多的優點，而且他還不斷地在自我進步中，非常讓人期待他的完全體是如何，總之這是值得推薦嘗試的工具。

除了行動裝置，訊飛還出了 PC 版本。當然我們在 PC 上可以盲打的時候，不需要用到手寫或語音輸入法。不過如果是對電腦操作不熟悉、輸入有困難的族群(例如長輩)，那麼 PC 版本就是不錯的選擇了！

(Pic from: softicons.com)在「取代 Google Code 外連 js 檔的選擇__Google Drive」這篇文章的「四、Google Drive 取得檔案外連的簡易方法及範例」，已經介紹過取得檔案外連路徑的簡易方法。不過 +Mark X 曾告知 "我發現我使用的版本沒有主機位置這項"、"試傳一張圖片, 還是沒有. 是因為我用英文版本嗎?"。

當時以為可能是版本不同造成的問題，不過後來 PTT Google 版也有網友反應類似狀況，所以看來不是版本的問題。經過測試後找到了真正原因，以下說明原理、及取得檔案外連路徑的可行步驟，且一併整理不能顯示檔案外連路徑的各種狀況。

一、Google Drive 外連檔案路徑的原理

1. 失效狀況

按照「前文」的方法來取得外連路徑，經過測試之後發現：

只要是將檔案上傳到根目錄，無論是否設定為公開，都無法顯示外連路徑

但是依照前文「三、Google Drive 的操作」的步驟，所有上傳到資料夾的 js 檔，明明都能顯示外連路徑，怎麼會這樣呢？

2. 外連檔案路徑的原理

以我的這個檔案「translate.js」為例，其外連網址為：

https://googledrive.com/host/0BykclfTTti-0SlU3SDg5RUVtNlk/translate.js

經分析以上網址後可發現其結構，https://googledrive.com/host/0BykclfTTti-0SlU3SDg5RUVtNlk/這個字串為資料夾路徑，translate.js這個字串為檔名，這是一個「結構式外連路徑」。想要測試的話，可將 https://googledrive.com/host/0BykclfTTti-0SlU3SDg5RUVtNlk/貼到網址，就會顯示該資料夾的所有檔案。

那麼真相就呼之欲出了，如果我將 translate.js 上傳到根目錄，這個檔案的外連路徑不可能變成 https://googledrive.com/host/translate.js，因為此網址無法判斷出是那個使用者的檔案，難怪在根目錄的檔案 Google Drive 不顯示外連網址。

因此，想得到簡易的「結構式外連路徑」，答案就是必須將檔案上傳到資料夾。

二、取得 Google Drive 檔案外連路徑的正確方法

根據「一、Google Drive 外連檔案路徑的原理」得到的結論，以下為簡單操作步驟說明：

1. 建立資料夾，將資料夾的共用權限設定為「公開在網路上」
2. 將檔案上傳(或拖曳)到此資料夾
3. 對著檔案按右鍵，點選「詳細資料」，即可找到外連路徑。

如需要圖文對照說明，請參考「前文」→「三、Google Drive 的操作」→「四、Google Drive 取得檔案外連的簡易方法及範例」即可。

三、各種不能顯示外連路徑的狀況

根據個人的使用經驗，仍然有一些檔案與某些狀況是看不到「結構式外連路徑」的，整理如下：

1. Google Drive 建立的檔案

例如試算表、表單這些由 Google Drive 所建立的檔案，因為另外放在別的伺服器，所以其外連路徑要用別的操作方式取得。如下圖紅框，試算表右上角的「共用」按鈕可取得檔案共用連結。

另外，若想取得試算表中的資料數據，可參考這篇「利用 Google 問卷(試算表)當小型資料庫__（一）製作資料庫」

2. 上傳相同檔名的檔案

經測試後，如果上傳相同檔名的檔案(例如 wfu.js)，較舊的檔案不會被覆蓋，所有 wfu.js 會並存於 Google Drive，相信這是為了協同作業而設計，保留檔案的更新歷程。如此「結構式外連路徑」將無法對應多個檔案，而導致失效。

在這種情況下，如上圖，按右鍵選擇 "詳細資料"時，所有 wfu.js 都看不到「結構式外連路徑」。

另外要注意的是，就算把所有 wfu.js 全部刪除，額外再上傳一個 wfu.js，仍然無法看到「結構式外連路徑」！所以必須避免上傳相同檔名的檔案。

讓新版 Opera 15 能使用首頁功能+搬移暫存檔(cache)路徑

讓 Opera 15 能滾輪換頁+滑鼠手勢加強

可以取代新版 Opera 15 或 Chrome 書籤列的快速書籤選單

Opera 15 調校心得__首頁+滾輪換頁(滑鼠手勢)+書籤列+Gmail

讓部落格導覽列選單能浮動置頂

快速回到頂端(Go Top)按鈕__符合使用者體驗的友善設計

徹底解決 Google+ 留言框無法收到留言通知的問題

「Google+留言框__官方安裝版」+留言提醒功能

「Google+留言框__與其他留言外掛並存」+留言提醒功能

Blogger 中文社群的定位

Blogger 的未來

讓 Blogger 能在文章下方顯示作者簡介

如何促進 Google+ 社群成員交流？Hashtag 對 G+ 社群的妙用

想節省 evernote 每月使用量？只擷取網頁及 RSS 文字、但不包含圖片的方法

Blogger 如何安裝兩個相同的小工具？

Blogger 如何安裝兩個導覽列？

Blogger 批次修改標籤的方法及注意事項

一、批次新增標籤

二、批次移除標籤

三、小心 Bug

四、正確步驟

五、小結

隨機顯示 Blogger 標頭(banner)圖片

一、Blogger 如何處理標頭圖片

二、安裝程式碼

三、效果展示

四、小結

行動裝置(Android iOS)最強悍的輸入法__訊飛輸入法(語音+手寫)評測

一、主要優點 + 設定

二、其他優點

三、個人操作心得

四、小結

Google Drive 取得檔案外連網址的簡易方法__原理分析及案例整理

一、Google Drive 外連檔案路徑的原理

二、取得 Google Drive 檔案外連路徑的正確方法

三、各種不能顯示外連路徑的狀況