2005/12/01

Blogger功能再加強(V):用BlogThis!取代 Furl It自己做網摘平台(定稿)
分類:部落格、網路


智邦推出網摘達人服務,國內網路服務仍無法推出純平台架構。智邦生活館最近一個月緊鑼密鼓的開始推出部落格的網摘服務,利用 MT 架設的部落格讓網摘達人加入,用大家的力量來提供可看性比較高的部落格文章。

合作草案網址:http://ad.url.com.tw/images/20051128/blogger/paper.htm

以往編輯的腳色,被網摘達人部份取代,在茫茫的網海中利用專精各專長領域的意見領袖,來選擇一些可看性比較高的文章,當然陸續衍生出來的著作權及授權的問題很多,這裡並不打算討論這個活動的社會現象。

我想就技術面來討論,以美國的網路服務來看,通常是有足夠的市場來支撐(或說是燒錢)一個新概念的平台,例如搜尋引擎,或者是 delicous, furl 等服務,這中間只有技術問題,所以可以被廣泛的免費使用,業者或許獲利的來源光靠這類的平台就可以支持。

但是,在國內就無法在一公司內做好一個平台的服務,一定要有很多整合的服務,例如智邦生活館,不但要賣信箱,還要主機代管,甚至還有電子報平台,配合網路廣告等,這樣分散掉開發的資源,導致技術上無法更深入滿足更多人的需求。

第一眼看到這個合作提案時我還躍躍欲試,但是看到他們目前的功能還很陽春,我目前的網摘服務是用 furl.net做的,還無法完全取代這個免費的服務,看到艾瑪的首頁已經有了網摘的聯播機制,她是用智邦網摘部落格的RSS加上 newsgator 的聯播服務達成的,如果要做到歷史網摘的顯示,或是網摘分類的目的都沒有辦法,龜毛的我很不想用太多 script 外掛,會讓部落格網頁變的很慢。

我想這個不僅是智邦生活館目前的現象,更是目前台灣資訊產業的窘境,什麼都要做,導致什麼都做不長久,各種角色都要嘗試去扮演,有時候目標會互相牴觸。

對於這個網摘達人的服務,我個人非常看好,智邦的角色或許像 furl 這類的網站,但是面臨到國內市場不夠大的問題,要做到 furl.net 的所有功能並不容易,但就推廣上來講,智邦並不需要做到所有的功能就可以利用現有的 email 服務結合,提高網路廣告販售的範圍,希望他們能夠成功。

廢話不多說,很久以前就想用 xxxx.blogspot.com 的網址來做 javascript 的程式,讓自己的部落格能夠含入自己寫的程式,這樣可以把部落格的一篇文章當成一個小模組,甚至是 CSS 的存放區,把 xxxx.blogspot.com 當成網摘區也是長久以來的想法。之前yikuang也做過,還可以發 mail 到 blogger.com 的 Server 來做網摘。

而怎樣使用 BlogThis!請看 blogger help 的說明

http://help.blogger.com/bin/answer.py?answer=152

不過上面那個把連結放到 IE 的連結欄的功能失效了,可能是基於安全性的理由被IE關掉了吧?那麼只好用 Google toolbar 來作業比較快速了,但是新版的 toolbar 居然把這個好用的功能拿掉了。所以我只好自己寫一個,我寫的這個並不會在 IE 開啟新的視窗,所以應該不會被擋掉,只要把 BlogThis! 這個連結按下滑鼠右鍵,加入我的最愛即可,如果還是不行,請手動新增連結,然後把下面這段程式碼,剪貼到URL那一行。使用方法是看到覺得寫的不錯的文章,要記錄起來的時候,可以先把文章重點用滑鼠選起來,然後按下我的最愛內BlogThis!的連結,文章的 URL及Title加上你選的重點就會被貼到你自己的部落格,然後只要按下發行的按鈕,很快的就摘錄了這篇文章。

javascript:d=document;t=d.selection?(d.selection.type!='None'?d.selection.createRange().text:''):(d.getSelection?d.getSelection():'');d.location.href='http://new.blogger.com/blog_this.pyra?t='+encodeURIComponent(t)+'&u='+escape(d.location.href)+'&n='+encodeURIComponent(d.title);


blogger.com 的範本就在下面,大家自己開一個新的部落格來測試吧!

<MainPage>
var a_szURL=new Array();
var a_szDate=new Array();
var a_szTitle=new Array();
var a_num=0;

function t_geth6(sz)
{
var iBegin= sz.indexOf('<h6>');
if (-1==iBegin)
iBegin= sz.indexOf('<H6>');
if (-1==iBegin)
return '';
iBegin += 4;
var iEnd=sz.indexOf('</h6>',iBegin);
if (-1==iEnd)
iEnd=sz.indexOf('</H6>',iBegin);
if (-1==iEnd)
return '';
var iBegin2 = sz.indexOf(':',iBegin);
if (iBegin2 > iBegin)
iBegin = iBegin2 +1;
return sz.substring(iBegin,iEnd);
}
function a_ins(szURL,szDate,szTitle)
{
a_szURL[a_num]=szURL;
a_szDate[a_num]=szDate;
a_szTitle[a_num]=szTitle;
a_num = a_num + 1;
}
<Blogger>
a_ins('<BlogItemUrl><$BlogItemUrl$></BlogItemUrl>' , '<$BlogItemDateTime$>' , '<BlogItemTitle><$BlogItemTitle$></BlogItemTitle>' );</Blogger>
document.write('<style type=text/css>#aqu h6{display:none}</style>');
var r_num = (r_num == undefined) ? 0: r_num;
var r_tag = (r_tag == undefined) ? '': r_tag;
if ( r_tag != '')
{
document.write('<div id=aqu><ul>');
for (i=0,j=0; i<a_num && j<r_num; i++)
{
var sz1= '、'+t_geth6(a_szTitle[i])+'、';
var sz2= '、'+r_tag + '、';
if (-1 != sz1.indexOf(sz2))
{
j++;
document.write('<li><a href=' + a_szURL[i] + ' title=' + a_szDate[i] + '>' + a_szTitle[i] + '</a></li>');
}
}
document.write('</ul></div>');
}
else
{
document.write('<div id=aqu><ul>');
for (i=0; i<r_num && i<a_num; i++)
{
document.write('<li><a href=' + a_szURL[i] + ' title=' + a_szDate[i] + '>' + a_szTitle[i] + '</a></li>');
}
document.write('</ul></div>');
}
document.write('<a href=http://tripwriter.blogspot.com/?t=a&><img src=http://blog.yam.com/tripwriter/5526b399.jpg border=0></a>');
</MainPage>
<ArchivePage>
document.write('<ol>');
<Blogger>
document.write('<li><BlogItemUrl><a href="<$BlogItemUrl$>" title="<$BlogItemDateTime$>"></BlogItemUrl><BlogItemTitle><$BlogItemTitle$></BlogItemTitle><BlogItemUrl></a></BlogItemUrl><$BlogItemBody$></li>');
</Blogger>
document.write('</ol>');
</ArchivePage>
/*
<html>
<head><$BlogMetaData$>
<blogger><ItemPage>
<meta http-equiv="refresh" content="0; URL=<BlogItemURL><$BlogItemURL$></BlogItemURL>">
</ItemPage></blogger>
</head>
<body></body>
</html>
*/

記得要在這個新的網摘專用部落格做幾個設定
1.設定→基本→顯示您所有 Blog 的 [撰寫] 模式?→否
2.設定→格式→顯示→999篇文章
3.設定→格式→時間間隔→最好把日期顯示出來12/03/2005
4.設定→格式→編碼→UTF-8
5.設定→格式→轉換斷行符號→否
6.設定→格式→顯示標題欄位→是
7.設定→格式→顯示連結欄位→是
8.設定→格式→啟用浮動對齊→否
(請注意網摘的內文不能有 ' 這種符號,最好也不要有斷行的段落)

但這個部落格不能直接看,只能給另一個網站來含入,語法如下:
<script type="text/javascript" src="http://tripwriterjs.blogspot.com/2005_12_01_tripwriterjs_archive.html"></script>

1. 上面這個與法是給每月網摘使用,會顯示標題及摘錄的內文,請把 ArchivePage 的頻率調成一個月,如果要用每週或是每日也可以,網址請自己設定即可。

<script>var r_num=10; var r_tag='';</script><script type="text/javascript" src="http://tripwriterjs.blogspot.com/"></script>

2. 上面這個語法是會依照設定的分類來把網摘挑出來,詳細的語法可以看最下面的那個網址範例,我想做網摘的基本功能已經有了,未來如果要用計數器加上內頁轉址的方式來統計點閱率也是可以達成,目前暫時沒有做這個功能。

如果要看我的成果,請點下面的連結,未來每月的網摘,就打算這樣執行,不敢講比 furl.net 的功能還強,可是可以依照我自己的需求來修改,也可以弄成共筆部落格形式,邀請很多人一起來做網摘。

http://tripwriter.blogspot.com/2005/12/200512a.html

總共有17個迴響

  1. 水瓶子 12/03/2005 10:38 上午

    我漏了說明網摘分類的方式,就是在標題的後面加上<h6>分類:標籤1、標籤2</h6>

  2. 水瓶子 1/18/2006 1:52 上午

    我修改了一個小細節,由於開放 atom.xml 的格式,如果有人用 bloglines.com 來訂閱這個 atom 來同步的話,可能就無法連結的正確的位置,所以在 <ItemPage> 內加了轉址功能。

    這個範例我覺得最好玩的就是 html 網頁跟 javascript 能夠並存,有點類似C++的多型,不過這只是好玩,大家寫程式可不要設計成這樣,定義很不明確。

    <blogger><ItemPage>
    <meta http-equiv="refresh" content="0; URL=<BlogItemURL><$BlogItemURL$></BlogItemURL>">
    </ItemPage></blogger>

  3. 艾斯克隆 2/08/2006 10:48 下午

    或許你也可以考慮用 HEMiDEMi 來製作網摘。繁中介面,支援 xmlprc 貼到 blogger.com,也支援指定多重tag

    你可以參考我的 blog.
    http://escalon.blogspot.com/2006/02/20060208.html
    剛試了一下 好像沒什麼問題

    HEMiDEMi相關說明
    http://www.hemidemi.com/blog/?p=25

    HEMiDEMi首頁
    http://www.hemidemi.com

  4. 水瓶子 2/09/2006 11:09 上午

    謝謝您的推薦,有空我會試試看,曾經看過 HEMiDEMi 跟 MyShare 的比較,好像 HEMiDEMi 略勝一籌,但是這只是技術上比較強,希望這種商業模式能夠獲利,並且存活下來,加油囉!

  5. Yikuang 3/10/2006 5:40 下午

    請問一下,ArchivePage可以跟r_tag=共用嗎?也就是說過濾出每個月的某個tag,不知道這樣可不可行?

  6. 水瓶子 3/13/2006 12:19 下午

    yikuang,可以,只要把上面的範本的 <MainPage> </MainPage> 改成 <MainOrArchivePage> </MainOrArchivePage> 就可以了,而且要把 <ArchivePage> </ArchivePage> 拿掉,試試看吧!

  7. szany 3/24/2006 12:07 上午

    那請問有沒有可能利用這個功能來抓最新回應呢?
    ex
    blogAcomment → Gmail → blogB
    然後因為是轉寄到blogB去,所以會有
    「Posted by 某人 to 該篇位置 at 時間」這串話

    然後利用這串話來抓 某人的名字,還有該篇位置的連結來合成最新回應呢?
    這樣就可以在sidebar顯示出
    某A回了一篇文章
    某B回了一篇文章
    某A回了一篇文章
    某C回了一篇文章

    雖然不知道是哪一篇,不過只要點進去,就可以到該篇文章去了。

    小弟完全不懂javascript,不過覺得這應該作得到,所以就發問了 :P

  8. 水瓶子 3/26/2006 11:03 上午

    雨林,之前是有人應用這個方法,重要的關節有兩個,一是mail box是私人的東西所以一定要認證,二是要提供RSS的協定。這兩個介面都被Gmail 給關閉了。

    印象中認證的方式是這樣
    http://帳號:密碼@mail.google.com/

    然後應用一些網站提供 RSS2JS 的服務就可以讓其他網頁含入這些訊息了。

    不過我找了一下,http://www.mailbucket.org/ 這個網站有把 email 轉成 RSS 的服務,可以試試看。

  9. szany 3/26/2006 10:13 下午

    呃?
    可是BLogger本身就有將回應寄往信箱的功能啊,然後Gmail又可以設篩選器對特定郵件作動作呢。

    因此只要一有回應發生,就會從BlogA寄到Gmail,然後Gmail就自動轉寄信件到BlogB。而Blog和Gmail都是自己的,應該是沒有認證問題吧?

    所以我想應該可以利用您寫的這一個Javascript來抓特定字串來達成效果,不是嗎?

  10. 水瓶子 3/26/2006 11:42 下午

    哈!我誤會你的意思了!不好意思。原先我以為的方法是 BlogA有留言→Gmail→RSS→Javascript→顯示在網頁上

    剛剛測試你講的方式,果然初步測試是OK的,不過會遺失掉一些資訊,例如留言人的網址或email,以及原來留言的文章標題,blogger.com 只留下留言的單篇網址的訊息。

    等我有空來想想有無什麼辦法來解決這些問題。

    謝謝。

  11. 匿名 @ 7/25/2006 2:03 下午

    What a great site
    » » »

  12. 匿名 @ 9/29/2006 11:23 下午

    嗚~ 又想要請教一下

    請問您那 BlogTHis! 的連結是怎麼寫出來的?

    我只要用了JAVAscript的連結,都是錯誤的呢

  13. 水瓶子 9/30/2006 12:28 上午

    to ㄧ個男生:

    不知道你用的是舊版的 blogger 還是 beta 版呢? 我這個 BlogThis! 是用在舊版的,我不知道新版支不支援,還沒有測試過!

    只要把上面有個 BlogThis! 的連結上按下滑鼠右鍵,加入我的最愛即可! IE 應該會跳出警告視窗,只要回答 Yes 就可以了。

  14. 匿名 @ 9/30/2006 7:36 上午

    我指的是,怎麼寫到
    部落格上的 @__@

    我寫在部落格上都會變成這樣子呢

    http://cszany.googlepages.com/TSET.png

    使用的話,beta目前還不能用blogthis功能

  15. 水瓶子 9/30/2006 10:34 上午

    <<script>var r_num=10; var r_tag='';</script><script type="text/javascript" src="http://YOURBLOGTHISDOMAIN.blogspot.com/"></script>

    就把上面的語法貼在部落格裡面就好啦!

  16. 匿名 @ 9/30/2006 12:55 下午

    感謝您!

    可以用了呢

  17. 匿名 @ 9/30/2006 1:00 下午

    不過我只貼了這一段,就可以正常運作了
    <script type="text/javascript" src="http://YOURBLOGTHISDOMAIN.blogspot.com/"></script>

    另一段應該是您網頁裡所需要用到的功能吧?