目前日期文章:200712 (7)

瀏覽方式: 標題列表 簡短摘要


用些許食物就能收買的貓群們,目前佔領了我後面的陽台,
他們總是成群結隊出沒,在追求食物的過程中奮不顧身。

自從給了他們一些肉塊後,我們就成了朋友,
每次推開門,總會看見他們怕死卻又貪吃的表情,
充滿乞食目光的雙眼,掩飾著他們高度防衛的心。

他們彼此並不爭搶食物,混亂中帶點群體的秩序和友情。

搬來這裡許久,拍照的當天是我們第二次近距離接觸,
我忘了上次是何時我們讓如此靠近。

好像走了幾隻,而這些是否就是上次那些,我也記不住。
總是這樣來來去去,人也是,貓也是,

我也是。

他們,是我家後院陽台的貓,我們現在,是好朋友。

她好像是母親,上次看見有隻小貓畏畏縮縮地跟在她旁邊。


他最不怕生,每次吃東西都搶第一。


他是個笨蛋,上次一腳踩空跌到樓下。


他....應該是個老頭,沒什麼熱情。

give 發表在 痞客邦 留言(3) 人氣()

Google Calendar,乃Google一個線上的Calendar。簡單來說,就是Google的日曆。宛如那平易近人、深入你我日常生活中的日曆一般,它的名稱,清楚地宣示它一生的宿命 — 我,就是日曆,我就是為紀錄日期而生的日曆,我以生為日曆為榮,一天為日曆、終身為日曆....

很好,我知道很多人看完開場白,一定很想扁我離開,很好,你是正常的,不過這只是個小測驗,測驗大家耐心的一個小測驗,你走了表示你耐心不夠嘛。所以,先別急著走,拿把椅子坐下來,小吃攤馬上就要來了。

身為Google Online Office的一員大將(另一個大將是Google Docs),它,怎麼會是一個日曆那麼簡單!?揪境~~它的背後,還有多少不可告人的秘密呢?揪境~~它還有什麼三頭六臂的功能呢?

各—位—觀—眾,它的功能就是....

噹噹噹~~~

可以放到Blog上

我知道你想扁我,還以為是什麼了不起的功能,放到Blog上是會比較厲害嗎....等等,先看完步驟和說明後再扁也不遲....囧rz,開始了。

首先,我們先建立一份新的日曆。

接著,填入一些關於這份行事曆的資訊,如果這是一份可以公開的行事曆,那麼點選與所有人分享此日曆上的所有資訊。不過這樣一來,設定在這日曆上的任何資訊都會被公開,如果裡面含有你的私人行程,那麼最好是不要公開。這裡因為是要放到Blog上,所以我選擇了老二第二個選項。

這邊是跳出的警告訊息,告訴你,你這麼做將會變成LG - 全世界都在看。(這個梗太冷了我知道....=_=)

建立好了以後,勾選剛剛建立的日曆,這日曆的右方有個倒三角形,拉一下。



嗯,看到相關訊息了,選擇日曆設定

再來會看到設定畫面,同一個頁籤往下看,有個日曆網址,右方有三個小圖示,點選HTML

會跳出一個訊息,點選設定工具

嗯,終於看到設定的地方了(你可藏的真好)。這畫面的左邊是設定區域,右方是預覽區域。預覽區域會隨著左方的設定動態改變。


嘿嘿,設定好了。那就可以複製HTML碼了。

好了以後就貼上Blog吧!

結束。

慢著,等一下~~~還沒要收工,接下來才是Google Calendar的好戲。

  1. 可以新增他人的日曆。唉阿,你會說我幹嘛去新增他人的日曆阿?那是人家的行程耶。嘿嘿,如果不是行程呢?例如:台灣上映的電影日期和內容簡介?F1賽事的分站資訊和Live時間?New York Yankee的征戰日期....等等的,這些有用多了吧?

    我們可以點選日曆欄位下方的管理日曆


    進來以後一樣也會看到設定介面,點選新增日曆。

    再來會有個搜尋欄位,在這邊打入要搜尋的關鍵字,假設是電影好了。我用正體中文試過,不知道是台灣太少人用還是系統不能做中文的搜尋?總之我用中文找不到東西,但是用英文可以。有結果以後選擇一個你覺得豐富的日曆,按下新增日曆就好啦。這邊我選了Han's Movie。



    嘿嘿,今年上映的電影日期我都拿到手啦。
  2. 飯粒範例二我有一群狐群狗黨好友,大家平常都會把妹喝小酒聊天聚會,或者出外走走、踏踏青、不定期的參訪老人之家之類的(誰相信阿 囧),每次在MSN上討論行程是很方便沒錯,但總是無法比較有制度的紀錄整個討論的過程。如果有個網站,可以讓你設定可以討論的名單,名單內的成員可以共同安排行程、日期,也可以把討論的結果貼到上面去作紀錄,嘿嘿,沒錯,Google Calendar可以滿足這樣的要求。這也是協同工作軟體的基本功能(像IBM的Lotus Notes或M$的Outlook + Exchange Server),只是Google這是線上版,無須安裝任何軟體或架設任何主機就能達成,方便好用(但也有點陽春就是了....)。
  3. 提醒自己當個好人,不是,是當個好的Blogger,如果想要好好經營一個Blog,那麼用心,是必要的,不過你知道的,人生總是雜事很多,昨天後面陽台的母貓生了,今天隔壁的公狗嫁了,很多事情總是令人措手不及。所以,有個紀錄是好的,可以提醒自己該做什麼~
以上~

後記

Google Calendar是個很棒的工具沒錯,但是終究是有個缺點,這缺點說大嘛也不算大,只是挺致命的就是了。這缺點就是,非得要在有網路的地方才能使用Calendar服務,若沒網路,精心安排的行程就無用了。身為一個時間管理、工作排程的軟體,和使用者緊密接觸是必要的,所以如果不能很方便的存取,自然會很多功能就大打折扣了。當然前題是,Google把Calendar定位在這市場。

give 發表在 痞客邦 留言(4) 人氣()

抱歉,程式碼的部份在IE(6.0&7.0)下不能正確顯示,並且IE在1024x768的解析度下會造成排版的錯誤。
如果要得到最佳瀏覽狀態請用Firefox。

sorry 囧rz


寫的很爛我知道,我們不能期待一名菜鳥會有太好的表現阿....囧>

雖然把登入的選項抓了出來,可是每次登入完後都會跳到首頁,雖然不是什麼大不了的事情,可是就是有點小麻煩。有沒有不用跳到首頁就可以登入的方法呢?所以我嘗試寫了這個。

基本的想法很簡單:保留原來的視窗,開一個新視窗,然後把登入的Form送到新視窗去執行,這樣Submit之後雖然會redirect,但是那也不會影響本來的網頁。接著再偷偷地把新開視窗關掉即可。這是我的想法(太粗糙了點吧,我想)

以下是程式碼:
(如果你在IE下看不到程式碼,請點選:http://shen129.googlepages.com/login.txt下載)






進後台,開一個新的版面,拷貝貼上即可。

目前的問題是,新開的視窗無法關掉....要手動 囧

經過某老鳥Canny大的訂正後,此問題已解決

歡迎任意修改取用,若有任何使用上的意見等,歡迎留言阿~

give 發表在 痞客邦 留言(0) 人氣()

** 本篇文章是在Google Docs上編輯後發佈 **

感謝Pixnet團隊最近釋出了XML-RPC的功能,讓支援這個協定的第三方工具(像是Windows Live Writer、Google Docs 等)可以直接編輯、發佈文章到Blog上。

我之前發佈文章的順序是:先在文字編輯器上將文字的部份撰寫完畢,該抓圖的地方抓圖。然後將圖片上傳到Pixnet,接著到Pixnet的後台建立新文件,把文字貼上,再把圖片兜進去。

整體的過程不算太難但就是複雜,尤其當圖片一多的時候,文字和圖片結合的部份更是麻煩,每次都得記住每張圖片的URL為何,然後到文章編輯的地方把網址貼進去。

現在能使用Google Docs就方便多了,Google Docs既然標榜著是Web版的文書編輯程式,那麼編輯的功力自然不在話下。文章內插入圖片的簡便度大增,不用再去詳記每張圖片的位址了。加上,Google Docs能上傳Microsoft Office文件、OpenOffice文件和PDF(註: 我目前只有試過Word、Excel,Excel上傳的檔案無法發佈到Blog上)等,我們甚至可以先在這些工具上把文章編輯完後再上傳至Google Docs來發佈。(我沒用過Windows Live Writer,所以不知道Windows Live Writer是否也有相同的功能?)

除了上述最主要的優點外,其他的好處像是圖片空間變大了(我把圖片都放在Pixnet內,現在直接放在Google Docs內)、文件流通性變高了、可以透過Google Docs來管理文件、可下載複本到自己的電腦上....等。

好吧,這也不是沒有缺點,真要挑一些缺點的話,有:沒有可親的小圖片可用(我喜歡的哀號小狐不見了 囧)、文章上傳後無法歸類、上傳的文章時間錯誤(是以Google Docs的主機時間為主?),不過這些都是小毛病啦,還可以接受囉。

以下就是使用Google Docs來編輯、發佈的步驟

首先登入Google Docs,然後建立一份新文件


接著在文件的右上方點選發佈

會看到如下的選項,先點步驟一,進行網站設定


這邊Blog發佈的設定,點選我的伺服器 / 自訂,在API的地方選MetaWeBlog API,URL填入:http://blog.pixnet.net/xmlrpc.php,下方是登入Pixnet的選項,請填入你的帳號和密碼。


好了之後可以測試看看,點一下測試。哈,成功了!

然後就可以開始編輯文章啦,編輯好了以後,再回到發佈的地方,按下張貼至網誌


如果文章有正確發佈,則會顯示發佈日期和時間。


到Pixnet上檢查看看吧!你應該可以看到自己剛剛在Google Docs上編輯的文章了。




give 發表在 痞客邦 留言(5) 人氣()


(圖片來源:rememberthemmilk.com官方網站)

請別懷疑這標題,網站的名字貨真價實、童叟無欺,就叫「記得買牛奶」。酷!這種具有「一開始真讓人猜不透」的網站永遠都很酷。我想你跟我一樣,想必剛看到時心中必定泛起了一絲絲的問號吧?

「真的是提醒我買牛奶嗎!?」
「可是我不喝奶耶?」
「這是什麼牧場的官方網站嗎?」
「那我可以訂購一隻乳牛嗎?」
「我自己有,謝謝」

你看你看,當你的眼球看到這則訊息,便將訊息傳達到你的大腦。腦內神經系統開始運作,產生好奇心,接著你的手指受到了支配,然後就不自覺的給他點了下去了....這這這,這可是非常先進的「大腦控制」技術阿 XD

拍謝,有點離題了(大概是最近看了一些以醫學為主題的漫畫之故=_=)

好吧,這個網站嚴格講起來,跟買牛奶的確是可以扯上點關係:這是一個工作排程和協同工作的網站,所以如果買牛奶也在您的工作範疇之一,那麼當然也可以列入工作清單啦。

網站標榜著任何地點你都可以獲得提醒:手機、電子郵件、即時傳訊(MSN、即時通、Google Talk等)。設計上是以白色底搭配藍色的標題底色,非常簡單清爽,頗有Google的風格(也有牛奶的感覺!?)。雖然網站的主站是英文介面,不過有著貼心的正體中文版,有圖有真相。


可以申請免費的帳號,也有Pro的帳號,Pro的帳號一年要charge US$25,多了iPhone Sync的工具。

先來看看免費的帳號有什麼功能吧。(註冊新帳號的手續很簡單,就略過不提了)

以下就是操作畫面,嗯,很淺顯易懂


把玩了幾分鐘,你會發現,這網站的功能就真的只有工作排程。雖說專注是件好事,但....這就像是走在寒冬深夜裡遇上快要收攤的小吃攤內點的陽春麵一般,真的是那麼陽春阿....(好歹來顆滷蛋吧!?老闆)

不過正如我說的,我是一個只把玩幾分鐘的人,所以如果漏掉什麼,也是很合理的。

上Google找找看有沒有人分享些密技,有了
大概就這些,看來台灣使用的人口並不多。不過繼續surf一些資料後,倒是發現了一個不錯的功能:

貼心的小秘書: RTM.Remind
機器人帳號: rtm.remain(at)Gmail.com


機器人簡介:
結合rememberthemilk.com網站提供的服務, 這個機器人會給你即時的計劃提醒, 但這個機器人目前好像是個單工工作機器人一樣, 只能等待它給你的提醒, 而你跟它說什麼都沒用, 要想設定計劃任務, 只能登錄網站. 不過這個網站與Twitter又很好的合作, 結合Twitter的機器人, 你可以與rememberthemilk.com實現互動, 甚至做到免費的手機短信提醒. 不過要介紹起來恐怕需要用很多文字, 目前這個日誌的版面已經很有限了, 所以這裡就不介紹它了.


引用網址如下
活跃在GTalk上的几个“小精灵” - Google(谷歌) - SOWANG 搜索爱好者论坛 - Powered by Discuz!

原來是通過robot的方式來實現訊息通知阿(sorry,用語一時之間無法轉回台灣的用法....囧>)

後話

具有直覺、簡單、清爽、反應速度快的網站或程式一直是令人讚賞的(澎湃激昂的介面也是不錯的啦,像下面引用的那個軟體)。只是就rememberthemilk來說,使用後有點令人意猶未盡,雖然簡單快速,但好像功能太少了些?

web介面意味著我需要時時刻刻連上網路才能新增工作和check工作進度,光這一點可能就不太便了,雖說google calendar也是如此,但是打著google的招牌,已經有為數眾多的sync tools問世了,可以和outlook、palm、windows mobile等同步。

補上北斗神拳掃毒軟體 XD

你,已經死了

(圖片來源:http://www.jcms.com.tw/newspaper/jcms-3330.jpg)

我又踏上了孤獨的旅程....

(圖片來源:http://www.jcms.com.tw/newspaper/jcms-3333.jpg)

give 發表在 痞客邦 留言(1) 人氣()

雖然原本的模板稍嫌陽春,但也算的上乾乾淨淨、家世清白,只是,在這個擠奶露臀講求花俏版面來吸引流量的年代,還是來改一下版型好了。

之前對CSS的了解不多,只知其用途但不知如何使用,找出塵封已久的CSS大全一書(Cascading Style Sheets, Eric A. Meyer著, 莊友欣譯,我的是二版,購於二手書攤)
CSS: The Definitive Guide, 3e / CSS 大全 第三版

K了頭兩章後便動手修改。

了解CSS的想法不難,CSS的目的和語法規則也淺顯易懂,了解基本的概念以後,剩下的就是對屬性的運用和排版的創意了。

目前這個就是我改完的成果,我想大家可以很清楚的了解一件事,那就是....

幹,我沒什麼美術天份

不過這不是本文的重點....

接下來是對Pixnet grey2模板的研究。找了一些對Pixnet模板修改的資料,發現repeat網友做了一個很詳細的圖表,看完這篇應該可以對grey2的模板有了清楚的了解。
pixnet blog css 解析 (grey2)

再來是工具的準備,首先是CSS編輯器。人家說殺雞焉用牛刀,可是我還是用了牛刀 囧>。我用Eclipse 3.3.1.1 + Aptana Plugins來編輯CSS。這個牛刀的好處是,它有CSS Code Complete的功能,當然其他優點就不用說了,統一的IDE介面總是讓人用起來得心應手。


另外輔助的工具是Firefox的CSSViewer和Firebug兩個套件,前者可以觀看目前所使用的CSS tag,後者則有強大的debug功能。

上工前先整理一下grey2所能使用的CSS class和ID,CSS有支援階層的效果,為了怕亂掉,我把每個Class&ID的parent element都詳細列出:

 * #Container {}
 *
 * #Container #Top {}
 * #Container #Top #BlogHeader {}
 * #Container #Top #BlogDescr {}
 *
 * #Container #Main {}
 * #Container #Main #Sidebar {}
 * #Container #Main #Sidebar .SidebarHeader {}
 * #Container #Main #Sidebar .Sideblock {}
 * #Container #Main #Sidebar .Sideblock .Sidetitle {}
 * #Container #Main #Sidebar .Sideblock .Sidetitle h4 {}
 * #Container #Main #Sidebar .Sideblock .Sidebody {}
 * #Container #Main #Sidebar .Sideblock .Sidebody .isLock {}
 * #Container #Main #Sidebar .Sideblock .Sidebody .isLock img {}
 * #Container #Main #Sidebar .Sideblock .Sidebody .userImg {}
 * #Container #Main #Sidebar .Sideblock .Sidebody .userLink {}
 * #Container #Main #Sidebar .Sideblock .Sidebody #userBlog {}
 * #Container #Main #Sidebar .Sideblock .Sidebody #userAlbum {}
 * #Container #Main #Sidebar .Sideblock .Sidebody #userGuestBook {}
 * #Container #Main #Sidebar .Sideblock .Sidebody #userProfile {}
 * #Container #Main #Sidebar .Sideblock .Sidebody #adminConsole {}
 * #Container #Main #Sidebar .Sideblock .Sidebody #CategoryPlugin a {}
 * #Container #Main #Sidebar .Sideblock .Sidebody .nodecoration {}
 * #Container #Main #Sidebar .Sideblock .SideBottom {}
 * #Container #Main #Sidebar #CalendarPlugin {}
 * #Container #Main #Sidebar #LatestArt {}
 * #Container #Main #Sidebar #LatestComments {}
 * #Container #Main #Sidebar #LatestTrackbacks {}
 * #Container #Main #Sidebar #userBlock {}
 * #Container #Main #Sidebar #ArchivePlugin {}
 * #Container #Main #Sidebar #CategoryPlugin {}
 * #Container #Main #Sidebar #LinksPlugin {}
 * #Container #Main #Sidebar #FavoritePlugin {}
 * #Container #Main #Sidebar #PageviewPlugin {}
 * #Container #Main #Sidebar #RSSPlugin {}
 * #Container #Main #Sidebar .SidebarFooter {}
 *
 * #Container #Main #Content {}
 * #Container #Main #Content .mainEntry {}
 * #Container #Main #Content .mainEntry .mainEntryTitle {}
 * #Container #Main #Content .mainEntry .mainEntryTitle h3 {}
 * #Container #Main #Content .mainEntry .mainEntryTitle h3 a {}
 * #Container #Main #Content .mainEntry .mainEntryBody {}
 * #Container #Main #Content .mainEntry .mainEntryBody a {}
 * #Container #Main #Content .mainEntry .mainEntryBody .date {}
 * #Container #Main #Content .mainEntry .mainEntryBody .mainEntryBase {}
 * #Container #Main #Content .mainEntry .mainEntryBody .extended {}
 * #Container #Main #Content .mainEntry .mainEntryBody .mainEntryfoot {}
 * #Container #Main #Content .mainEntry .mainEntryBody .mainEntryfoot a {}
 * #Container #Main #Content .mainEntry .mainEntryBody .mainEntryfoot a:hover {}
 * #Container #Main #Content .mainEntry .mainEntryBody .mainEntryfoot p {}
 * #Container #Main #Content .mainEntry .mainEntryBody .mainEntryfoot .trackback_url {}
 * #Container #Main #Content .mainEntry .mainEntryBottom {}
 * #Container #Main #Content .mainEntry .mainEntryBottom .ptop {
 * #Container #Main #Content #Comments {}
 * #Container #Main #Content #Comments .commentTitle {}
 * #Container #Main #Content #Comments .commentTitle a {}
 * #Container #Main #Content #Comments .commentBody {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox .commentheader {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox .commentcontent {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox .commentcontent replyBox {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox .commentcontent replyBox replyContent {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox .commentcontent replyBox replyInfo {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox .commentposterinfo {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox .commentposterinfo br {}
 * #Container #Main #Content #Comments .commentBody .CommentInnerBox .commentposterinfo img {}
 * #Container #Main #Content .listall_msg {}
 * #Container #Main #Content .listall_pagelist {}
 * #Container #Main #Content .listall_date {}
 * #Container #Main #Content .listall_title {}
 *
 * #Container #pagefooter {}
 * #Container #pagefooter #Bottom {}
 * #Container #pagefooter #Bottom .style1 {}
 * #Container #pagefooter #Bottommenu {}


上表可以對照repeat板友辛苦整理的圖示說明。

大概幻想一下自己要的成果和了解等等要動手的部位後就開工了,整個動刀的過程大概花了我4個小時左右。扣掉美工編排的部份來說,一開始對CSS的selector與declaration的組合搭配的不是那麼熟練。例如,我一開始是針對每個Class去做修改,包括加上他們特定的字型、顏色、邊界....等,不過後來發現這樣的修改方式並不恰當,因為改出來如果很醜就很難調整,就算Eclipse的取代功能很強大,但是這也不是一個良好且適當的修改方式。

後來改變了語法的排列,將某些常用的設定單獨抽出來,例如字型有字型單獨的設定,對每個Class和ID則採用累加的效果,這樣改起來方便多了。

body {
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}
/* 使用字型10px的Class&ID */
#Container #Main #Sidebar #LatestComments .SideBody {
    font-size: 10px;
}
/* 使用字型12px的Class&ID */
input, select,
#Container #Main #Sidebar .Sideblock .Sidebody,
#Container #Main #Sidebar .Sideblock .Sidetitle h4,
#Container #Main #Content .listall_date,
#Container #pagefooter #Bottom,
#Container #pagefooter #Bottommenu,
#Container #Main #Content #Comments .commentBody .CommentInnerBox .commentposterinfo,
#Container #Main #Content .mainEntry .mainEntryBody .date {
    font-size: 12px;
}
/* 使用字型16px的Class&ID */
body {
    font-size: 16px;
}
/* 使用字型18px的Class&ID */
#Container #Top #BlogDescr,
#Container #Main #Content .mainEntry .mainEntryTitle h3 {
    font-size: 18px;
}
/* 使用字型24px的Class&ID */
#Container #Top #BlogHeader {
    font-size: 24px;
}
/* 要套用粗體的Class&ID */
#Container #Top #BlogHeader,
#Container #Main #Sidebar .Sideblock .Sidetitle h4,
#Container #Main #Content #Comments .commentTitle,
#Container #Main #Content .mainEntry .mainEntryTitle h3,
#Container #Main #Content #Comments .commentBody .commentInnerBox .commentheader {
    font-weight: bold;
}
body, #Container #Top #BlogHeader {
    text-align: left;
}


總結來說,這次的修改還算順利(因為CSS真的很簡單),不過對於屬性的用法只能算是粗淺的階段(書都還沒看完1/10呢)。有些想法可以搭配JavaScript來實現,到時候可以用的東西就更多啦。

謎之聲:阿?配色?配色很奇怪你知不知道!?我....我知道

give 發表在 痞客邦 留言(0) 人氣()

CSSEZ是一個所見即所得的線上CSS編輯器,編輯好的檔案可以放在WordPress等Blog中直接使用。這編輯器由Kei Kubo所開發,目前釋出了1.0 beta版。他目前正在募集該線上編輯器的翻譯者,有意願參與翻譯的人,可以寫信給他。

參與這個翻譯的人會被掛上contributer contributor並留名在Q&A中。

募集翻譯的網址如下
http://www.cssez.com/translation.php?l=tw

寄信給Kei Kubo
http://app.formassembly.com/forms/view/2718

相關連結

give 發表在 痞客邦 留言(0) 人氣()