2008年5月29日 星期四

試用WordPress官方提供免費部落格


綸太郎在Google Blogger開部落格也滿1年了,基本上的功能都已經學會,改版面也比較進入情況,所以覺得將自己摸索的過程化為文字分享,是個很好的部落格主題,但隨著自己漸漸成長的同時,覺得可以分享給網友的新東西越來越少,於是我想0與1謎詭世界未來針對blogspot.com的實作心得分享,更新的速度可能就會比較慢,要進入另一個階段的學習。

2008年5月25日 星期日

幫邊欄的網頁元素(widget),自訂不同的漂亮圖示

每次看到自己的邊欄(網頁元素)都只有標題文字,有時候會加上背景顏色或是加框線,但總覺得有點單調,想起前陣子BlogU有教到「Unique Background Images for Widgets」,幫你的網頁元素加上獨特的背景,於是這次改版我就套用這個方法,將自己的網頁標題加上獨特的ICON,請注意,是每個網頁元素都用不一樣的圖示,而非在邊欄的標題列設定共同的圖樣,如下圖顯示。


如果統一在邊欄的widget加上圖樣,應該很多人都會了,就是找到
* Sidebar Content這一區塊,有的模板可能沒有特別標明,就是定義sidebar區塊這段的程式碼,如果真的找不到可以留言給我,我再幫你找。

通常這個定義名稱會是 #sidebar h2 {
h2代表標題,而有的可能會有#sidebar1、#sidebar2甚至#sidebar3,你都可以分別為這些區塊定義不同的背景圖片,加入的語法如下:
Background:#背景色6碼 url('圖片網址') no-repeat;
記得調整你的margin及padding來配合你的圖示。

而要將每個邊欄標題都設不同的背景圖樣,有一個不方便的地方就是,每次刪除網頁元素都會影響他的定義與template,如果你是常修改邊欄的版主,我想自己使用上要費心點。

譬如我新增了一個html/script的網頁元素,標題命名為「隨機文章」,產生後你可以到你的模板裡去找這個元素的程式碼,按下ctrl+F5,會跑出尋找的選項框,輸入'隨機文章',就可以找到這段語法,如下圖


你可以看到隨機文章的定義值為 id='HTML9',這就是我們要的東西,然後在sidebar的定義區塊新增一個名稱為HTML9的描述即可,語法如下:

#HTML9{
margin:0;
background:url('圖片網址') no-repeat;
}

如下圖 ,

這個定義視你新增的網頁元素為何,如果是html/script語法,就是以HTML為名#HTML1,如果是新增連結則是以#LinkList1,而新增文字則視 #Text1,新增索引就是# BlogArchive1等等,不同型態的網頁元素,名稱都不一。

注意事項:
‧ 新增的HTML文字大小寫要一樣,例如#HTML9就不能用#html9,這樣系統會找不到。
‧ 如果把這項隨機文章Widget拿掉了,記得#HTML9這個相對定義也要拿掉,不然儲存樣版時有時會出現錯誤,或是有時你後來新增的元素會套用這個背景圖示。
‧ 如果有套用摺疊標題Hacks的可能就不適用了,因為我自己也沒使用這Hacks,所以不知結果如何。


我用的圖示ICON是20px*20px的GIF透明圖,可以套用在各種背景顏色,因為考慮到IE6對PNG的支援性不足,以後改版完成應該會改成PNG檔,其實如果可以的話,建議使用PNG圖,會比較漂亮,不會出現鋸齒狀。

另外的邊欄的標題文字 #sidebar1 h2,我就會調整為
padding: 0px 0 0 25px; (距離左邊25px,因為我的圖示20px,中間有5px的間距看起來比較美觀)
text-align: left; (靠左邊)

這些可以視你自己的模板配置再作調整,當然你也可以幫整個widget弄個背景圖,我的方法是只有在標題欄位,也可以用個較大的圖,像下圖這樣,不過自己要把位置調得漂亮就是了。


其實一路走來Blogger的自由度真的很高,只是都要慢慢努力,今天能夠這樣改版面,也只是從基礎慢慢磨練的,也感謝很多網路上的高手,改版不用急,常常改就知道訣竅在哪裡,而且切記一定要備份,多看些Css語法的書籍或是參考網路上的資料,都是對改版有幫助的,而且從中學到的也都是自己的,如果不熟語法,弄個簡單清爽有基礎功能的網誌也能快快樂樂的寫部落格的。

2008.6.8更新
感謝純白色-龍,網友提供邊欄標題加上圖示的方法,因為綸太郎寫的是在單獨的網頁元素加上背景圖片,如果想單獨為網頁元素的標題欄加上圖片,可以多加下列語法
#元素定義名稱 h2{
background: url('圖片網址') no-repeat;
}


參考來源:
BlogU:Unique Background Images for Widgets

延伸閱讀:
Abin's Tech Note: 在版面格式中放入小圖示
WEB2.0 立體 icon 圖案蒐集

2008年5月24日 星期六

FeedBurner訂閱Blogger文章,摘要輸出RSS

之前綸太郎是使用Google Blogger官方的訂閱系統,也就是如下列格式
http://01mistery.blogspot.com/feeds/posts/default
後來申請了FeedBurner服務,燒了一個永久網址,雖然訂閱人數有逐漸增加,但是有一個地方自己一直沒有辦法解決,就是我的網站提供設定允許網誌資訊提供"簡短"輸出,但是在申請FeedBurner之後,我發現Google Reader所出現的新文章,都只有標題,如下圖,


雖然也可以設定完整,也就是全文輸出,但我並不喜歡全文輸出,因為我的文章大部分都很長而且有圖,感覺很佔閱讀器的空間,尤其訂閱了一堆RSS,碰到沒有興趣的文章,滑鼠要一直拉到下方,感覺有點累,考量到應該也有和我同樣想法的網友,所以一直沒有改過來,但總覺得是個懸而未決的問題,趁這次改版也好好的研究了一下,我知道全文輸出時,後面要加上full,我想應該是FeedBurner的問題,於是自己測試看看,發現真的成功了,有了摘要的簡短輸出。

其實這是土方法,後來發現FeedBurner已經有了這個設定(下面有介紹),是我自己不知道,其實很多工具我都只知道皮毛,而未深入骨隨,真是糟糕,尤其是英文的工具。

我自己研究的土方法就是,進入Edit Feed Details單元,在Original Feed改資訊提供的網址為 http://01mistery.blogspot.com/feeds/posts/summary
將原先的default改成summary,然後按下「Save Feed Details」就成功了。

不過這個方式,按下RSS按鈕是立刻就呈現摘要的文章,但Google Reader的改變並非立即,還是呈現只有標題的狀態,要等一陣子才會改成功,像我的0與1謎詭世界差不多花了10分鐘,才有摘要輸出,而東京封印則費時較久才改過。

◎重要的及正確的方法在下面◎

接下來才是FeedBurner的正統方式,進入Optimize,選擇左欄下方的「Summary Burner」,就會出現右邊的方塊區,數字部分是你要顯示的本文字數,而下方可輸入在你的FeedBurner每篇文章下方的文字敘述,輸入中文沒效會變成一堆問號,只能輸入英文,例如我輸入的是:Read More….. http://01mistery.blogspot.com/或是空白也行,最後按下「Activate」,就可啟動這項服務了,


不過這部分在Google Reader閱讀器裡並不會立刻顯示出來,還是要等一下子。於是我的FeedBurner終於出現了摘要文字,萬歲!

2008年5月23日 星期五

在文章下方放置訂閱RSS的文字敘述

網路資源何其多,現在很多人都習慣用Rss來訂閱自己有興趣的文章,如果能讓自己的訂閱人數增加,相對也會提高網站的流量,我想大部分的版主都願意看到自己的來訪人數及訂閱量增加,不僅是對自己的肯定也是促進自己寫文章的動力,綸太郎自從幫自己的Rss燒了個FeedBurner的網址,目前Rss的訂閱數每天都有穩定的成長。

如何增加訂閱,除了在部落格醒目的地方加上訂閱標誌,配合網路上可使用的各種Rss Icon資源增加其活潑性,讓網友一進網站就可以迅速找到訂閱的按鈕是必要的,目前我改版後新增的項目就是在每篇文章最後加上訂閱的文字敘述,其實一直想這麼做,常常看獨立架站的部落格有這個配置,我知道利用一些部落格寫作工具也可新增這項目,但是總覺得太繁瑣,而且通常是英文的,一堆網址連結堆積在文章頁尾,以我自己的瀏覽習慣,我很少會去看這部分,也覺得對中文環境的使用者,倒不如用一個簡潔有力的敘述,告訴網友如果喜歡自己的文章,按下按鈕就可訂閱。

這部分我是參考將Not My Business: Google AdSense只顯示在單篇文章裡 for Blogger的類似做法,不在首頁顯示,自己研究了一下,並參考網路上的語法把他做出來,目前使用上是沒有什麼問題,作法如下:

2008.9.23更新,這個語法不明原因的出錯,造成元件顯示一半,查出原因,我想應該是這個變數subscribe,被Blogger官方使用了,所以不行用,會跑出官方預設的格式,用個其他名稱就行了,我把它改成subscribe2,當然下方HTML處也要修正為subscribe2。

新增一個元件定義,可以自行設定,我是以Subscribe2定義Rss敘述的單元,你可自設名稱,記住Subscribe已經不能使用了(2008.9.23失效,我猜是被官方拿去用了)

更改前記得備份原始模板

將以下程式碼加到post-footer這塊區域,(圖片裡的subscribe應該為subscribe2)

這是橘色版本的語法

.subscribe2 {
background:#FCF4DF url('圖片網址') no-repeat 30px;
text-align:center;
border-bottom:2px solid #FF8928;
border-top:2px solid #FF8928;
margin:10px 0 0 0;
padding:5px 20px 5px 40px;
}

說明如下圖,(圖片裡的subscribe應該為subscribe2)

這是藍色版本的樣子

語法如下,
.subscribe2 {
margin:10px 0 0 0;
padding:5px 20px 5px 40px;
background:#ECF6F9 url('圖片網址’) no-repeat 50px;
text-align:center;
border-bottom:2px solid #80C0D8;
border-top:2px solid #80C0D8;
}


記得展開小裝置範本,將這段敘述加在<div class='post-footer'>之前
<div align='left'>
<b:if cond='data:blog.pageType == "item"'>
<div class='subscribe2'><a href='http://feeds.feedburner.com/lun01' title='訂閱0與1謎詭世界'>如果覺得本文對您有幫助,歡迎訂閱RSS Feed</a></div>
</b:if>
</div>

這樣便完成了,如下圖(圖片裡的subscribe應該為subscribe2)


其中,綠色的網址要改成你的訂閱網址,
如果覺得本文對您有幫助,歡迎訂閱RSS Feed」,則可以自己添加你想要的文字敘述,title則是滑鼠停在上面顯示的文字。

而圖片部分我是使用Zeusbox Studio » blog,或是參考下面提供的網路資源,選擇你喜歡的圖樣,下載到自己的空間即可使用。

其實從5月18日FeedBurner原本的訂閱人數是157個人,到5月22日是173人,我想放置這個訂閱的文字敘述還是可以提醒網友訂閱,看到文章覺得不錯時,順手就可以訂閱你的網站,增加你的訂閱數這也是個不錯的方法。



參考來源:
Not My Business:Google AdSense只顯示在單篇文章裡 for Blogger
增加订阅数的8个方法 后80花园
Free of charge RSS Feed Icons « ² Malevi4a

2008年5月20日 星期二

0與1謎詭世界文章索引列表

這是0與1謎詭世界全部文章列表,應該會陸續增加,列出全部文章,也方便自己與有需要的網友索引,目前以文章分類的方式列出,將會不定期更新。

最新文章列表,依日期及文章分類,即時版請見此篇

Facebook,分享申請Facebook的心得與使用方法
利用My Tab幫粉絲專頁做個歡迎頁面,加強宣傳效果
如何利用Facebook粉絲專頁與網友交流,宣傳你的部落格
Facebook share counter button推文計數按鈕如何安裝
如何利用FACEBOOK的Social plugins製作部落格的動態留言板--Live Stream篇
如何利用FACEBOOK的Social plugins製作部落格的留言板--fb:comments篇
Facebook 摘文與 meta content的關係
如何利用Facebook帳號製作部落格的留言板---安裝篇
如何利用Facebook帳號製作部落格的留言板---API金鑰申請篇(Blogger系統用)
用FBML工具來製作你的Facebook粉絲歡迎頁面---多媒體篇
用FBML工具來製作你的Facebook粉絲歡迎頁面---撰寫篇
用FBML工具來製作你的Facebook粉絲歡迎頁面---安裝篇
終於申請超火的Facebook‧粉絲募集中

Blogger Templates---模板資源,介紹自己在網路上蒐集到的模板資源,這些我大部分都有試用過,適合新版的blogger使用。
Blogger最新推出的超炫動態檢視功能(Dynamic Views)
新版Blogger範本設計工具正式啟用
試用 Blogger 新版範本設計工具改版心得
驚為天人的Blogger templates官方模版終於測試推出
利用部落格來架設屬於自己的書籤資料庫網站---介紹篇
藝廊式的部落格模板(Blogger templates)
Blogger和WordPress兩相宜的模板資源---WP Blogger Themes
Blogger Templates│2009年最新模板資源
模板templates的背景與標題列圖庫網站
更換新模板時發生bX-sftlmn│bX-9281o1o│bX-bliced的錯誤訊息
兩欄式簡潔的模板Flashyweb ---改版分享
Blogger template模板教學課程---如何修改有廣告的模板
Blooogger---Templates Search Engine
超酷的模板---Jeans牛仔褲template
101個傑出的templates模板---Blogger Buster
簡潔的B-themes模板
70多種模板任你挑選---Blogcrowds
Blog and Web進階級模板介紹
Charm Skins Templates 我使用的模板
修正Dzelque templates適合IE使用
功能型的blogger templates:Blogger Buster提供
Magical Template神奇的模板---來自哈利波特的靈感
黑色迷幻與魅惑的blogger templates 模板
Blogger template 超漂亮的模板
New blogger template---多國語言版的模板網站
Blogger Templates 模板資源

部落格技巧(版面)---關於blogger版面調整的技巧分享。
Blogger推出文章圖片具燈箱效果的功能(Lightbox)
Google Blogger即將全新改版,搶先試用
Blogger新增功能,透用Email來訂閱部落格最新文章
Blogger in Draft可以直接在文章裡嵌入Youtube 影片
Blogger設計版面推出更多字型選擇
可自行置換新版模版背景功能
如何置換新版部落格範本的背景圖案
如何隱藏邊欄小工具的標題部份
新版Blogger範本設計工具正式啟用
如何隱藏分類頁面的說明文字
Blogger 測試版推出全畫面的實際預覽功能
幫嵌入式留言欄位增點色彩變化
驚為天人的Blogger templates官方模版終於測試推出
Blogger 官方自動分頁機制(Auto Pagination)
利用部落格來架設屬於自己的書籤資料庫網站---製作篇
利用部落格來架設屬於自己的書籤資料庫網站---介紹篇
Blogger Pages分頁功能讓您輕鬆有個導欄列
文章內自定一個重點筆記的區塊
善用版面空間做AdSense廣告配置
張貼意見以其他文字或圖片代替
如何美化模板元件的外觀配置
幫自己設計個版權所有的小方塊單元
回應編號與留言者大頭無法並存解決之道
Blogger新版編輯器造成的邊欄往下掉,如何解決?
秀出你的大頭來‧Blooger新增留言者頭像圖片功能
Internet Explorer出現黃色驚嘆號的抓錯方式
Blogger文章編輯區新版模式正式啟用
將首頁、較新及較舊文章文字以圖片代替
用縮圖顯示相關文章的功能(Thumbnails for Blogger)
文章分類新增標籤雲功能(Label Cloud)
單篇文章加入共享書籤(Social-Bookmarks)
將繼續閱讀(Readmore)更改位置或外觀
修改嵌入式留言欄的寬度
懶人法‧利用草稿文章來存模板系統圖片
加強blogger作者留言和一般留言的區分
追蹤者(Followers)功能大躍進
關於Blogger最近的錯誤--followers減少及留言驗證錯誤
如何利用捲軸讓邊欄(Sidebar)元件縮短
一分鐘讓你的部落格也有數字分頁效果
兩欄式簡潔的模板Flashyweb ---改版分享
設定留言回應編號,讓部落格互動更活潑
文章分類太長了嗎?教你將它變成兩行
上載新的Blogger templates常發生的錯誤,解決之道
Blogger內建圖片語法改變
修正Favicon圖示消失的錯誤
Blogger模版CSS語法細部介紹(下)
blogger模版CSS語法細部介紹(上)
Blogger template模板教學課程---如何修改有廣告的模板
Blogger template模板教學課程---HTML內容架構
Blogger template模板教學課程---CSS外觀解說
Blogger template模板教學課程---概說及基本結構
Blogger留言視窗的設定
Blogger in Draft釋出5項新測試功能實作報告
幫邊欄的網頁元素(widget),自訂不同的漂亮圖示
在文章下方放置訂閱RSS的文字敘述
改造版面甘苦談
部落格文章標題優化,加強SEO效果
Blogger預約發文正式登場
如何將標題(頭)分兩欄,加入網頁元素
新增最新回應Recently Comments Hacks
Blogger圖片大小的控制
製作有上下捲軸的公佈欄
Blogger 新手基本技巧問答(四)
Blogger的最新回應可正常瀏覽了
Blogger 新手基本技巧問答(三)
RSS訂閱文章相關說明
Blogger 新手基本技巧問答(二)
如何讓Firefox的字和IE一樣大?
如何將連結以另開視窗呈現
在Comments意見欄留下超連結
Blogger 新手基本技巧問答(一)--11.4更新
換個與眾不同的blogger button
Blogger初入門教學彙集
使用的Blogger Hacks資源網站
版面大小的調整
有Archive功能的月曆Calendar
為你的網站加個小圖示---Favicon
三欄版面的再進化
只顯示文章標題
邊欄標題加上圖示
新增最新文章&最新回應
換Banner圖片及文章標題加上圖示
繼續閱讀的設定
如何在標題列加入網頁元素
blogger 三欄格式
加入Counter 計數器
隱藏 blogger導覽列(navbar)+進入後台的方法
Blogger 初始,注意事項

blogger工具---分享一些可以外掛的網路工具。
Blogger推出計數器及熱門文章小工具
Blogger終於推出垃圾留言偵測過濾系統
Blogger測試區後台推出部落格統計分析功能
Blogger 後台新增社會書籤按鈕設計
新增數字分頁導覽列,讓瀏覽更方便
線上人數 whos.amung.us工具的新改變
新增Google Buzz 評論按鈕及Facebook Share推文分享計數按鈕
新增文章與回應數統計貼紙
在本文區上方加個導覽列(BreadCrumbs on top)
如何讓文章無法反白選取,避免文章被抄襲
最新文章小工具以縮圖表示(Posts with Thumbnails )
如何防止他人複製文章的方法(鎖右鍵)
新增一個回到上方的按鈕(Go To Top)
Blogger增加導欄列Navbar透明圖層的設計
裝上隨機文章(Random Posts),加強部落格的黏著度
幫部落格做個網站目錄(文章列表)吧
Blogger的社群小工具---Twitter Gadget(壞掉了)
找個喜歡的Twitter Button細細念吧
新增Plurk、Twitter及Facebook推文按鈕
如何在文章(HTML)裡顯示特殊符號
單篇隨機文章‧讓舊文出來透透氣
關於tumblr的兩三事│模板資源
裝個漂亮的Twitter Widget在邊欄碎碎念
Blogger in Draft釋出搜尋列加強版
結合FeedBurner訂閱人數的Rss訂閱圖示
今天(228)是FeedBurner合併帳戶的最後一天
隨時記錄你的部落格統計資料
Google AdSense終於和 Google Analytics結合了
FunP貼文與Blogger圖片縮圖的錯誤
超簡單‧在部落格播放MP3音樂
當Feedburner變成你的文章網址時
利用Gmail的表情符號寫文章,增添文章的活潑性
Google AJAX API小工具---利用RSS│關鍵字顯示多個部落格最新文章
Wowzio漂亮且多功能的RSS小工具Widget
Cbox及Shoutmix留言板如何封鎖IP位址
如何查詢及追蹤網路留言IP位址的來源
30 Boxes│部落格行事曆
網頁上展示程式碼的轉換工具---Postable
啟用Picasa網路相簿服務
Blogger功能---設置網誌清單輪播,正式登場
FeedBurner訂閱Blogger文章,摘要輸出RSS
Spotplex點閱排行榜即將走入歷史
申請微型部落格服務---tumblr
如何產生隨機文章---B Stir
Blogger留言系統的外掛---DISQUS
將Twitter放到部落格的各種方式
讓你的CBOX留言版更活潑生動
自己做網路007調查員—談站長工具webmaster
留言最多排行榜的外掛
Blogger使用者的Youtube教學頻道---BloggerHelp Channel
你的CBOX留言版是不是少了一塊呢?
FeedBurner訂閱突破100人
淺談部落格的翻譯及相關程式碼
利用Windows Live Writer離線寫部落格文章
申請FeedBurner服務,感恩我的讀者
隨機文章產生器---Blog Stir
RSS輸出與YOUTUBE結合---FeedWind
Kwout 輕鬆擷取網站畫面
YourWebWidget---秀Flickr&Youtube小工具
Rss工具,顯示最新文章或回應---FeedWind
測試你的部落格人氣的利器---My uStats
Geovisite---Geo Tracking計數器+訪客分佈圖的統計工具(下)
Geovisite---Geo Tracking計數器+訪客分佈圖的統計工具(上)
Blogger Play可放在blog上的小工具Gadget
網站縮圖擷取(Web thumbrail)大彙集
Pictobrowser播放Flickr相簿
在Blogger播放Flickr相簿幻燈片
Blogger Play即時瀏覽各國blogger的圖片
Review Poster 輪播最新文章
超簡單,幫網站加個搜尋功能(Search this blog)吧
Blogger新服務---插入視訊影片的功能
搜尋Blogspot.com的同好
用Grazr Rss輪播器來顯示最新回應、最新文章
顯示線上人數及統計報告---whos.amung.us
超簡單的網站國際化---Google Translate
PostReach 在文章末加上圖像評語按鈕
最新文章,利用Google Reader聯播系統
用Performancing來寫blogger的文章

官方模板修改---如何利用官方釋出的模板,增添其他功能
在導覽工具列上放置搜尋框
在部落格下方加個雜誌版型的圖文導覽列
在部落格名稱下方放個水平連結導覽列

Blogger相關---有關寫部落格的方向與相關資訊。
部落格跳出不明的彈出式廣告視窗
我的文章Google搜尋引擎找不到怎麼辦?
0與1謎詭世界文章一覽表
試玩日系FC2 BLOG部落格
部落格教學網站---外文版蒐集
0與1謎詭世界被DMOZ收錄的影響
如何控制文章網址的產生
Meta的重要性,對搜尋引擎而言
新手建議閱讀文章
0與1謎詭世界最受歡迎文章
關於0與1謎詭世界
提高部落格的黏著度
如何宣傳你的網站---入口網站登錄
部落格小貼紙串連---關懷自然環境篇
如何在網路上宣傳你的網站---聯播篇
為何在Blogger架設自己的部落格
申請各家部落格的感想(三)Yam天空、Yahoo、Msn、UDN
申請各家部落格的感想(二)樂多Roodo、Pixnet、Sina
申請各家部落格的感想(一)pchome、Xuite

Google AdSense相關文章
Google Sites可以放AdSense廣告賺錢了
是誰偷了我的Google AdSense廣告費
Google AdSense終於和 Google Analytics結合了
新手加入Google AdSense的叮嚀與收入分析
看了Google AdSense官方教戰手冊的感想
為什麼我的網站上出現成人廣告
將Google AdSense放入本文裡
Google AdSense隱私權明示政策
Google AdSense後台的熱門搜尋分析報告
Google Adsense最近的變化觀察
Google AdSense Video出現中文影音廣告
在文章內加入Google AdSense---官方提供
如何決定Google Adsense落腳的blog
Google Adsense的熱潮對我而言

543隨筆---寫些生活與心情雜感
2012年行事曆及國定假日
99 年個人綜合所得稅申報--稅額試算新服務
2009年部落格總體檢與反省
莫名奇妙的多了中文網址‧我被蓋台了嗎???
關於tumblr的兩三事│模板資源
好書推薦│家庭網路架好通
吊車尾的藍眼佳作‧謝謝鄉親父老們
【公告】0與1謎詭世界RSS訂閱網址變更
詭異的PageRank的數字
入‧圍‧藍‧眼‧觀‧注--0與1謎詭世界
【感謝】華文部落格人氣獎--投票給東京封印的朋友
【串連】2008年的部落格行動日-Blog Aciton Day
宅度計的娛樂效果
在壓虎成立部落格對抗黑暗惡勢力
關於寫部落格這件事
讓我傻眼的部落格
使用FTP軟體,造成電腦重灌
改造版面甘苦談
FeedBurner訂閱突破100人
淺談部落格的翻譯及相關程式碼
10.15部落格行動日---簡單過生活
部落格行動日---Blog Action Day環保活動
PTT的留言
緣起---blogger

電腦維修---大部分都是從舊網站轉過來的文章,自己修電腦是為了省錢,所以啃了許多DIY電腦的書籍。
修電腦黑特文
電腦無法開機,螢幕無顯示,風扇轉兩下就停了
使用FTP軟體,造成電腦重灌
Windows update 出現的錯誤
網卡IP指定給非實體的介面卡,無法連線
可怕歐---檔案系統變成RAW,要我格式化!
省錢的DIY電腦
無法開機,螢幕沒有顯示,連續的長嗶聲
無法開機,螢幕無顯示、無嗶聲
電腦維修甘苦談

網頁素材---網路資源何其多,介紹些自己喜歡且實用的。
別具特色房屋型的社會書籤
古椎的人型娃娃個性化社會書籤
帶來流量的卡車造型社會書籤
適用部落格模板的圖示組合
搞怪有趣的萬聖節(Halloween)Rss Feed訂閱圖案
四季春夏秋冬的Rss Feed Icon
動物大觀園可愛圖片集
可愛鄉村拼布風的圖案網站
模板templates的背景與標題列圖庫網站
夏天運動風及辦公室OA風格的Rss Icon訂閱圖示
象徵春天來臨的復活節小兔子彩蛋圖示
喚回童心的日本超可愛卡通桌布
幾款RSS Icon訂閱圖示最新分享
利用大頭貼│表情符號,讓你的部落格文章更具吸引力
Background Labs│清爽且帶有設計感的背景紋理圖
Free Internet Calendar Maker---線上製作日曆
8款iPhone華麗炫目的圖示
Christmas wallpaper聖誕桌面分享
應景的聖誕小玩意讓您有溫馨過節的氣氛
超卡哇伊動物Rss Feed Icon訂閱圖示
幫你的Rss Feed圖示換個新裝吧
免費圖庫Free Photo蒐集
製作屬於自己的背景圖案
高品質的ICON圖庫素材---Websiteicons
漂亮且具光澤感的RSS圖案
WEB2.0 立體 icon 圖案蒐集

圖像設計---這部分比較著重設計家的資源,希望大家能發堀一些優秀的網路設計師及網站。
來自西班牙奇幻異想世界的插畫家--Jonatan Cantero
美麗又剔透精緻的icon圖片
富立體設計感的Rss Icon
精緻的日本和風設計圖庫
超豐富的設計社群網站--- deviantART
亞洲設計家的圖像網站- startdrawing.org

Firefox---這是我目前大部分使用的瀏覽器,介紹相關的資訊。
如何讓Firefox的字和IE一樣大?
Firefox -來自日本的火狐狸,超可愛桌布分享
Firefox 火狐瀏覽器,我的愛用Browser

網路賺錢---除了Google AdSense還有其他網路賺錢的工具,但我覺得要真正從裡面賺到錢,對我來說是不太可能。
BloggerAds 推出新的橫式廣告,讓您賺更多
BloggerAds發生了什麼事
部落格賺錢新方法-寶石星球手機遊戲下載
PCHOME分紅網,如何省錢兼賺錢
部落客廣告聯播 – BloggerAds

Twitter---火紅的工具,自己使用的心得教學
將Twitter放到部落格的各種方式
將Twitter放到你的部落格上
申請 Twitter 來 喃喃自語

筆電相關---我很少使用筆記型電腦,但是幫別人買過好幾台NB,一些使用及購買經驗分享,目前使用的筆電,是朋友送的舊機器,但也很新,用了2年多。
網卡IP指定給非實體的介面卡,無法連線
寶石般璀璨的La Vie G Hello Kitty筆記型電腦
買筆電,心得分享

部落格小玩意---這東西網路上的達人太多,分享比較特別的。
浪漫情人節的部落格小玩意
期間限定的美女時計
Blog Clock│部落格時鐘大匯集
Halloween|萬聖節搞怪部落格小玩意
日文版Blog-parts的網站
聖誕節專用blog parts
華麗風の完美世界on line---blog parts
Tube Magazine 線上Youtube影片輪播器

Google---Google的服務真是無遠弗屆,所以很多工具Google不用介紹,大家都會用。
Google Sites可以放JavaScript檔案及接受外連
如何利用Google文件(Docs)製作匯款單或調查表
Google Sites可以放AdSense廣告賺錢了
Google 關於blogger各項服務的網誌
Google Sites 實際操作程序(下篇)
Google Sites 實際操作程序(中篇)
Google Sites 實際操作程序(上篇)
令人驚豔的Google Sites服務--基本介紹篇
打造一個漂亮的iGoogle Skin首頁

WordPress專區
自行架設的網站---WordPress PlayNote
WordPress申請免費空間的選擇
WordPress獨立架站準備工作
試用WordPress官方提供免費部落格

Google Plus,分享Google Plus的相關利用
簡單清爽型的Google Plus個人名片貼及動態消息元件
在部落格單篇文章新增Google Plus button的按鈕
在部落格新增Google Plus最新動態的元件
幫自己做個Google Plus的名片貼貼紙吧

Evernote
試用Evernote初體驗,註冊、非同步設定、螢幕擷取


2008年5月19日 星期一

改造版面甘苦談

這次綸太郎閒閒沒事又開始改版面,繼1月底0與1謎詭世界換新版面後,又過了3個多月,其實原先的版面我自己並不是很中意,不過他的功能性很不錯,但整體風格看起來稍顯硬了些,雖然我是寫網路資訊方面的文章,但並不希望自己的版面太過僵硬與呆板,其實版面的設計我並不擅長,通常是參考他人的網站,再根據網路上所提供的模板改造而成,只是用了好多模板,總覺得大同小異,和別人相同的模板,會讓我覺得無力。


網友改造版面的基本功就是要備份自己的模板,尤其在換新模板前,我自己的經驗是我都會對照IE與Firefox呈現的畫面,尤其IE常會有問題,對很多Java Script或是語法不相容而產生錯誤,常常在Firefox看起來沒問題,但是在IE下瀏覽不是畫面停住或是空白,不然就是出現黃色小三角錯誤訊息,所以要裝Blogger Hacks前一定要備份原始的模板,不然痛苦重裝的就會是你自己,改版面不要偷懶,尤其在blogspot.com設站的版主要有這種自覺,除非你的Hacks和外掛本來就很少,常常改來改去沒啥大不了,像我的就很麻煩,不過常常改造,也就駕輕就熟了。

以我自己改版的經驗,首先就是要備份未改造前的模板,再來還有下面這些東西要備份。
‧ 網站敘述meta及專屬的網址icon語法。
‧ 各種追蹤碼或驗證碼,例如Google Analystic、MyBlogLog追蹤。
‧ 各種外掛小工具,留言版、twitter、聯播程式碼、計數器及Hacks等等。
‧ 特定html裡的程式碼,例如Code(程式碼區)、引用區塊(blockquote),如果你先前已有自己設計的格式。
‧ 網址連結,建議不要使用官方的連結清單,而用HTML/JavaScript來製作你的網站連結,否則一改版,又要一個一個輸入,如果你的好友連結有很多,你會很累的。
‧ 頁尾關於網站的版權及設計來源,有做這部分的記得備份。

其實這些都可以從你申請的工具上獲得,但是如果沒有備份,你還要一個一個到這些你利用工具的網站再擷取程式碼,是很累人的,所以有一份自己的備份清冊是很重要的,像我自己會做有一份程式語法的備份(Html語法) ,及小工具外掛(網頁元素)的備份清單,當然如果你不是在Blogspot.com架設網站就會輕鬆許多,只是現階段這些準備功夫還是建議你可以做,會讓你的改版更輕鬆一點,如果有更好的方式,希望網友也能留言建議。

這次的模板是參考Our Blogger Templates網站裡的Blogger Template: Leftin


對原始模板有興趣的可以上他的網站去下載,這個網站之前綸太郎也有介紹過,原先的名稱是Dzelque Blogger Templates,網址也不一樣,http://dzelque.blogspot.com/,他現在申請了專用域名網址,也改了網站名稱,可以參考我先前寫過的New blogger template---多國語言版的模板網站,他以前對IE的支援度不佳,但最近試用,情況有改善許多,不過初學者還是不建議用,而且以前有提供多國語言的翻譯,現在也取消了這項功能。


不過你可以發現我現在的版面和原始的模板差異很大,因為我自己改了許多地方,看不太出來原先的設計,最主要是幫每個網頁元素的標題加上自己喜歡的圖案,並在每篇文章最後加上歡迎訂閱的文字及圖案,以後會陸續寫下版面改造的心得文章,另外也要整理一下網站的大綱,作份索引目錄,畢竟已經累計了百多篇的文章,有時自己找文也很麻煩。

網站改版也是讓自己再努力寫文章的動力來源,有時因為世事紛擾心情鬰卒或是沒有靈感寫下文章時,不妨換個版面調整下心情,也能激發寫文章的idea呢!

2008年5月15日 星期四

富立體設計感的Rss Icon

這是一個蘇俄圖像設計家的網站,如果想看得懂他的網站內容可以利用Google Translate工具,以下是翻譯網頁的網址

2008年5月11日 星期日

部落格文章標題優化,加強SEO效果

今天在Blogger Buster看見一個新技巧,分享給大家。

這個技巧是改變你的部落格單篇文章標題(Blogger Posts Title)在瀏覽器標題列顯示的方式,其實在網頁設計裡就是你要給他下個網頁標題,而通常在blogger的顯示上,一篇文章的標題顯示如下,先是部落格名稱,再來才是你的文章標題,



實際上這在搜尋引擎的搜尋上比較不利,SEO效果不佳,搜尋引擎總是先找到你的標題,然後才會搜尋到內容,而在搜尋引擎的眼裡,每篇文章都是一個搜尋資料來源,但如果你的重要的文章標題卻列在後面,被搜尋到的排序結果就會列在比較後面。

而這個方法則將改變原來的顯示方式,去掉了部落格名稱,而以文章標題為主要顯示的方式,如下:


如何做呢? 一樣到後台→版面配置→修改 HTML找到下面這段敘述
<title><data:blog.pageTitle/></title>


置換成
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>




2008.8.11更新
網友盧Lu提到如果還是想要有部落格名稱,怎麼做?我自己試做過後,語法為
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/>-<data:blog.title/></title>
</b:if>


就是多加上-<data:blog.title/>
最前面的-是個連結符號,你要加什麼都可,如*

其實在Blogger Buster 的文章裡沒有提到要包括前後<title></title>
但是經我測試過後是要置換的,不然你的標題列會多出一個<title>


不過這個做法在文章分類下,就看不到原先的『部落格名稱—分類名稱』的項目了,而一律以部落格名稱為顯示,不過重要的是單獨頁面的產生才是搜尋引擎重視的來源,給大家做個參考。

另外在Blogger Buster的文章裡有提到,新申請的blogger及利用blogger官方提供模板的使用者,這部分的程式碼已經變更,但經過我的測試,在中文版方面依舊是維持原先的呈現方式,並沒有作任何改變。

常常看綸太郎的文章的人應該了解,大部分我文章內容都是自己測試過的結果,有沒有優化也要看未來搜尋引擎的收錄,另外標題的優化也相當重要,比如前一篇Spotplex點閱排行榜即將走入歷史,在Google的搜尋就找不到蹤影,因為「走入歷史」這種用語,機器人是無法意會的,如果用「停止服務」這類的用語,排名或許就會比較前面,所以有時候也是要隨眾來命名自己的文章標題,因為自己也不喜歡浮誇的字眼,盡量是平實符合實際內容,關鍵字也是盡量在學習使用中,多多參考網路上的文章討論,其實發現最容易被網友注意的就是數字型的標題三種有效、六種不能錯過的、十種最炫….等這類的標題,都會吸引人不由得按下滑鼠,看個究竟,不過本著學習分享的精神,自己會再慢慢的寫下一些心得,也謝謝開放EMAIL後常來信的Macoto,不吝分享自己的學習經驗,及常常在這裡鼓勵我旅美熟姐日記的Emily,還有許多網友都給我許多靈感及啟發,讓我可以一篇篇的寫下去,在這母親節的感恩時刻,也感謝給我指導及關心的各位朋友,送你們一朵美麗的向日葵吧,大家一起努力的寫網誌吧,加油,各位!


參考資料來源:
Change the Title Tags for your Blog
WordPress SEO 標題優化
GOOGLE左側排名實戰演習

2008年5月7日 星期三

Spotplex點閱排行榜即將走入歷史


綸太郎在一兩個月前就覺得Spotplex常常出現異常,這是一個外掛點閱文章排行榜的網路工具,很多人使用,我發現不但載入時間延長,而且有時根本連不上線,所以換新模版時都把這個外掛給拿掉了,今天上Spotplex網站一看,果然出問題了,即將在5月9號要和大家Say Bye Bye,停止服務了。

Spotplex的官網說明如下:
Dear Spotplex users,

We regret to inform you that Spotplex is going offline. This was a very hard decision for us and we are sure you will miss the service as much as we do.

Thanks for your support. For any question, please send us an email at support@spotplex.com.

The Spotplex Team

Note: If you have embedded a Spotplex tracking code on your site, please remove it. You might get an error message if you still have it beyond 5/9.

大意大概是說,他們覺得關掉這個網站是個很困難的決定,也謝謝大家的支持,如果有裝追蹤碼的部落格,請移除它,5/9以後這個程式碼將會完全失去效用,出現錯誤訊息。

Spotplex是個相當優的網路服務,讓我知道自己的文章哪些最受網友的喜愛,從去年6月註冊,也提供了我許多靈感的來源,要關站了真是可惜,而且目前也沒有可以替代的工具,只從Google Analytics,看出點閱人數的比較,雖然日本網站ACR WEB也有提供類似的服務,但因為我一直沒法成功導入語法,日文也好多沒法理解,所以就放棄使用,想使用的可看看林氏璧和美狐團三狐的小天地的部落格,最近七天內大家在看哪幾篇文章?/我的標籤雲 一文展示的樣子。

再來回顧一下吧,0與1謎詭世界最受歡迎的文章排行榜吧,我用圖片呈現,不用java,怕會失效,有需要的人現在趕快作自己點閱人數排行榜備份吧,至少是自己的歷史累積,值得保存的。


2008.5.8更新
網站今天已貼出公告正式關站,連平常的畫面都看不到了,只剩簡單的聲明。
真的是撐不下去了,謝謝Spotplex這段期間為我們的服務。

也謝謝友站,林氏璧和美狐團三狐的小天地的部落格,也是PTT日本旅遊版的關東區站長goomi老大,長期以來放著我的旅遊網站---東京封印的點閱排行榜,為我帶來不少流量,如果想去日本東京旅遊的朋友,絕對不能錯過他的網站,不用買導覽手冊,只要詳讀他的教戰手冊,勤作筆記,就可以暢遊東京了。

參考來源:
Spotplex :: What people most read today

2008年5月2日 星期五

Blogger預約發文正式登場

2008.5.1,Blogger Buzz公布原先測試預約發文的功能,請見New feature: Scheduled Posts一文,現在已測試完畢,正式啟用了。

綸太郎對測試版的功能通常是抱著觀望的態度,看看測試的結果是否穩定,自己再來實驗套用,這次這個功能已正式登場,我想造福很多一天可以寫好幾篇文章的格主,就算出國或是出差也可以放上幾篇文章,每天固定的出現新文,讓你的網友群們不會因為你的短暫消失,他們也隨著消失,而且也可以自己設定公佈欄,預告未來會發佈哪些文章,吸引網友的注意,再次回訪你的部落格。

如何預約發文呢?

一樣是建立一篇新文,不同的是這篇文章的日期要設定未來的,按下下方的「張貼選項」,改成你要發表的日期及時間,再按下「發佈文章」即可。

你也可以看到在後台文章列表裡出現了「已排定」的項目,也可以看到你有哪些文章是預備發文的,非常方便管理,時間一到文章就會自動發佈。


排定之後,當文章依預定時間發表後,後台的文章列表區就會呈現下圖,已排定的字眼會消失,而且也出現檢視狀態,代表你的文章已經公布在你的blog上了。


參考來源:
Blogger now schedules future-dated posts

2008年5月1日 星期四

申請微型部落格服務---tumblr



申請twitter之後,覺得短短的文章,像是在自言自語的功能還不錯,於是今天申請了tumblr,算是微型的部落格服務,使用上還算方便,簡單沒有壓力的寫些天馬行空的短文也不錯。

目前經營的2個部落格,雖然自己也很喜歡寫這些分享及教學文章,但總是長篇大論落落長,如果沒有回應,也不知道網友的接受度與否,由於喜歡嘗試新東西,所以又註冊了tumblr。

試用過覺得還不錯。

很單純的環境,可以貼文章、貼圖片、引用文章、影音檔案、chat,


感覺就像是個網路的筆記本,可以隨時貼上你在網路上挖掘到的東西,其實我覺得日子一久也就像你每天的網路筆記本、日記,記載著這段日子你在網路上的足跡,覺得很不錯。

如何申請呢?

進入tumblr官網,按下sign up註冊一個新帳號,然後輸入你的email及密碼,及設你自己tumblr的網址名稱,


就完成了,就會出現上方的那張圖片,可以開始貼你的文章了。

目前tumblr的版型很少,但無所謂,對我來我來說只是單純的筆記本,而且也可以修改css版型。

Dashboard裡的Customize,可以自定功能,其中
Basics:輸入你的tumblr名稱、內容及大頭貼,也可自定網址〈Use a custom domain name〉


Theme:12種模板

Color:自定顏色
Advanced;部落格連結是否另開視窗,所在國家的時區、每頁秀幾篇文章....
Feeds:這個可以把你訂閱的文章,放在你的微型部落格,也算另一種Feed Rss聯播的輸出,有各種Rss、Blogger、Digg、del.icio.us、twitter、Wordpress、Youtube...等等都可以放上文章標題或是擷取部分文章。
Directory:目錄,是否開放在搜索引擎及tumblr上推廣,還有設定你的所在國家,如果想保有隱私,當成自己的私人日記,不想公布在網路上,就不要勾選。
Brag:放個連結讓非註冊者也可註冊的超連結。

Groups,可以創建於你自己的社群。

最後就是Account項目:
Goodies:外掛功能, Bookmarklet將tumblr放到書籤上,可安裝使用在mobile、mac系統上及接收AOL即時訊息,及放在blogger上。
Preferences:重設你的信箱及密碼,還有 Advanced Options,設定你的文章是單純的文字格式或是html格式輸入,也可以下載Markdown軟體,來作轉換。
My tumblelog:瀏覽你的tumblr網頁 。

還有更多功能,可安裝tumblr的API工具,讓他具備更豐富的內容,不過目前我只有試驗到此,先和大家分享。

如果覺得寫部落格讓你太沉重,覺得不知寫些什麼,沒有靈感,不妨試試看這個我稱之為網路剪貼簿的服務,單純的收藏一些吸引你的文章、圖片,很多人是利用他來製作個人化RSS Feeds文章聯播站台,在這裡沒有Bsp的廣告,和太多功能讓你覺得繁瑣,也可以單純寫些心情小品,畢竟twitter的中文字只能輸入70個字,而且是文字型,如果覺得不敷使用,用這個網路工具服務,也可以自創屬於你的小小天地,我覺得相當不錯。

延伸閱讀:
關於tumblr的兩三事│模板資源 -