發表文章

目前顯示的是有「Template」標籤的文章

#Blogger 推出新的版面佈景主題

圖片
新的四種樣板x五種配色=二十種預設供選擇 這次的配色跟比例更有文青風 Blogger 自上次改版後 (可能是 2012 了吧?) 隔了這麼多年,在今年終於又開始動了起來,年初先是後台做了一些變革,包括後臺網頁架構的改變、更完整的樣版編輯畫面、新的 widget 設定畫面等等,這個禮拜則推出了新的樣板與配色供使用者選用。 新的樣板將預設幾個常用的 widget 在版面上,使用者只要需要啟動或隱藏就可以進行操作 (而非以往的移除) ,並且重新規劃擺放 Google 廣告的新位置,新的樣板依舊是利用原有 Blogger Template 既有的功再做發揮,喜愛編輯樣板的使用者也可以從樣板的原始碼內參考一些設定方法。 Blogger 會在近期又開始有所更新動作,我猜是 Google 大概發現社群力已經瀕臨飽和了,新的社交平台、媒體平台像是 Snapchat 或是 Medium 開始從臉書內拉出社群人口,無意義的分享行為一旦開始剝奪社群內容流的版面,就更需要外界平台灌輸內容才可以,也因此才會有那麼多真假難辨的農場文章或是川普所說的假新聞在臉書上流竄, Google 有這麼好的內容平台不繼續維護與使用,而把人力抽去做 Google Plus 的確有些不智,但現在重新重視 Blogger 的地位,其實也還不晚啦。

[Draft] Blogger Template Designer 範本設計工具現身

圖片
啊啊啊... Blogger 終於重新研究整個範本系統,重新設計了 Blogger Template Designer 範本設計工具,使用者終於可以「無痛」設計自己想要的範本了: 幾個重點: 全新的範本挑選系統:專業設計師的作品,就是不一樣! 版面配置:什麼二欄、三欄、複合欄位通通都可以自訂了,連下方頁尾欄位都可以改成二欄三欄等等,隨心所欲,還可以更改最令人詬病的寬度,最寬到 1000px ,並且可以自行修改邊欄的寬度; 更換背景:上千張精美圖片動個手就可以立即更換,並且有妥善的分類易於找圖; 進階修改:直接修改字型、字級大小、連結顏色等等,並且可以加入自訂的 CSS 喔! 只要進入 Blogger Draft ( Blogger 測試區)就可以想用這個新工具了,但是不支援 IE6 囉!!(恭喜恭喜) 而之前製作的範本竟然也可以無痛轉移,所以 metalife 就毫無自尊的直接換過去了...效果還真不錯~(遮臉) Blogger 現在支援首頁摘要的設定,如今又有功能強大的範本設計工具,這裡所製作的範本應該就可以功成身退了吧?嘶...

Blogger Template Gadget 3.0.1 特化版(2009-08-05 更新)

圖片
弄了幾天, Blogger Template Gadget 3 似乎已經有了一個樣子,應該可以丟出來了。 之前的 Gadget 2.0 其實有點惡搞,因為當時 Blogger 多了不少新功能,所以很匆忙的情況下弄了一個有 Hack 又符合原本 Blogger 附加功能的版本,但是內部很多原始碼與設定的部份並沒有真的很認真去處理,就是眼睛上看到覺得可以了,就輕輕蔡蔡丟出來了,後來自己在套別站的時候,覺得一些沒沒角角問題還不少,但是通常就眼睛一閉、兩手握拳,也就讓它過去了... 之前想到 關於模板兩三事 之後,就覺得應該要在弄個版本出來,而 Blogger 功能大多都已經很成熟了,也不用在搞一些有的沒的 Hack ,所以這幾天就很認真的把 Gadget 這個模板整理了一下,終於有了個樣子。 仔細看看上圖,是在 IE 8 裡面的情況,看起來好像很普通,也好像跟 Gadget 2 差不多,好像跟 Gadget 1 也一樣?(連續三個好像...(汗)),但是,似乎又有點不同吧? 如果改用 Firefox / Google Chrome / Safari 開啟套用這個範本的 Blog ,會得到下面這樣的效果: ㄟ~有導角耶... 既然 Webkit 跟 Mozilla 核心都提供了這些方便的 CSS 設定,不用白不用,況且連背景圖片之類的都省了,還不錯,順便把 Gadget 2 中沒有處理好得間距問題給弄了一下,並且套用了 Yahoo Lab 的 CSS Reset ,整體看起來似乎一致性比較好了吧?? 跟以往一樣,各區塊、文字、顏色等等設定都是可以在版面配置當中自行設定的: 其中說明文字跟參數對應的部份花了不少時間...希望使用者能夠更容易理解一些; 既然說是特化版,當然是要有隱藏功能才算是特化版...首先呢...看一下平淡無奇的網頁開頭部份: 接著呢,來去新增一個連結小工具,就新增自己想要增加的網址: 一般這種連結元件都是放在 Sidebar 內居多: 把這個連結元件拖到 Page Title 的上方去: 儲存後回頭重新整理網頁,看看網頁的頁首部份: 嗯,有標籤選單了...好像沒有很特殊吼?而這個 TAB 標籤頁的背景色、滑鼠選擇變色、文字顏色、連結顏色都可以在版面配置當中字型與顏色內自行設定,這樣有沒有算特殊...

版面範本檔案搬遷至新地點

怕 Google Pages 一關門,檔案全都付諸流水,目前已經將所有的檔案進行備份,並且將原本版面範本檔案移到新的地點存放,目前已經可以下載之前放出的版面範本,像是 Murmur 、 Gadget 、 BlackCat 、 BlackCoffee 等等,連說明文字也一併搬過去了,下載檔案請轉往此處下載: Blogger Templates :  http://place.metamuse.net/blogger-templates 這個地方是用 Google Sites 功能建立起來的,檔案陸陸續續會放上去,目前已經開始構想修改 Gadget 一些細微的設定,以後說不定會統一把 css 放在 Google Sites 當中進行更新,不過要把 css 拆內存與外部連結有點小麻煩說...

2009 新裝上市 [ CSS Reload ] White Coffee

新的 CSS 終於上線,目前還有部份內容在微調當中,細節也還要慢慢修正,有些自己看了還不是很順眼的地方,原本的 NE 系列是走大氣大字,這次則想以「精準」與「細巧」為主。東西慢慢添加吧...吁~

Blogger Template Murmur for MicroBlog

圖片
Download Murmur-2008-01-22.xml DEMO 參考網頁 釋出前的廢話: 喜歡用 Twitter 嗎?其實 Blogger 也可以 Twitter。 去年比較受到網友討論的,大概就是一堆號稱「微型 Blog」(microBlog)的興起,像是 jaiku 、 Twitter 、或是台灣的 buboo ,這種微型 Blog 滿足了一些使用者想要記事、不太需寫長篇文章、同時又不想要複雜的功能,簡單上手立即使用成了一種潮流,很多人也像警醒一般「啊!我應該要寫個微型 Blog」而開始寫微型 Blog。這種說法或想法好像有點奇怪,因為 Blog 並不會因為沒有註明任何型就一定要寫的很「巨型」或「一般大小」,但是一旦有人喊「微型」,就會有很多人一起喊「微型」,在人類的生活體驗當中,這種不經思考就跟隨某些行銷手法過生活,實在是相當奇妙的一件事情。 Twitter 有很多的特點,像是可以 follow 別人的 log 形成類似對話的效果,或是經由手機、IM 等軟體立即傳出一些短文;不過只要仔細看一下發文方式,在中文的使用者當中最多人使用的方法依然是透過瀏覽器登入後發文,某些則 藉由 Firefox 的 Addons 來發話 (中文版的抄襲翻譯文就不放了,自己上網搜尋一下就有),某些則透過 IM,一旦想要寫稍微長一點點點點的東西,可能就因為字數限制而必須分成數小篇來完成。 這些特色在 Blogger 上當然也可以模仿 部份的效果 ,必須透過一些「手工」來製作,同時也要先要有個對應的模板範本,看起來至少有模有樣一點。 1.微型 Blog 的部份只要使用者寫的夠短、夠精簡, Blogger 同樣是一個微型 Blog ,不過既然要針對短文(甚至是極短文)而來,文章自然就以單欄為主體設計,但是 Blogger 要丟連結、文章、短片、音樂mp3 樣樣都可,底下的邊欄功能列當然也看自己愛用不用,相較之下其他微型 Blog 的「個性化」、「特色化」的能力就差多了; 2.要透過瀏覽器(Firefox 流)在 Blogger 上發極短文,Blogger 能用的可多了,熱門的像是 ScribeFire 就是個好選擇,要用 Windows Live Writer 也可以,Flickr 與 YouTube 都支援發文到 Blogger 當中,工具可說是滿坑滿谷多到不行; 3.在台...

Blogger Template BlackCoffee

圖片
in IE6 in Firefox Download BlackCoffee-2008-01-18.xml | DEMO 參考網頁 釋出前的廢話: BlackCoffee 的版型是我一直想要做的,這也是最近常見的版型之一,左邊主文快與右邊 Sidebar 齊高,而 Title 中如果放入背景圖片又感覺相當有主題性,所以就把 gadget 2.0 拿來修改成 BlackCoffee (Sidebar 看起來不就像背耳一樣嗎?XD)特色跟其他版型大同小異,有興趣者可以直接下載後套用即可,有興趣的可以直接繼續看下去。 PS:template 是不會影響任何 PO 文的,因為 PO 文是後台或其他發文程式與資料庫之間事情,跟 template 無關。 主要 BlackCoffee 特色說明: 雖然 1024*768/1280*800 以上解析度已經逐漸成為主流,但是這一次把版面調整到 855 px 寬度,讓整體看起來較為細長,也較為有氣質一點(XD),主文的部分依然擁有 500 px 的寬度,嵌入 flickr 圖片或是其他影音內容應該不會有什麼問題。 右邊兩欄都是一欄 125px,一欄 165px ,對於多數網站外掛或像是 Google AdSense 摩天大樓型式欄位等廣告都應該很好處理與應用。 標題區塊直接支援 Blogger 後台直接設定 Title 背景圖片的功能,但是因為抓圖順序抓錯,這是沒有圖片時的情況,整個 Title 變成較為細長,看起來有沒有氣質啊?(屋喔~)標題區塊的預設高度會隨著圖片高度產生改變,使用者只要掌握好圖片的 寬度(520px 以上)與高度(450px 以上) ,即可放入自己喜愛的圖片當成標題背景,效果如前面幾張圖那樣子,應該頗有焦點(依據原始的 Widget 設定,圖片現在是置中排列,需要自行設定 CSS 才可以讓它重複填滿)。 這是範本內說明: Show image as background to text. You can't really calculate the width reliably in JS because margins are not taken into account by any of clientWidth, offsetWidth or scrollWidth, so we don...

Blogger Template BlackCat 2.5.0 (3 Columns)

圖片
in IE7 in Firefox Download BlackCat25-2008-01-15.xml | DEMO 參考網頁 釋出前的廢話: BlackCat 這個網頁範本受到相當多人的喜愛,或許是因為在 Blogger 中真的缺少三欄式的範本,不過使用這個範本的 Blogger 很多都喜歡下載無 Hack 的版本,或許是因為這樣比較好操作,也能夠在中間的部份顯示更多的內容;這個範本也受到公益團體的喜愛,所以我在年度更新之際把 BlackCat 做了一次大幅的翻修,希望能夠讓更多人能更容易上手,讓他們能夠專注在議題上,而不是在跟 Blogger Code 分站上,邁向 2.5.0 吧,go! 主要 BlackCat 2.5.0 特色說明: 在 1024*768/1280*800 以上解析度已經逐漸成為主流的年代,這一次把版面整體拉寬到 910 px,主文的部分擁有 500 px 的寬度,從 flickr 相簿或是其他相簿服務所提供的照片嵌入,不再是問題。 左右兩欄都是 170 px ,可用來安排 Google AdSense 120*600 與 160*600 摩天大樓型式的廣告欄位,讓整體有更好的運用。 標題區塊直接支援 Blogger 後台直接設定 Title 背景圖片的功能,標題區塊的預設高度會隨著圖片高度產生改變,使用者只要掌握好圖片的 寬度(910px)與高度(150px~160px) 即可放入自己喜愛的圖片當成標題背景(依據原始的 Widget 設定,圖片一定是靠左排列,需要自行設定 CSS 才可以讓他重複填滿)。 文章之間直接支援 Blogger 中 Google AdSense 的相關設定,現在要在文章之間插入 Google AdSense 的廣告欄位,使用者不用再費心於原始碼中尋找安插廣告欄位的位置,讓網站的廣告效果更好。在主文底下也可以加入其他的網頁元素,增添豐富度。 修正相當多的部分,現在幾乎所有網頁上的各種區塊與顏色都可以透過後台「顏色與字型」的頁面進行調整,像是 link 的顏色、整體背景顏色,不用因為佈景主題較為單純,設定功能並沒有像 Gadget 2.0 這麼複雜多項,使用者不用再與不熟悉的CSS繼續奮戰(但是要更改背景圖片、調整特定區塊文字大小等,還是得自行透過CSS進行設定,這個功能的目的方便一些整體概觀的調整而已)。所...

Blogger Template : Gadget 2.0

圖片
in IE in FIREFOX 下載 Gadget20-2008-01-15.xml | DEMO 參考網頁 釋出前的廢話: 上次製作 Gadget 1.0 已經是一年前的事情了,在這段時間內 Blogger 發表了許多新的功能,同時也更新了許多 template 中的範本功能,Gadget 1.0 原本就有著一些小毛病,起因除了當初釋出時沒有經過長時間的 Beta,也有一些是 Blogger 更新語法或提供新功能產生的,也常常造成許多使用 Gadget 1.0 的網友有很多意料中的問題,雖然有很多同好陸續在更新 Blogger 範本功能的解說,也提供了許多心得分享與更錯,但是並未整合在同一個範本當中,在經過一年之後,決定來一次完整的升級。 2008 年全球環保意識將會急速升高,綠色議題將會是全球關注的重點,這次 Gadget 2.0 就以綠色當作主要的色彩設定做釋出,網路使用者依然可以依照自己的喜好自行更換顏色設定(之後會進行說明)。(全文圖多且不小喔...) 主要 Gadget 2.0 特色說明: 在 1024*768/1280*800 以上解析度已經逐漸成為主流的年代,這一次把版面整體拉寬到 900 px,主文的部分擁有 550 px 的寬度,不論是 flickr 相簿或是其他相簿服務所提供的照片嵌入,應該不再是問題。 右邊欄位維持在 310px ,符合 Google Adsense 廣告版面大版面的需求,底下兩欄分別為 120 px 與 175 px ,亦可用來安排 Google AdSense 120*600 與 160*600 摩天大樓型式的廣告欄位,最後依據一些網友的需求收為一個欄位,讓整體有更好的運用。 近來有不少網路使用者喜愛偏三欄(左一大右二小)的版面設計,這次 Gadget 2.0 大幅修改這方面的 CSS 設定,只要使用者在最上方一欄內不放入任何網頁元素,就可以擁有與偏三欄一模一樣的效果。 標題區塊直接支援 Blogger 後台直接設定 Title 背景圖片的功能,標題區塊的預設高度會隨著圖片高度產生改變,使用者只要掌握好圖片的 寬度(900px)與高度(120px) 即可放入自己喜愛的圖片當成標題背景。 文章之間直接支援 Blogger 中 Google AdSense 的相關設定,現在要在文章之間插入 Google AdSense...