Showing posts with label blog widget. Show all posts
Showing posts with label blog widget. Show all posts

Monday, October 20, 2008

訂閱「教育局過去七天發出的新通告」

其實一早已經好想做這件事,因為聽過朋友講,就算本身無提供RSS Feed的網站,都可以用Feed Creator來自製RSS Feed。
昨日終於的起心肝去試,下載了兩個唔同的RSS Feed Creator Application,點知.... 嘩!痴線o架!要人續條新link自己每次加上去,再upload過一個新的xml...-_-'



之後問一問高人,指教了其實網上有很多online service提供此服務,於是又去search、search、search,試了兩個,終於這個叫Dapper的網站可以算是成功製作了一個RSS Feed的link。


這個Dapper其實幾powerful,可以把網站變成Rss Feed、Xml 或 widgets,完全免費,使用時有多段screencast介紹(不過由於我太心急,沒有點睇,撞了很多次版),算是一個值推介的online service。

我製作了的『HK EDB Circular widget』如下:

Add to your site
powered by Dapper

訂閱『教育局 - 最近七天通告』請click以下連結:
http://www.dapper.net/transform.php?dappName=HKEDBCircularsVersion3&transformer=RSS&extraArg_title=Title&extraArg_description[]=Content&extraArg_pubDate=Date&applyToUrl=http%3A%2F%2Fwww.edb.gov.hk%2Findex.aspx%3Fnodeid%3D73%26langno%3D2%26search_type%3D1%26is_submit%3D1%26circular_distribution%3D0A
這是訂閱後在ipod touch的Google Reader內看到的樣子:


點擊『繁體中文』的連結後,還可以在新視窗即時看到通告的pdf檔:


現在個人流動通訊裝置越見普及,我希望我的同行可以多使用『訂閱』功能,把自己隨時都能與外界保持聯系,雖然工作時間長,環境及社交圈子陝窄,但我相信靠著這些新的科技,仍無阻自己衝出校園,與世界同行的心。我回來後常有一種『被困』的感覺,多謝互聯網的偉大發明,我自己努力向外闖之餘,也要把這個訊息帶出去!

Monday, April 7, 2008

Blogger - NEW elements in "draft.blogger"

Blogger原來係知道自己的pre-setted elements好唔夠這個問題架!
不過反應太慢了!所以用blogger的user都已在網上四出找其他人寫的script去解決現有的問題。
今日上 http://draft.blogger.com 的試驗網站,已經可以在 "add a page element"度看到以下的新功能。
雖然大部份我已經用其他網上說明的方法解決了,但現在blogger出了自己的element,我當然樂於轉用啦!

Wednesday, January 9, 2008

自製Translate blog widget

今日再modify一下個blog translate的外觀,加了國旗好像『似樣』很多,現在算是完成,可以簡單的介紹一下整個製作過程了。


(1) Google Translater translate script
由於在Google Analytics上看到好多外國的瀏覽者,都一來就走,所以於是很想幫個blog整番一個translater,希望可以吸引埋其他國家的讀者。在網上search過,找不到現成的widget,可以install plug-in的都只限Wordpress的blog,於是終於找到這篇Instantly Translate Your Blog « Lorelle on WordPress比較長細介紹用Google Translate做成,而又可以放在任何html上使用的script:
<a href="http://translate.google.com/translate?u=
網站地址&amp;langpair=原來語言碼%7C翻譯後語言碼&amp;
hl=翻譯後語言碼&amp;ie=UTF-8&amp;
oe=UTF-8&amp;prev=%2Flanguage_tools">

(2) 2 digit language code
但這段script需要用到2 digit的language code(語言碼),所以找到了以下這個有關language code介紹的網站:
ISO 639: 2-letter codes
http://www.w3.org/WAI/ER/IG/ert/iso639.htm

簡單的介紹其中幾個較常用的:
繁體中文 Traditional Chinese: zh-TW
簡體中文 Simplify Chinese : zh-CN
英文 English : en

注意:由於Google Trnaslate的功能現時是以英文為翻譯的media,所以如果網站是用英文寫成的,可以翻譯成多個語言,但如果是我一樣用繁體中文寫的網站,就只可以翻譯成英文或簡體中文。

(3) 國旗flag icon
另外如果想widget能夠吸引到人,一定要用到國旗的icon,我就找到以下這個下載國旗icon的網址:
Icon Drawer - Free Flag Icons
http://www.icondrawer.com/free.php

下載解壓後,可以看到folder內已有4個放不同大小(16, 24, 32, 48)國旗icon的folder,內裏還把國旗以alphabetical order放在不同的字母folder內,可謂非常細心。
我自己就選用了24 pixel的國旗,感覺上剛剛好,因為16實在細得可憐。

(4) My sample
各位如果同我一樣都是以繁體中文作寫作語言,又想製成一個和我在這個blog上顯示的差不多的script,大可以參考以下這段code:

Translate <a href="你的網址">
<img border="0" width="32" alt="translate by Google translate
" src="32x32pixel香港區旗圖片的連結" height="32"/>你的網站名稱</a> to
<a href="http://translate.google.com/translate?u=你的網址&amp;
langpair=zh%7Cen&amp;hl=en&amp;ie=UTF-8&amp;
oe=UTF-8&amp;prev=%2Flanguage_tools">

<img border="0" width="24" alt="translate by Google translate" src="24x24pixel英國國旗圖片的連結" height="24"/>
<img border="0" width="24" alt="translate by Google translate" src="24x24pixel美國國旗圖片的連結" height="24"/>
<img border="0" width="24" alt="translate by Google translate" src="24x24pixel澳洲國旗圖片的連結" height="24"/>
<img border="0" width="24" alt="translate by Google translate" src="24x24pixel加拿大國旗圖片的連結" height="24"/>
English</a>
<a href="http://translate.google.com/translate?u=你的網址&amp;
langpair=zh-TW%7Czh-CN&amp;hl=zh-CN&ie=UTF-8&amp;
oe=UTF-8&prev=%2Flanguage_tools">
<img border="0" width="24" alt="translate by Google translate" src="24x24pixel中國國旗圖片的連結" height="24"/>
<img border="0" width="24" alt="translate by Google translate" src="24x24pixel星加波國旗圖片的連結" height="24"/>
Simpify Chinese</a>
*請先自行下載國旗icon,並上載至一些網上相簿或網頁空間,再把該圖片的URL貼在適當位置。

Tuesday, January 1, 2008

Nomao ~ embed personal map in Blogger

近來雖然好勤力寫了幾篇post,但係廣告收入就無點進賬,所以今日就自己幫襯自己,點知一click之下就找到這個叫 "Nomao a place to bee"的網站,真係錯有錯著。


這個網站是在google map中製作自己的location bookmark,而且還可以將location bookmark作仔細分類,之後可以選擇那一些bookmark來製作自己的blog widget。

知道有好幾位同事都希望寫一些關於美食地圖吃喝玩樂地圖之類,相信這個online services都幾用。

最好的就是他結合了Google map的強大功能,而且完全support中文,可以話係估佢唔到,左邊的側欄中,我已做了一個叫"Marie's Snapshot Map"的例子,大家可參考看看。

Tuesday, December 11, 2007

Blogger Recent Comments Widget

講番做Comments的widget,建這個blog都真係『見步行步』,之前莫講話comments,連有無人會來都未知,所以都無唸過原來blogger預設的widget連comments都無!
剛剛有兩個friend好比面給了個comment,我先驚覺好難可以post到出來比人知,於是就search到這個叫Blogger Recent Commments的widget。

初初去到一睇,都有o的唔明,原來個post就已經可以加到個widget比自己個blog!
只要填上自己的設定及blog資料,一click "Add widget to my blog",就會彈出一個add blog element的box,話咁快就整!

不過睇過入面段code,無咩variables可以改,只係得Comments to display同summary size兩個位可以改,至於字型、字大小,樣式,都係無得改。

但總算易安易用,用住先啦!

Wednesday, December 5, 2007

自製電郵訂閱 Email Subscriptions

坐言起行,但究竟點先可以找到給別人電郵訂閱我個blog的script或方法呢?
在search engine試過幾個key word都唔得,於是我就想起,平時我都好似有電郵訂閱一個blog的,就去看看那個blog是怎樣給人設定電郵訂閱吧!

講開這個我唯一訂閱的blog,其實也是和google有關的,因為太想知道多些關於google的資料和消息,所以上年無意在網上search google的資料時找到這個叫月光博客的blog。

一看電郵訂閱的原始檔後,便知道原來是用了FeedBurner的服務。

FeedBurner一直在網絡上像是聽過很多次,但一直也不知道究竟是個甚麼東,現在好了,就一試吧!

Register的方法很簡單,完成後急不及待去seach有關email subscribtions的instructions。


Adding FeedBurner Email to your TypePad or Blogger blog

FeedBurner Email Overview and FAQ


一看之下原來方法十分簡單:
登入後在 Publicize -> Email Subscribtions

直接有個位叫 "Use as a widget in…"

只要選Blogger一click "Go!",就即時比人彈去blogger開element,
當然要自己中文化一下預設的設定咁就完成了,真係開心,所以用blogger真係好,去到邊都有專用設定,唔洗煩!



之後即時自己試下訂閱自己:
方法都係好簡單,打完email後click subscribe,就會彈出一個FeedBurner的box,打番數個text就可以真正submit。
之後去check mail,click番條確認URL,就真正完成訂閱。

番去FeedBurner度睇先,嘩!真係見到有一個訂閱者呀!
雖然係自己扮自己粉絲,都好開心!好過無嘛!嘻嘻!
各方好友,如果有興趣幫幫小女子,當鼓勵一下既請加入電郵訂閱啦!好耐都唔該呀!

自製訂閱按鈕

Yahoo其中一個令讀者及瀏覽增加的功能,就是『訂閱』,於是我便積極找一些可以製作訂閱功能的方法。
這個訂閱貼紙產生器,頗易用,我也即時加了幾個button在blog內試試。

做時留意幾點:
(1) 選好想要的貼紙後,在『部落格RSS種子』中請填:http://yourblog.blogspot.com/atom.xml (假如是blogger user)
(2) 填好『部落格標題』後,按『產生貼紙』,blogger user只要copy『貼紙的HTML碼』便可以放到template 的 HTML/JavaScript element 中了。


不過始終在香港,用reader訂閱的人並不多,加上好多個button,連我都未知是甚麼,所以都只是加了一些我知道的,如:Yahoo, google, ....之類。希望之後可以找到一些一click後就可以以後都send email 通知的方法就好了!

不過我會繼續努力的!加油!

Thursday, November 29, 2007

Blogger Ads

見Google Adsense無咩起色,呀Man推介我加 Blogger Ads,因為Blogger Ads除了收入比Google Adsense高外,更會幫你的blog作宣傳,希望加了這個Ads後對我blog的瀏覽量有起色吧。

說回Blogger Ads,其實申請同安裝的方法都很容易,因為這個Ads明顯就是為Blogger而設,在blogger的設定方面有很詳細的圖文指引,只要click一下下面的標誌,作簡單登記後便可以進入戶口收取廣告程式碼。

希望大家都支持一下,click來加入吧!

Monday, November 26, 2007

Picasa SlideShow

近來玩facebok,由於我係google既粉絲,所以少不免在facebook的applications上search一下有關google的玩 意,找到一個叫"Picasa Gallery Slideshow",一試之下,才知道原來picasa是有slideshow embed code provided的,只是在英文版先有這個button!


於是便即去picasa的設定中改為英文,嘩!真係有o架!
想一想既然有段embed code,除咗可以放在facebook,即係放在blog都得啦!
雖然現在blogger已經有一個新增一個element叫"投影播放"但係覺得佢唔夠彈性,太細,又唔可以改code,試過用,但感覺只係好過無。
而家段embed code係完全open,大小可以隨便更改,其中的heigh同width比例係剛好"1:1.5",我用這個比例來做適合自己blog中側欄的width 22o pixel,於是計埋heigh係"147 pixel",就咁就搞掂了!

你睇幾靚!好o野!!!

同場加影最新一輯靚相,size用700pixel width,embed落blog的內容,都幾OK啩?!

Blogger Tag Cloud

終於可以成功做到用Tag Cloud代替長長的標籤列,其實方法都好簡單,我主要參考以下這個用google打"blogger tag cloud"後search回來的blog指示:

http://phy3blog.googlepages.com/Beta-Blogger-Label-Cloud.html

但要留意幾點:
(1) 在【範本】->【修改HTML】中記住鈎選【展開小裝置範本】
(2) 把原本的HTML先paste到notepad作backup及修改
(3) 找 這個位置後在此段的前及後插入第一及第二段code
(4)最後
一段位置,把第三段code 取替了便完成了

(5) 至於Tag Cloud中的大小顏色等,都可以在第二段code中作更改:

var cloudMin = 1; -> 最小顯示的標籤數量,"1"代表只要有一個標纖都會顯示出
var maxFontSize = 20; -> 最多標籤的字型大小
var maxColor = [0,0,255]; -> 最多標籤的字型顏色
var minFontSize = 10; -> 最少標籤的字型大小
var minColor = [0,0,0]; -> 最少標籤的字型顏色

原本標籤:



更改後新標籤:



Thursday, November 1, 2007

Marie's Voki 好搞笑!





多謝好同事兼靚女同事Athena介紹我用這個voki,好搞笑呀!又得意。
最緊要係免費,大家有興趣可以去http://www.voki.com/登記個戶口來玩吓啦!
如果有唔明白,可以參考Athena的blog:
http://dynamic-it.blogspot.com/

Tuesday, October 23, 2007

嵌入picasa相簿

光影魔術手
在下【阮瑪莉】
Blogger最好的地方,其中之一就係對script的限制好少,很多embed code都可以隨意應用,增加了user的個人性及彈性。
Picasa相簿中,在建立了相簿後,都有一段embed code可以給user copy落blog或網頁,在blogger就更加是使用自如。

加入Youtube短片

早前研究過一個香港的筆順軟件estroke,造了一個自己名字中,三個字的筆順,再用movie maker加了首背景音樂,製作成一段moive放了上youtube。



今次就試試在blogger中embed一段youtube的短片。
段script都係睇雜誌抄出來,不過都好work:

<embed scr="http://www.youtube.com/v/xxxxxxxxxxx"
xxx="" type="application/x-shockwave-flash"
wmode="transparent" height="xxx" width=""></embed>




由於我段片本身係425x355,我按比例縮成可以放在我240闊的sidebar度,所以縮成220x184。
效果都算OK。

Friday, April 20, 2007

BOX.net


http://www.box.net/
今日同事介紹我用這個免費的storage戶口,覺得非常之咁『得』!
佢除o左係免費外,重有1Gb的容量,interface 幾Ok之餘,重可以做好多唔同的設定。
例如將指定的file或folder share給不同的朋友,把一些預先選定的file及folder組成一個 box widget再embed入去任何網頁或blog,在share給朋友的時候更不用重新在網站上打電郵地址,它可以把hotmail、gmail、yahoo mail、outlook....的address book 『吸』過來,比你在那個address book上慢慢選。
當然要一提的就是它上載的速度很快,更支援中文的檔名,mp3檔更可以有即時網上試聽的功能等等。
大家不防一試!
以下做了一個testing的folder給大家試試,mp3可以直接網上聽,wmv要download才可以開啟,jpg檔可以網上preview,還有doc檔都有圖示顯示,support所有中文檔名...

相關文章

Related Posts with Thumbnails