建置行動裝置版的 WordPress 部落格!

是的,真的只要3分鐘,請跟我一起呼個口號:
PlugIns萬歲!

首先,讓我們先來看一份經濟部通訊產業發展推動小組的報告:2009年第三季我國行動上網觀測 (PDF 全文下載) (這是我寫這篇文章的動機)。

  1. 3G 用戶數達行動通信總用戶數五成五比重。
  2. 3G 用戶數達行動通信總用戶數五成五比重。

    而3G 用戶則持續穩定成長中,較上一季成長9.1%,增加124 萬戶,達1,484 萬戶
    已占台灣行動通信總門號數的55.8%。

    引用自:經濟部通訊產業發展推動小組 – 2009年第三季我國行動上網觀測

  3. 具行動上網功能比例提升至66.1%。
  4. 具行動上網功能比例提升至66.1%。

    2009 年第3 季手機開通行動上網功能之用戶數持續成長,約1,760 萬戶,較上一季成長5.9%
    有能力行動上網之用戶占行動通信用戶比例提升至66.1%。

    引用自:經濟部通訊產業發展推動小組 – 2009年第三季我國行動上網觀測


由上面兩點的數據來看,近年來台灣地區的行動上網用戶是持續增加的,越來越多使用者以手機來瀏覽網頁。這種情況也印證在我身上,就我個人的經驗來說,自從買了iPhone後,利用行動裝置上網的機會愈來愈多,尤其是在搭乘交通工具時,我總是會將iPhone拿出來上網,看看新聞、看看朋友的部落格…等。還有,出去外面吃飯時,也會將手機拿出來,搜尋看看附近有沒有好吃的店家。

直到上週,我將部落格改完版面後,也嘗試用 iPhone 瀏覽看看,然而,iPhone 320px x 480px 的螢幕要容納 980px 的巨大版面果然顯得不太適合,而且有點走樣。

因此,我決定要為我的部落格做個行動裝置版!


首先,上網 Google 了一下,看看要如何做一個行動裝置版的部落格版面(how to build a mobile website),結果發現,其實網路上早就已經有大量的討論了,像 WordPress 這種知名的內容管理系統當然更不用說,資源多到數不清啊!

看了許多介紹後,我決定使用一個 WordPress 的插件:WordPress Mobile Edition,這個插件可以自動偵測使用者是否是使用行動裝置的瀏覽器,如果偵測到行動裝置的瀏覽器後,他會自動轉換到專門讓小螢幕留覽的部落格介面。而目前可支援的行動裝置包含:iPhone、iPod、Android、BlackBerry9530、Nokia、SonyEricsson….等。

以下簡介這個插件的安裝過程:

  1. 這裡,下載 WordPress Mobile Edition。
  2. 解壓縮後,在 wordpress-mobile-edition 裡面會有兩個檔案:wp-mobile.php、README.txt,及一個資料夾:carrington-mobile-1.0.2。
  3. 將 wp-mobile.php 這個檔案上傳到您的 WordPress 的 wp-content/plugins 目錄中。
  4. 將 carrington-mobile-1.0.2 資料夾上傳到您的 WordPress 的 wp-content/themes 目錄中。
  5. 到您的 WordPress 管理介面的 Plugins page 中,啟動 WordPress Mobile Edition。
  6. 大功告成!

註:這個插件如果你是去 WordPress 管理介面的 Plugins page 中,直接下載安裝的話,還是需要您手動去調正檔案與資料夾的位置


最後,以下附上我的部落在 iPhone 上的畫面:

  1. 首頁:
  2. iphone首頁

    iphone首頁

  3. 部落格頁面導覽:
  4. iphone部落格頁面導覽

    iphone部落格頁面導覽

  5. 頁腳:
  6. iphone頁腳

    iphone頁腳

  7. 單篇文章的頁面:
  8. iphone單篇文章的頁面

    iphone單篇文章的頁面

  9. 留言區:
  10. iphone留言區

    iphone留言區

  11. 單篇文章的頁腳:
  12. iphone單篇文章的頁腳

    iphone單篇文章的頁腳