顯示具有 Blogger 標籤的文章。 顯示所有文章
顯示具有 Blogger 標籤的文章。 顯示所有文章

2008年7月9日

使用 Blogger 的內嵌回應模版 - 免開新網頁囉!

說真的 Blogger 的意見面板向來是蠻討厭的,都沒辦法直接在文章頁面回應,這樣子其實也沒有什麼太大的壞處啦! 只是很多使用者會因為要多按一個張貼留言還要多等一個網頁載入降低了回應文章的意願,甚至有的眼睛比較大顆的還會跟你說他不知道要怎麼留言......

之前也有出現過第三方意見管理的服務,也是可以放在內嵌式面板,但是它和原本 Blogger 的意見系統是分開的,怎麼樣都覺得不妥,還是 Blogger 本身提供的話是最好了。

不過現在一切問題都解決啦! Blogger 終於不負眾望推出了內建回應面板的功能,在參考 Josh's Blog 後,我順利的把內嵌的留言面板改出來了! 感覺還不錯吧!

至於修改的方法~ 咳咳,雖然 Josh's Blog 上已經寫的很清楚了,不過基於紀錄的理由,我還是來照本宣科一下好了,首先先到 Blogger Draft → 版面配置 → 修改HTML →展開小裝置範本,把底下這段:<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</p>
取代成:<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>

就像這樣:

改完後請點選儲存範本,然後請到設定→意見→已內嵌下列文章,然後按儲存即可!

  • 7/13, 08 更新 → 感謝 dora2002 ,加注需要使用 Blogger Draft 的提醒。

2008年5月31日

讓你的 Blogger 變成你的 OpenID !

  在 OpenID 越來越流行並成為未來趨勢的情況下,兩大入口網站 Google 與 Yahoo! 都紛紛支援起 OpenID 囉!其中 Google 以自家的 BLOG 服務 — Blogger ,來提供 OpenID 的服務,而 Blogger 具備的 OpenID 功能其實預設就已經開啟,因此你無需再另外註冊一個 OpenID直接使用 Blogger 的就 OK 囉! (這也是 OpenID 的初衷吧?一個帳號,走遍天下!)

  其實在預設情況下, Blogger 本身的 OpenID 功能是開啟的也就是說你只需在你的個人部落格做點小小的修改就可以在支援 OpenID 的網站中使用 OpenID 登入囉!首先,請先登入 Blogger 後台,並選擇 版面配置 → 修改 HTML 於部落格模版的<head><head>之間插入以下內容:
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
  看來就像這樣:
<head>
<link href='http://www.blogger.com/openid-server.g' rel='openid.server'/>
...(略)...
</head>
  基本上這樣就可以了。 And then, let's try it !

  拿 TwitterFeed 做為例子,這是一個典型的使用 OpenID 的網站:  登入時請填入你的 BLOG 網址,按下 Login 後,網站會帶你回 Blogger 進行確認:  如果按「是,只允許一次」的話,那下次登入該網站他還是會問你一遍,若你按「是,永遠」的話,下次你登入 TwitterFeed 就不會再看到這個畫面了。當選則了是以後,就可以看到成功登入的畫面囉!往後只要你看到可以使用 OpenID 的網站,就可以利用該帳號登入囉! By the way, 你在本格留言亦可使用 OpenID 唷!

2007年9月30日

Blogger 真是可愛啊 XD

  由於Blogger的模版的HTML編輯器真的給他不是很好用,字一片黑黑的要編輯某個部份的時候真的會給他找到眼睛脫窗,所以想說把CSS分離出來放到Google Page去,這樣要編輯CSS也就比較方便了。沒想到把CSS分出來以後,竟然發現BLOGGER後台在「網頁元素」的地方,竟然套上CSS樣式表了耶(右圖) :o

  之前CSS還放在樣版裏面的時候是沒有套上樣式的,沒想到這個可愛的Blogger竟然會把外掛的CSS給引到控制中心,實在是滿好玩的這樣。 :p 而且由於我在CSS中有把navbar(導覽列)給display:none,所以在「網頁元素」中本來上面會有一條navbar的網頁元素也跟著不見了,真是給他好玩 XD ...

2007年9月29日

輕鬆加入部落格觀察的行列

  • 文是針對 Google Blogger 以及 無名小站 用戶所寫,若你使用的是其他的BSP,則部份操作方法可能會有所不同。
▲上圖就是網站「部落格觀察」的Logo

  這陣子 部落格觀察(look.urs.tw) 這網站可說是聲名大噪,由於方便的觀察功能以及詳盡的分析資料,讓很多人都把自己的BLOG加入了部落個觀察的行列。除了分析資料外,該網站也有「藍眼關注」和「綠眼關注」兩種獎項,獎勵被受矚目的人氣部落格(該網站主要以全球華文部落格為主)。 如果你也想加入部落格觀察的行列的話,你只要依照本文的介紹,就可以輕鬆的加入部落個觀察囉!

  在加入部落格觀察以前,你必須先註冊一個 部落格觀察 的帳號,這樣才能認領你的部落格。註冊的方法相當簡單方便,而且也沒有郵件驗證的手續。

  首先呢,你當然必須先連到 部落格觀察 ,接著請在網站右邊的「您的帳號」一欄點選「註冊」:   依照上面指示填好資料後按註冊,就完成註冊手續囉!

  • 登錄你的部落格
  加入部落格觀察的第一步,就是把你的部落格登錄到 部落格觀察 的資料庫中,這步驟相當簡單,你只需記得你的部落格網址,就 Google Blogger 和 無名小站 來說,網址如下:
    • Google Blogger:
      • http://帳號.blogspot.com/
    • 無名小站
      • http://www.wretch.cc/blog/帳號
  其中,Google Blogger所謂的帳號,是指你建立部落格時所選定的,不一定是你的登入帳號。而無名小站的部份,由於最近 Yahoo! 和 無名小站 帳號統整,如果你有合併帳號的話,那這部份就是你舊的無名帳號,如果你是新的無名小站用戶,則沒有這個問題,就是你的Yahoo!帳號。

  搞清楚網址以後,接著請在部落格觀察的首頁中選擇「新增部落格」,並在此處輸入你的部落格網址,並按「新增」:  稍待片刻你的部落格就會登錄到部落格觀察裏面囉(此時並不會有任何的回應)!

  • 認領部落格
  雖然已經登錄到 部落格觀察 ,但你必須「認領」你的部落格,才能表示該部落格是你的,且這樣才能使用所有部落格觀察的功能。

  首先請登入你的部落格觀察帳號,並且利用網頁上方的搜尋工具搜尋你的部落格(打你部落格的名字,通常打一部份就可以了),如果有多個符合的搜尋結果,他會把它列成表(如果只有一個搜尋結果,就不會有列表了,他會直接帶你到以下畫面),請先找到你的部落格點進去(點部落格名稱旁的「資訊」),此時請看到表格中會有個 BlogID,請把它記下來:  接著請按頁面上方的部落格觀察LOGO回到首頁,並在首頁右邊「您的帳號」一欄選擇「認領部落格」,接著它會問你 Blog ID,請輸入剛剛記下來的 Blog ID 並且「申請」,接著他會出現確認畫面,如果確定是你的部落格沒錯的話,就按「確認」吧!
  接著,為了確定你是部落格的主人,他會要求進行驗證,他提供了幾項方法,但通常發新文章的方式是比較方便的(我覺得啦),請依照指示發一篇包含確認碼的新文章(只要有確認碼就好),並且按下認證鈕進行認證,認證成功後就完成認領手續囉!(此時剛剛那篇包含確認碼的文章就可以刪除囉!)

  • 掛上部落格觀察的牌子
  雖然你已經把部落格登錄到部落格觀察中了,但是由於並沒有任何可以收集資料的東西,所以還沒有任何資料,所以我們要在部落格上放偵測器,這麼一來就可以收集到統計要用的資料,而排名或者其他數據也就源源不絕的收集到囉~ :D

  首先還是得先到部落格觀察登入,並且選擇「我的部落格」,再點選你的部落格名稱,進入資料頁。此時你可以發現資料頁中還沒有任何資料,排名是0,其他數字也都是不正確的,這就是因為還沒有收集到資料的關係。接著我們要「取得貼紙」:  接著畫面中會出現一"拖拉庫"的貼紙,請先選一張你喜歡的貼紙,其中,你可以發現貼紙可以分為「JavaScript版」和「圖像版」兩種(注意!「純JavaScript版」分類中的貼紙都沒有圖像版可用),通常這兩種並沒有多大差別,只是在於設計的不同,但由於有些瀏覽器的安全設施會去擋JavaScript,而且JavaScript版也有圖片(另外也有可能訪客的瀏覽器舊到不支援JavaScript),所以我個人是比較偏好圖像版。(另外無名小站用戶請注意!無名小站只允許金卡用戶使用JavaScript,所以銀卡和免費用戶就只能用圖像版的,Google Blogger用戶則沒有受限)

  確定了你要的貼紙及版本(JavaScript or 圖像版)後,請把右邊對應的程式碼複製下來,例如我要「經典貼紙」中第2張的圖像版,就把下圖框框中的程式碼複製下來:
    • Google Blogger
  如果你是用Google Blogger的話,請你在「版面配置」→「網頁元素」中「加入網頁元素」,並選擇HTML/JavaScript類別:  接著把剛剛的程式碼貼在裏面:  最後再按「儲存變更」並把該元素放在你想放的地方就可以了。
  請點在部落格右邊「最新的引用」底下的「資料夾管理」:   接著你會看到三顆按鈕,請點選「新增資料夾」,然後會多出一個新資料夾,你可以把名稱改成你想要的名字,例如「部落格觀察」等等:   接著按確定後就可以儲存起來了,接著在剛剛新資料夾的最右邊有個連結管理,按下去以後會跳到另一個頁面,請按「新增連結」,並把剛剛在部落格觀察中複製下來的程式碼貼在名稱欄裡:  最後請再按下確定就大功告成囉!

2007年8月28日

BLOG表情符號的功能

  前陣子參考 Ben's部落不及格 中的 部落格會笑了!Blogger Smiley! 一篇文章,幫網誌加入了表情符號的功能,此功能除了可以用在文章中,在回應區也是可以行得通的,但好像沒多少人知道這回事,在此就介紹一下每個表情符號的代碼吧! :)

目前可用於本BLOG的表情符號及其代碼如下:
  • 微笑:) or:-) 
  • 大笑:D or:-D 
  • 害羞:$ or:-$ 
  • 難過:( or:-( 
  • 吐舌:p or:-p 
  • 眨眼;) or;-) 
  • 親親:k or:-k 
  • 火大:@ or:-@ 
  • 閉嘴:# or:-# 
  • 囧臉:x or:-x 
  • 驚訝:o or:-o 
請注意:表情符號前需留1個半形空白。
  另外表情符號的效果只有在可執行JavaScript的環境下才能看到。各位可以在回覆本網誌的文章時多多利用喔!~ ;)

表情符號功能可用於部落格的回應區以及留言板(CBOX)中,點選留言板右下角的表情符號功能可以更快速的選取表情符號喔!
  • 01/23, 08 更新 →由於某些理由,所以表情符號功能已經從本站移除。

2007年8月26日

Blogger 影片功能現身啦

▲Blogger傳說中的影片功能,終於正式現身啦!
  之前在Blogger Draft測試後台的影片上傳功能,此次終於正式的在Blogger亮相啦!這次Blogger上傳影片的功能和圖片上傳的功能不太一樣,按下去後是直接顯示上傳介面,不是開新視窗的方式,當然這樣有好處也有壞處,好處嘛~就是開啟的速度會比較快,按下去就有,不用再等網頁載入,壞處方面就是在上傳的過程中就無法繼續編輯文章囉!
  來看看Blogger的影片上傳介面:  整個看來還算不錯這樣,不過上傳個影片還要簽署同意…好像頗怪的…… :x 不用想也知道上傳應該很慢,不過至少想放影片在Blogger上的朋友們,可以不必那麼大費周張去找地方放了。

2007年8月15日

5分鐘換張Blogger首頁橫幅

  • 本文是專為Blogger用戶所寫,若你不是用Blogger,以下操作可能不適用於你的網誌。
  之前在網路上看了很多有關Blogger Hack的文章,也有看過不少教人修改橫幅的,但是總是要自己跑到 修改HTML 那邊,自己慢慢改程式碼。心想:「難道Blogger真的這麼『不人道』嗎?連用圖片當作Title都要勞駕程式碼??」可能是舊版Blogger不支援吧?不過新版BLOGGER可是提供簡單易懂的介面喔!誰說要網誌漂漂的,就一定要修改程式碼呢? :-)

  修改方式很簡單,首先,當然要把你要放上去的橫幅準備好,這部分當然我也不好多做說明,不過我想PhotoImpact裡面有個什麼網頁元素設計師吧?那玩意應該白痴都會用....囧 反正就很簡單就可以做出一個像樣的橫幅囉!

  接下來呢,請到Blogger後台,到網頁元素的地方,並且編輯你Blogger的"標頭"。接著呢,底下有個圖片的部分,請選擇從你的電腦上傳,並按瀏覽,選擇你準備好的橫幅。選擇好後,他會自動開始上傳,等到你看到你傳的橫幅後,就表示已經上傳完畢了。接著請先按「儲存變更」。

  還沒完喔!此時如果你進到你的Blogger應該會是橫幅和文字擠在一起的狀況,因此,我們必須在按一次編輯標頭,Blogger會載入你上傳的橫幅檔,等到載入完畢後,底下會多出一個「位置」的選項,請選擇「不需使用標題和說明」,在按「儲存變更」,這麼一來就可以用橫幅圖片來替代文字標題了!

2007年8月9日

用ffmpeg輕鬆搞定手機影片以及FLV—3gp、MPEG4、AMR、flv

  • 本文是針對 Ubuntu Edgy Eft / Feisty Fawn 所寫(本文也同時適用Kubuntu/Xubuntu),如果你是用其他作業系統,可能操作方式會有所差異。
  目前的多媒體手機可是相當普及,而手裡有著這麼好用的手機,不給他放點影片進去看看還真的是有點給他浪費。雖然沒有漂漂的圖形模式可用,不過要慶幸的是,要製作出手機支援的影片格式,在Linux下幾乎可以說比在Windows下還方便喔!

  沒錯!我們用到的工具就是ffmpeg,由於 Ubuntu 預編的ffmpeg並不支援AAC/FLV/AMR…等格式,所以在使用之前,我們必須重編ffmpeg,方法很簡單。
  • 編譯ffmpeg
在一切工作開始前,請啟用 /etc/apt/source.list 中的 multiverse 和 universe 中的源:
然後請在文字模式下或開啟一個終端機視窗,並執行apt安裝必要的套件:▲請在/etc/apt/sources.list中啟用上述兩個源,以上是在kate中編輯的示意圖。
接下來必須先更新套件列表:
sudo apt-get update

然後就是安裝需要的套件囉:
sudo apt-get install quilt libsdl1.2-dev libogg-dev libvorbis-dev liba52-dev libdts-dev libimlib2-dev texi2html libraw1394-dev libdc1394-13-dev libtheora-dev libgsm1-dev liblame-dev libxvidcore4-dev libfaac-dev libfaad2-dev

為了確保等一下編譯時不發生問題,請執行以下指令:
sudo apt-get build-dep ffmpeg

完成後接下來請切換到/usr/local/src:
cd /usr/local/src

還要切換到root,這樣才能順利編譯,如果你沒有啟用root用戶(Ubuntu預設不啟用),執行以下命令就可以切過去了:
sudo su

再來開始下載ffmpeg原始碼和patch囉!
apt-get source ffmpeg
wget http://blogger.rukker.org/dl/ffmpeg-0.cvs20060823_enable_amr.patch.bz2
wget http://wclhfl.dyndns.org/pub/ffmpeg_enable_amr.patch.bz2

當一切下載完成後,接下來要把patch給補上去:
cd ffmpeg-0.cvs20060823 註:切換到ffmpeg原始碼資料夾,注意!你的不見得會跟範例一樣。
bzcat ../ffmpeg-0.cvs20060823_enable_amr.patch.bz2 | patch -p1
bzcat ../ffmpeg_enable_amr.patch.bz2 | patch -p1

一切大功告成後,就可以開始編譯ffmpeg囉!我們用risky模式,這樣就可以支援更多格式:
DEB_BUILD_OPTIONS="risky" dpkg-buildpackage

喝杯咖啡,等待編譯完畢,編譯完畢後,請跳回/usr/local/src,那裡應該就有ffmpeg的deb檔囉!二話不說!安裝吧~
cd ..
dpkg -i ffmpeg_0.cvs20060823-3.1ubuntu1_i386.deb libavcodec0d_0.cvs20060823-3.1ubuntu1_i386.deb libavformat0d_0.cvs20060823-3.1ubuntu1_i386.deb libpostproc0d_0.cvs20060823-3.1ubuntu1_i386.deb

注意!你的套件名稱不一定跟我一樣。
由於套件是自己編的,系統會誤認為它是舊版,所以我們要停止系統更新它,以免好不容易編出來的心血泡湯:
▲這是在Kate當中的操作示意圖。
請開啟(沒有的話舊建立)/etc/apt/preferences,並加入以下內容:

Package: ffmpeg
Pin: version 0.cvs20060823-3.1ubuntu1
Pin-Priority: 1001

Package: libavcodec0d
Pin: version 0.cvs20060823-3.1ubuntu1
Pin-Priority: 1001

Package: libavformat0d
Pin: version 0.cvs20060823-3.1ubuntu1
Pin-Priority: 1001

Package: libpostproc0d
Pin: version 0.cvs20060823-3.1ubuntu1
Pin-Priority: 1001

注意!版本部分請修改成你所使用的版本,你的版本號不一定跟我一樣。
存檔後,安裝工作就大功告成啦!
  • 轉檔
現在,你可以利用FFMPEG來轉換你想要的媒體檔囉!
以下是範例:
    • To FLV: ffmpeg -i movie.avi -acodec mp3 -ar 11025 movie.flv
    • To MPEG4: ffmpeg -i movie.avi -vcodec mpeg4 -acodec aac movie.mp4
    • To 3GP:ffmpeg -i movie.avi -s qcif -r 12 -ac 1 -ar 8000 -b 30k -ab 12k movie.3gp
    • To AMR:ffmpeg -i music.wav -acodec amr_nb -ar 8000 -ac 1 -ab 32k music.amr
簡單的解說一下幾個常用的選項:
  • -acodec : 指定音訊編碼器。
  • -vcodec : 指定影片編碼器。
  • -s : 指定解析度,qcif就是176*144,是3gp格式常見的解析度。
  • -r : 這是定義每秒畫格數(fps)的選項。
  • -b : 影片位元速率(bps) [註]
  • -ar : 聲音取樣頻率(Hz)
  • -ab : 聲音位元速率(bps) [註]
  • -ac :指定聲音的聲道數目(例如:2就是立體聲, 1 則為單音)
以上工具就可以讓你輕輕鬆鬆把想要的影片轉成手機可用的影片啦!
註:傳送到手機的方法,你可以參考 藍牙傳輸—讓Linux與手機溝通無代溝 一篇。
註: 指定位元速率部份, 舊版的會自動使用Kbps, 但新板ffmpeg使用bps單位, 所以指定位元速率時數字後面宜加上單位"k"(例如影像128Kbps就指定成 -b 128k, 聲音亦然)

  • 02/04, 08 更新→ 由於原網站消失了,所以 AMR 的 Patch 下載不到,因此小弟在我的伺服器上放了一份 AMR 的 Patch 包,雖然有點舊,不過仍可以使用,網址部分已經更正上去!【新載點】

2007年7月29日

談談Blogger Draft的新測試功能–搜尋框 測試心得

▲還未通過測試的Blogger新元件—搜尋框
  最近Blogger Draft這測試後台又放出了一個新的元件,也就是所謂搜尋框(如上圖)。當然,有了這麼實用的功能當然是義不容辭給它試試囉!搞不好還比我原本做的搜尋Bar好用……

  但才一試,就發現他並沒有想像中那麼好用,首先,它在網頁剛載入時還要載入個幾秒鐘,這種設計實在是頗怪的,還要讓人等等才能用:
  再來就是那個Powered by Google真的很擋路,這樣會多佔掉很多空間,如此一來會把文章擠的很下面,這樣對於低解析度(800*600)的瀏覽者來說,會失去閱讀的焦點:  然後便是不能自己調整搜尋列的大小,偏偏我不想把搜尋列放在側邊(這樣側邊會很多東西很亂),而太長的搜尋列看起來又很怪....
▲長達440像素耶!
  再來最重點的部分就是他搜尋結果的表達方式,首先,它會把所有東西往下擠,結果讓整個網頁變得很長:  最後也是最奇怪的是,他的搜尋結果竟然把HTML原始碼也給顯示出來了??這樣的搜尋結果不但用戶難懂,而且要是碰到像是font那樣的關鍵字,豈不是搜到一大堆垃圾了?(因為HTML標籤中有一個叫作font,而且還很常見...)   就目前這情況看來,我還是用我原本的Search Bar好了(用的是Blogger導覽列的搜尋功能)......至少原本的搜尋功能不但跟網誌很有一體的感覺,搜尋結果也可以像文章一樣直接點入閱讀,對只需要網誌站內搜尋的我,原本的搜尋框反而更好用。不過這個新搜尋框的搜尋速度相當快,而且還可以擴及其他項目,有需要的人還是可以試試喔。
Site Meter