近來行動裝置的瀏覽量不斷攀升，因此如何完善 Blogger 行動版的功能與版面配置、及如何修改行動版範本，這件事遲早會受到矚目。參考了官方文章「Introducing custom mobile templates」後，大致整理一下修改 Blogger 行動版必備的觀念與技巧。先提醒一下：入門、初階者建議先跳到「七、小結」提昇等級，累積實力後再挑戰本文內容。
一、選擇行動版或自適應(RWD)範本？
行動裝置要能讓 Blogger 網站正常顯示有兩種方案：使用自適應範本或行動版範本。不過這個問題並不是簡單的二分法就能抉擇，根據不同的族群，會有對應的最佳方案，詳細的分析請參考前一篇「Blogger 應該選擇自適應範本(RWD), 還是行動版範本?」。
閱讀完內容後，如果決定要「自訂 Blogger 行動版範本」，那麼請繼續往下看吧！
二、修改行動範本準備動作
如前一篇所提，「Blogger 行動版」只有選擇「自訂」才能修改，其他的官方範本全部都不能修改。
請到後台 → 範本 → 行動服務 → 下方的齒輪圖示 → 選擇「是，在行動裝置上顯示行動版範本」→ 選擇行動版範本 → 選擇「自訂」→ 儲存即可。
若還是不清楚如何設定，可參考以下兩張圖：
做完以上動作後，任何在範本中的修改，才會反應到行動版的網頁上。
三、讓小工具出現在行動範本
1. 預設顯示的小工具
根據官方文件，網頁版的所有小工具，預設只有以下這幾種會出現在行動版本：
- Header (標頭)
- Blog (文章)
- Profile (簡介)
- PageList (網頁)
- AdSense (廣告)
- Attribution (版權宣告)
2. 參數使用說明
其他小工具若想顯示在行動版，必須透過在小工具的程式碼增加參數
<b:widget id='HTML1' mobile='yes' locked='false' title='WFU BLOG' type='HTML'>加上紅字的參數後，這個小工具就能在行動版顯示了(顯示在網頁最下方)。
不過事情不一定能這麼順利，在行動版的版面，小工具會如何顯示難以捉摸，因此還必須有 CSS 的基礎能力，自行為小工具加上 CSS 設定，才能有滿意的效果。
3. 其他參數
另外，參數還有以下兩種用法可使用：
- mobile='no' → 小工具在行動版不顯示
- mobile='only' → 小工具只有在行動版才顯示
這部份請依自己的需求來修改。
四、讓網頁版的內容不要出現在行動版
有些在網頁版安裝的 hack 或小工具，如果不想出現在自訂的行動版，可以使用判斷式讓其不執行。例如「快速回到頂端(Go Top)按鈕__符合使用者體驗的友善設計」留言 #9 +跪婦阿冠 bigsishead 詢問「有辦法添加什麼語法讓這組功能只出現在網路版而行動版不要出現嗎？」。可在程式碼的前後增加以下紅字的判斷式即可：
<b:if cond='data:blog.isMobile'>
<b:else/>
回到頂端按鈕全部的程式碼
</b:if>五、讓網頁版沒有的內容出現在行動版
1. 判斷式
將上一段的判斷式修改一下，就能讓程式碼只在行動版執行：
<b:if cond='data:blog.isMobile'>
行動版才執行的程式碼
</b:if>2. 進階修改
在範本中，某些區塊的程式碼，已經被分成網頁版及行動版，例如「文章區塊」。請見下圖：
id 名稱以 "mobile-" 開頭的區塊，行動版便會執行這個區塊的程式碼，例如上圖紅框之中有四段程式碼，都是行動版才會執行；而 <b:includable id='mobile-post' var='post'> 之後的區間，便是行動版文章區塊的程式碼。想要在文章區塊修訂內容，必須修改這個區間的程式碼。
在網頁版的文章區塊 <b:includable id='post' var='post'> (上圖籃框之中)所作的任何修改，都不會反應到行動版的執行結果。
六、行動版 CSS
如官方文件所提，有比較簡單的技巧，可以替行動版區塊設定 CSS：
1. 先確定範本中的
<body expr:class='"loading" + data:blog.mobileClass'>2. 直接套用官方的舉例，如果某個網頁版區塊的 class 樣式如同以下：
.date-posts {
網頁版樣式
}那麼行動版這個區塊的 CSS 要如何設定呢？只要在以上的程式碼下一行，另外增加以下的程式碼即可：
.mobile .date-posts {
行動版樣式
}七、小結
雖是簡單整理，本文的內容要點仍是非常多，需要不少基本功，極不建議初學者碰這一塊，請先閱讀「Blogger 新手入門」、「Blogger 範本__(一)各種註解方式及區塊的修改」、「Blogger 範本__(二)標頭、導覽列、側邊欄、頁尾區塊的程式碼」、「Blogger 範本__(三)文章及留言區塊的程式碼」等等基礎知識較佳。
看完本篇後，想了解更多修改的相關經驗，可另外參考網友的這篇實戰經驗「Blogger桌面版和手機版的文章中加入回應式AdSense廣告」，相信可獲得更多知識。