20160617-幫blog換新裝

其實本來沒有想要換裝，畢竟最新的一篇文章都已經是去年的事情，實在有點懶惰。上週朋友問我可不可以教他們用wordpress，於是我研究了一下wordpress，抓下來安裝，發現他的佈景主題資源，實在是天殺的多！隨便弄幾篇簡單的去套不同版預覽就玩的不亦樂乎。差一點就想把自己blog平台換成wordpress。反正我有在公司架個站，還有固定ip和dns，可以偷架自己blog。不過想到永續性，萬一離職就麻煩。於是乎，我就想回來自己的blog能不能也這樣套。

blogger套版方式也不難，但跟wordpress整合性比起來是差了一點。首先當然去google一下：blogger template。就會找到非常多的資源。我先前在wordpress上頭玩了一下，發現兩欄式的版面很清新，簡單，所以我就找一些這樣的版型試試。這種版型非常適合相片多，因為看起來很像藝廊，所以我未來會把blog放多點相片。

blogger的版型，下載回來都是xml檔案格式，沒法從後台直接看到預覽，所以在web上看一下別人效果，確定喜歡選好版型之後，下載回來。套用之前先去把先前的備份。步驟就像圖上面的一樣：進去後台之後，先點選「範本」，再點選「備份還原」，會跳出一個對話框，然後按「下載完整範本」，可以把你原先的範本給備份下來，萬一覺得不適合還可以還原回去。最後選擇剛剛下載回來的範本檔案，上傳。到此基本的就完成了。

最後我選擇一個稱作「hellya」的版型。版型的原畫面長這樣：

接著我們要對範本做修改，我就以這範本為例，其實應該大同小異，只要你稍微有一點網頁語法的概念就好。一樣回到剛剛的範本這一頁，然後在範本的網誌即時狀態上有「編輯HTML」按鈕，按下去就對了，這時候會帶出這個範本的原始碼。當然你也可以在UltraEdit那種編輯器上編輯，只是我想要一邊改一邊看效果（其實是對html語法不熟）。像我的例子，就改了以下的地方：

1. 上方的facebook，twitter，mail等那些按鈕拿掉
我想讓畫面乾淨一點 ，想用的人留著，然後link改成自己的社群網址就好。找到「<ul class='nav  site-header__menu'>」 字串，然後把整段tag標注起來或拿掉。下面footer地方也類似，拿掉
2. logo換成自己的
在上面替換的地方，附近很明顯看到「site-logo site-logo--image」的tag，這邊就是上方logo，把圖片和預設字都改好。自己做了一個logo，而青蛙圖則是上網抓的
3. menu連結改成到分類
搜尋「<a href='#'>+ DROPDOWN</a>」會發現他就是一個menu選單，改成你要的文字，像我改成分類，和blogger建立時一樣，blogger會將分類變成子連結，所以可以抓出每個分類的超連結，然後自行填入「href=」後面就可以了。
4. footer的google bar拿掉
把這個樣板xml載入之後，會發現blogger會幫你加上一些原先該有的導覽列，我也想拿掉，於是搜尋其他小工具所在位置，找到相對應位置，整段拿掉。

大概就是這樣子，喔對！別忘記「儲存範本」。