教你擁有達人級的部落格－金魚不是魚

首先先來講一下 Blogspot 這個部落格的系統好了。在台灣，要擁有一個部落格並不難，甚至只要短短的五分鐘，就可以馬上擁有一個自己的部落格。但是，你或許會發現，為什麼有人的部落格那麼漂亮，而我的部落格卻那麼普通？為什麼有人的部落格那麼有特色，而我的卻和大多數人的一樣？為什麼有人可以用部落格賺錢，而我的部落格卻不能放廣告？

台灣目前最多人使用的部落格平台 (BSP) 大概就屬無名小站，它擁的知名，讓所有的使用者一想到要有一個部落格，馬上就會想到它。但是，你或許有注意到，無名小站雖然方便，但是限制也很多，要放個廣告賺錢，或是想要改成有自己特色的Blog，好像都要用錢買。這樣子，對嗎？

那麼，有沒有一個，能夠幫我賺錢，又能夠讓我展現個人特色的部落格平台呢？答案是肯定的。門檻可高可低，最自由的方式，就屬自己在外租一台主機，並且自己架設一個Blog，像是Worepress。其次，就是使用 Google 提供的，Blogspot/Blogger 平台了。使用 Blogspot 平台能夠打造多有特色的部落格？這邊就有幾個很成功的達人範例：Jas9 (設計和部落格經營達人)、小云的隨便亂記 (閱讀達人，誠品推理小說專欄作家)、小黑宅 (工程師，程式達人)、Kaie (Blogspot 程式達人，已經進入神的等級)、廢業青年 ( 轉播野草莓運動時況，網路應用達人)、Noid (自己硬要湊進來的。)

看了那麼多，是不是已經等不及要開始自己的部落格了呢？那我們就進入主題了。要開始使用 Google 提供的部落格 Blogspot，首先要有一個Google 帳號。

直接來到Gmail 申請一個，Gmail 的信箱有 7GB，並且持續擴充當中，所以申請一個來也很好用，除了 Blogspot 之外，所有Google提供的服務也都可以透過同一個帳號來使用。進到Gmail首頁之後，點選下面的《申請使用Gmail》。

填寫個人的相關訊息，並選擇想要的帳號。最後則是相關條款，看完之後點下同意就可以。一開始的時候只有一封信，代表帳號已開通。Google 帳號申請完之後，就可以開始建立我們自己專屬的部落格了。

第一步是開通Blogspot

第一步當然是先來到 Blogspot 的首頁。

用剛剛申請到的 Google 帳號登入看看吧。登入後就會出現如下的畫面，申請加入 Blogger。顯示名稱的欄位，就是你的部落格的名稱，這邊可以先取一個喜歡的，中英文都可以，如果不喜歡以後還是可以改。

第二步驟，這邊可以選擇你要的網址(URL)，網址必須是英文，並有Blogspot.com的網域；如果你有專屬自己的網址(idv.tw)，Blogspot 也允許你指定你的網址到 Blogspot 來。

2-1(？)的部份就是選擇面版，在 Blogspot 裡頭稱之為範本，或是 Template。Blogspot 一開始提供了不少的面版可以選擇，我們先選預設的範本好了。

當範本選定了之後，就會出現如下畫面。是的，您的部落格已經準備好了，現在就讓我們開始使用吧！

在電腦的世界當中，只有零和一。而對 BLogspot 來說，沒有文章的部落格，就是零，而零是不會被放在網路上的。所以，在部落格建立好之後的第一件事，就是寫一篇文章。

在編輯的底部，我們可以看到標籤的欄位，這邊就是讓使用者來分類文章的。好的文章分類，可以讓使用者更輕易地了解並閱讀你的部落格，所以這一步不可以偷懶喔。

寫完第一篇文章之後，只要點選發佈文章，就可以讓你的部落格正式上線囉！

Blogspot 網頁元素

Blogspot 的面版，稱之為「範本」，英文為「Templates」。設定Blogspot的範本，我們可以從資訊主頁點選「版面配置」進到管理畫面。

提到的兩個部份「Labels」、「Archives」是網頁元素，更改的方式不一樣，反而比較簡單。我們來到《版面配置》中的《網頁元素》的頁面，就可以看到下面的頁面，這就是整個部落格的配置圖。

把畫面往下拉，我們就可以看到「Labels」、「Archives」這兩個元素。

而要中文化有多簡單？點一下「Labels」元素旁邊的編輯，會跳出一個元素的設定視窗。

將標題的「Labels」改為「標籤」，再按儲存就可以了。同樣的「Blog Achives」改為「網頁存檔」。成功後的網頁配置就會變成如下，可以看出已經變成中文了。

最後的結果是不是全都中文化了呢！範本教學到這邊告一段落！

Blogspot 範本說明

在更改範本之前，先做一次備份是很正確的觀念，這邊我們點選上面的「網頁 HTML」，來到 Html 管理介面。

在這一個頁面，我們可以看到「下載完整範本」的連結。點一下就可以下載並儲存，下載的檔案將會是 .xml 的格式。

備份好了之後，就來挑選新的範本吧。新範本的獲得方式有：1.點選挑選新範本，如果還是祧 Blogspot 提供的範本，就失去了用 Blogspot 的意義了！所以，我們選擇 2. 上網下載網友設計的範本。這邊提供一個範本集散地 btemplates.com，這個網站網羅了網路上幾乎所有網友設計的 Templates，並且幫您以顏色和欄位的不同做區分，讓您在找範本的時候更加容易。

顏色的話，應該不需要多作說明。至於欄位 columns 就要解釋一下了。

在 Blogspot 中，Columns 指的是指 blog 的外觀分割成幾份。像是下面這個就是 1 column 的代表。整個部落格頁面沒有經過分割，標籤等相關資訊則是接在頁面的最下面。

而 2 columns 則是將頁面分割為一大一小的模式。小的部份通常稱之為「sidebar」或「側欄」。下面這個就是 2 columns 代表。

而 3 columns 則比較複雜一點，有單純 3 columns 和複合式的。單純的 3 columns 範本就是將畫面分割為三份，分別為兩小一大。像是下面這個範本。

複合式 3 columns 的範本就像是下面的例子，上頭是 2 columns，但是在 sidebar 的部份則再分割為兩個 columns。

而 4 coulmns 呢？一樣和 3 columns 有均分式和複合式，不過 4 columns 通常除非特殊用途，不然很少用到，這邊就不介紹了，有興趣的朋友可以自己去看看。

ok，繼續我們的下一步動作，要更改 templates，我們先選定下面這個 2 columns 的範本為例。

點選 Download 的圖案，就會跳出下載視窗，這時候選擇儲存。下載後的檔案為通用的 .zip 檔，在 Windows XP 之後的版本都可以直接解壓縮。

解壓縮後會得到兩個檔案，分別是說名檔「readme.txt」和範本檔「Simple-Jojo.xml」。不同範本的 .xml 檔名稱都不一樣，不過在 blogspot 用的範本格式都是 .xml 檔就是。

範本檔案有了，接下來就是要上工了！在上工之前，要再確認一下有沒有備份舊有的範本！

一步步套用新範本

剛剛我們已經選定了範本，並已經準備好了該範本的 xml 檔。現在，來到《修改 html 》的頁面，點選瀏覽電腦裡頭的範本檔。選擇我們剛剛下載的那個 xml 檔案。

上傳完成後會出現提示，表示之前的元件將會被刪除。因為我們的部落格是剛設定好的，所以就算不見了也沒關係。

按下確認之後，範本就會被套用上去了！接下來按下檢視網誌看看結果吧。

很好，面版套用得很好，沒有什麼大問題。目前的問題就只有中文化的問題而已。因為，我們是中文的使用者，當然也要把介面弄成中文，感覺上才會比較友善啊！所以，接下來就來做一些細部調整吧！

我們來看一下剛剛那張圖，先圈出需要中文化的部份：

看來要改的部份還滿多的。先一步一步來，我們先針對上面的「分頁標籤」下手。來到《版面設計》裡頭得《修改html》部份：

點一下 html 程式碼的部份，然後按下 ctrl+F ，或是從瀏覽器上選擇編輯=>尋找。然後輸入我們要中文化的文字「Home」，然後按「下一步」。

這邊就找到了

<li><a expr:href='data:blog.homepageUrl'><span>Home</span></a></li>

而我們要改的，就是把 Home 改成中文的「首頁」。後頭的 Posts RSS、Comments RSS、Edit 也照樣子更改。Post RSS = 「訂閱文章」，Comments RSS = 「訂閱回應」，Edit 的部份，則是範本中讓使用者自定功能的部份。這邊可以先空著，等之後我們加入相本後再回來更改。

這樣上面的分頁部分是不是就變中文啦！但是，文字好像有一點不清處？因為中文和英文的字型本來就會有一點差異，這時候我們再把分頁標籤的字型給加大一點。所以我們找程式碼關於分頁標籤的 CSS ，通常分頁標籤的部份都會歸在 Main Menu 裡頭，而分頁標籤的程式是被 <li></li> 給包住，所以我們要修改的 CSS 將會是在 Main Menu 中的 li 設定。這邊我們將 font-size 的選項設定為 15px; 就是將字型大小設定為 15 px 的意思。

更改完之後，先不要儲存，按下預覽來看一下效果吧！字是不是變得比較大，比較方便瀏覽了呢？這時候，我們就可以按下儲存了。

再來我們要更改的部份，就是側欄 sidebar 當中，有一堆看不懂的字。
修改方法與分頁一樣，我們先搜尋框框內的字。
再將裡面改成你想要的文字。這邊我把它改成「Noid 推廣 Blogspot 的網站，這邊有盡可能詳細的教學，讓你慢慢一步一步，學習如何在 Blogspot 建立一個有聲有色與眾不同的部落格。老話還是一句，師父領進門，修行就要靠個人了。善用 Google，你也能擁有更有特色的部落格！」

寫好後，一樣先預覽過，沒問題就可以儲存範本囉。接下來看看還有什麼地方要中文化的吧。
剩下的就是 sidebar 的 Labels 和 Archives 了，這部份是屬於元件的部份，在下一個章節我們再介紹喔！

Blogspot 後台管理系統

在部落格開通之後，再來就是要先講解一下 Blogspot 的後台系統。這邊先只針對系統做介紹，並不會更改任何設定。其實 Blogspot 預設的設定就已經沒什麼問題了，所以，不想看這個章節的人也可以跳過。

一個Google 帳號可以擁有多個 Blog，而且全都可以在自己的後台看到並管理。這一頁，就叫《資訊首業》當你從 Blogspot 首頁登入的時候，就是會先進來這一頁。

選定想要管裡的部落格，再點選設定，就會進到如下的畫面。《基本》的頁面，就是這個部落格的基本設定，包括部落格名稱、介紹、是否列入 Blogspot 清單、開放搜尋、快速編輯、開放遊客傳送文章連結、有沒有成人內容(羞)、使用Rich text 編輯模式、開放音譯這幾個設定。

設定的第二頁則是《發佈》的部份，這邊可以更改你的網址。如果你對目前的網址不滿意，就可以在這邊更改。不過如果在後期才更改，可以會造成訪客的流失，這點要注意喔。
第三個設定就是《格式》的部分。這邊主要會更動到的設定大概就只有首頁顯示幾篇文章這個設定而已。其他的時間格式就照個人喜好。

《格式》下頭的《文章範本》則是以後在新增文章時會自動填入文章的內容，不過之後我們會教如何使用更方便的方法來發佈文章，這個部份就先留白吧。

下一個設定則是《回應》。這邊設定的就是訪客留言的設定、審核、檢查碼之類的設定。

《存檔》設定，就是網頁存檔的頻率，預設的每月就可以。至於文章網頁的設定，就是讓每篇文章有自己的網址(.html)這個設定保留「是」就可以。

《網站提供》設定的就是所謂的 RSS。這部份的設定也沒有需要改變。

《以電子郵件傳送》設定以電子郵件的方式發表文章，對於出外辦公不方便登入 blogspot 編輯文章的人特別有用。

《OpenID》因為不同的網站總是要申請一個帳號，久而久之，太多帳號連自己的記不住。所以，就出現了所謂的 OpenID，一個 ID 可以用在許多網站。這部份也不用更改。

《權限》Blogspot 的部落格，也可以是共筆的型式，允許多位作者共同編輯和經營一個部落格。

介紹完了部落格設定之後，就是要進入範本改造的部份了。

計數器

再來，我們來談談計數器的功能。這個功能說大不大，說小不小。有的人的部落格裡頭也沒有訪客計數器這個東西。但是，對於經營一個部落格來說，是不是有訪客進來，以及訪客來訪的數量，也可以做為調整部落格內容的一個參考。

好的，這次我們要用的計數器是由 sitmeter 這個網站所提供的免費計數器。sitemeter 提供的計數器有什麼好呢？第一點，當然就是因為它是免費的 (哈！) 。第二點，就算是免費帳號，它也會在每個星期寄一封信給你，告訴你這個星期有多少人來參觀了你的部落格，平均停留的時間有多久。雖然是沒 Google Analytics 那麼詳細的分析，但也是夠用了。

首先，我們來到 sitemeter 的首頁。在首頁我們可以看到一個抖大的字樣“FREE！”，免費，那就是我們要的，把它點下去。

點下去之後，為了安全起見，sitemeter 還是會再跟你確認一次你要申請的服務是免費的還是付費的？這時候就不要跟它客氣了，點下在“FREE！”旁邊的 SIGN UP！(註冊)

註冊的第一步，就是填寫你的網站的相關資料。我知道，英文有點惱人，所以我幫大家翻譯好了。

網站資料填寫完之後，就是管理者的個人資料的部分了。性別的部份居然有滾軸可以向下？

上面的資料都填好了，就會來到最後確認的頁面。

確認資料都沒問題之後，就可以按下一步，完成註冊。下面這個就是完成頁面。完成了之後，我們馬上進入管理介面(manager)設定一下我們的計數器。

後台的部份，先選擇計數器的樣式。點選一旁的 “meter style”，這邊就可以選則計數器的樣式。我知道，選擇不是很多，但是，功能好最重要，不是嗎？

選好了之後，拉下來點選“select” 表示已確定。再來就是拿取程式碼，點選側欄的“HTML code”項目，就會來到第二張圖的網頁。
這邊的 Site Meter JavaScript HTML 就是我們要的東西，把〈！—Site Meter -- 〉為開頭的程式碼全部複製起來。
再來回到我們部落格的後台，進到《版面配置》裡頭的《網頁元素》，計數器一般都是加在側欄的部份，所以我們在側欄的地方點一下《新增小工具》。

點選《新增小工具》之後，會跳出一個視窗，讓你選擇所需要的工具。這邊我們需要新增的工具是《HTML/JavaScript》，所以就在那個項目旁點下加號《+》。

隨著點選《+》，新增小工具的視窗會關閉，並出現該新增工具的詳細設定。這邊我們就打上“計數器”，再把剛剛從 sitemeter 上複製的程式碼貼到“內容”的部份。然後按下《儲存》。