Kaie"s Blog 2.0 beta!
Back to "Top"

My Secret Notebook
 Show "Table of Contents"
Contact Me
Subscribe to my Posts feed
Subscribe to my Comments feed
My Flickr
Back to "Top"
My Secret Notebook
 Show "Table of Contents"
Contact Me
Subscribe to my Posts feed
Subscribe to my Comments feed
My Flickr

Monday, July 30, 2007

[Blogger Hack] Comment Photo Hack (在Comment處顯示回應者圖片)

  這個Blogger Hack我已經使用很久了,也是我個人非常喜愛的一個Hack,在我的Kubrick版型中,也有提供之功能!我覺得在回應文章時,同時顯示回應者的圖像是很酷的一件事,看圖片很快就可以辨認出是某某某,同時此iCon也具有特別的意義,像徵著你的Blog Spirit..等同於一個人的網路身份..口桀口桀 (XD..當我在亂講就好...是我個人特別癖好罷了),當初在找這個Hack的時候,覺得明明Blogger就可以自行提供個人Profile Image的link,很簡單就可以辦到了,沒什麼技術上的問題,但為啥不提供...後來在Google Groupgs有看到,聽說官方的回應是,會有關於安全性方面的問題,所以不提供...至於問題是如何,當然就沒提到囉...

※Demo1: example
※Demo2: 以這篇回應較多的文章來看看吧...

  因為之前較沒空,所以一直懶得翻譯...並且有不少網友來信問說是如何弄的,所以就直接來篇翻翻教學吧,請往下看吧..
.參考資料來源:
New Comment Photo Hack (Blogger) (新方法,較簡易,底下講解此方法..)
comment photos and highlighting hack (這篇是舊方法)
Step1.首先開啟你的Template(記得要是完整的,也就是到"Edit Html"頁面勾選"Expand Widget Templates"),找到底下的code<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
在這段code底下插入下面的code<div style="clear:both">
<dt style="float:left;margin-right:5px;clear:both;" expr:id='"commentphoto" + data:comment.id'></dt>
<!--底下這段,針對IE修正了些小bug-->
<b:if cond='data:comment.authorUrl'>
&lt;script type=&quot;text/javascript&quot;&gt; if(typeof(commentPhotoIds) == &#39;undefined&#39;) var commentPhotoIds = []; commentPhotoIds.push({&#39;id&#39;:&#39;commentphoto<data:comment.id/>&#39;, &#39;url&#39;:&#39;<data:comment.authorUrl/>&#39;});&lt;/script&gt;
<b:else/>
&lt;script type=&quot;text/javascript&quot;&gt; if(typeof(commentPhotoIds) == &#39;undefined&#39;) var commentPhotoIds = []; commentPhotoIds.push({&#39;id&#39;:&#39;commentphoto<data:comment.id/>&#39;, &#39;url&#39;:&#39;&#39;});&lt;/script&gt;
</b:if>

Step2.接著往下滾,你會找到一個相對應的</b:loop>,在</b:loop>之前新增底下的code</div>
Step3.在tempalte中,找到</body>,接著將底下這段code貼在</body>上面,底下有maxwidth(限制最大圖像寬度)和defaultimage(若在Profile中沒有圖片時,所使用的預設圖片)參數供你自行調整
<script type='text/javascript'>
//<![CDATA[
function commentPhotoDo() {
var tag;
for(var i = 0; i < commentPhotoIds.length; i++) {
//上面那行,相較於原文,也作了些小修正了,解決一些怪異的行為

tag = document.createElement('script');
tag.type = 'text/javascript';
tag.src = 'http://scrape.singpolyma.net/avatar.php?maxwidth=70&url='+encodeURIComponent(commentPhotoIds[i].url)+'&id='+encodeURIComponent(commentPhotoIds[i].id)+'&defaultimage='+encodeURIComponent('http://img139.imageshack.us/img139/1011/defaultavatarad7.png');
document.body.appendChild(tag);
}//end for var i in commentPhotoIds
}//end function commentPhotoDo
if(typeof(commentPhotoIds) != "undefined") commentPhotoDo(); //在首頁不執行此script
//]]>
</script>

Step4.接著就是存檔,就ok啦...快去看看你的成果吧..

97 Comments:

Who: Nekki Class:
When: July 30, 2007 6:03 PM  

剛好需要這個功能
順便幫大大測試一下^^

Who: Tsung-Kai Chen Class:
When: July 31, 2007 8:04 AM  

To Nekki:
謝啦...我也是轉貼過來的,還不知道我是否貼正確!!

Who: Nekki Class:
When: July 31, 2007 10:53 AM  

大大你好~
測試成功~很漂亮喔

有2個問題想請教:

1. 如何才能像您blog裡一樣回應有底圖呢?

2. 一直很喜歡你blog裡的Bubble Tooltips,跟著這篇:
http://web-graphics.com/mtarchive/001717.php
的教學,3樣東西已經上傳到網路空間,但是只有文字說明有出現,底圖一直無法出來,是什麼原因呢?

bt.css檔裡的圖檔連結改了,也無法出現

從這裡學到許多東西,真是好站^^

Who: Tsung-Kai Chen Class:
When: July 31, 2007 11:22 AM  

To Nekki:
1. 我想你指的是,灰色及綠色的底吧..請參考 http://hackosphere.blogspot.com/2006/10/author-comment-highlighting-and.html 這一篇文章,這篇本意是讓Blog作者,與讀者的回應有顏色區別!若你只要有背景色的話,參考這篇也是ok低..^_^,但重點就在於 " .comment-body p{...} "這個css屬性而已..

2.bt.css的link還是要改才行,但你的問題出於,你的http://g2dbtw.googlepages.com/BubbleTooltips.js裡頭的這一行 l.setAttribute("href","bt.css");,你要改成 l.setAttribute("href","http://g2dbtw.googlepages.com/bt.css");降子才對唷..

Who: Nekki Class:
When: July 31, 2007 1:03 PM  

成功了~修正完畢
感謝大大指正~^^

Who: Class:
When: August 09, 2007 12:17 PM  

我照著您的方法做了
應該算是成功吧
只不過目前而言,都只是出現一個方塊頭
那麼使用者的圖片要如何加上去呢?
http://pathinwoods.blogspot.com/2007/05/blog-post.html

Who: Tsung-Kai Chen Class:
When: August 09, 2007 2:41 PM  

To 某:
圖片必需要在個人的profile中有加入才有,像你的在這個網頁 http://0rz.tw/1a2TS ,你的沒有使用
我的在這, http://0rz.tw/5e2Uw 裡頭的圖就和我留言所顯示的圖一樣..

Who: Danny Class:
When: August 10, 2007 3:33 PM  

Kaie大

請教幾個問題喔,

1.我在網路上找了幾個可以區別別人回應以及我自己本身回應的語法(也就是我的回應背景色會不一樣),但怎麼弄卻都不成功,有沒有懶人包呢?

2. 我的read more 是套用你這邊的教學,但選reader more 後,回應並不會顯示在文章下邊,選右邊欄的最新回應處,才會看到回應在文章下面,這要如何改呢?

3. 你的最新回應處,很清晰易懂,而我套用出來的卻是糊在一起,有什麼語法改成跟你的類似呢?

http://iamdannyboy.blogspot.com/

謝謝!!

Who: Tsung-Kai Chen Class:
When: August 11, 2007 10:00 AM  

To Danny:
1.懶人包我就不確定有沒有了,這個hack應該不難實作,再注意看看,有沒有哪個細節沒注意到,漏掉了

2.read more的功能本來就只有隱藏原文的部份而已耶,所以點擊read more之後,也只會看到被隱藏的文章唷,看不到回應的。

3.我是用堯的最新回應產生器,看你的似乎也是的樣子,那我貼上我的語法給你參考看看

<div id="newcommentschenkaie">
<h2>Loading...</h2>
</div>

<script>
function compareentry(a,b){
order= Date.parse(a.published.$t.replace(/^(\d{4})-(\d{2})-(\d{2})T([0-9:]*)([.0-9]*)(.)(.*)$/,
'$1/$2/$3 $4 GMT')) - Date.parse(b.published.$t.replace(/^(\d{4})-(\d{2})-(\d{2})T([0-9:]*)([.0-9]*)(.)(.*)$/,
'$1/$2/$3 $4 GMT'));
return 0-order;

}
function handleCommentschenkaie(json) {

var temp = '<ul id="Feed001_feedItemListDisplay">';
var postshow=10;
var sortentry=json.feed.entry.sort(compareentry);
for (var i=0, post; post = sortentry[i]; i++) {
if(i>=postshow) break;
var title=post.title.$t;
var link=post.link[0].href;
/* : begin
var alturl = link;
alturl = alturl.replace("#", "#comment-");
var postlink = alturl.split("#");
postlink = postlink[0];
var linktext = postlink.split("/");
linktext = linktext[5];
linktext = linktext.split(".html");
linktext = linktext[0];
var posttitle = linktext.replace(/-/g," ");
posttitle = posttitle.link(postlink);
End*/
var authorname=post.author[0].name.$t;
var timestamp=post.published.$t.substr(0,10);
temp += '<li>'+ authorname +' [' +timestamp +'] :<br/><span class="item-title"><a href="'+link+'">'+ title +'</a></span></li>';
}
temp+='</ul></br><a href="http://feeds.feedburner.com/KaiesBlogComments" title="閱讀更多迴響"><img src="http://chenkaie.blog.googlepages.com/feed-icon-16x16b.png"/>&nbsp;More Comments... / 更多迴響...</a>';
document.getElementById("newcommentschenkaie").innerHTML = temp;
}
</script>

<script src="http://chenkaie.blogspot.com/feeds/comments/default?alt=json-in-script&callback=handleCommentschenkaie" type="text/javascript"></script>

Who: Danny Class:
When: August 11, 2007 10:15 PM  

感激!

我也是從堯的部落格那裡取得最新回應語法,不過不知為何跟你的有些差異,現在改過以後,果然清爽許多。

另外,我自己回應跟訪客回應顏色區別的問題,我在研究看看好了

謝謝!!

Who: ilham saibi Class:
When: August 21, 2007 3:09 AM  

i understand with u'r post title, buat unfortunedly i don't understand with you'r language, keep spirit bro!!

Who: Tsung-Kai Chen Class:
When: August 21, 2007 8:28 AM  

To ilham saibi:
Hey bro, u could refer to this post New Comment Photo Hack (Blogger) that one is written in English ^_^

Who: ilham saibi Class:
When: August 21, 2007 3:21 PM  

thanks bro, by the way, can you give me a link back?? i interest with blog hack, but i just use indonesian language, i hope u can give me link back from your blog. i'll make a link to u'r blog on my blog, thanks

Who: Tsung-Kai Chen Class:
When: August 21, 2007 3:37 PM  

To ilham saibi:
sure bro! let's hack it..yoyoyo

Who: Nekki Class:
When: August 24, 2007 11:58 PM  

大大,打擾你問個笨問題>.<
我的部落格最上方有個空間,由於是全黑的看不出來,但其實上面有個文字"-->"
那是我改blog archieve沒砍乾淨的程式碼,可是不管我怎麼找,就是找不到-->在哪裡地方,可以幫我看一下嗎>.<,謝謝
http://nekki1409.blogspot.com/

還有,那個透明版型超炫的~
真是漂亮

Who: Nekki Class:
When: August 25, 2007 12:03 AM  

補充,應該是在< /head >和]]> < /b:skin >之間,我只有動過幾個地方

Who: Cellocoffee Class:
When: August 25, 2007 1:36 AM  

hi Kai,你的回應欄最近有問題嗎? 我的好像在blogger這星期一維護之後就怪怪的,不能點擊進入而且只秀人名跟時間,內文不見了。救救!!

Who: Tsung-Kai Chen Class:
When: August 25, 2007 2:38 AM  

To Nekki:
哈哈..今天才偷改沒多久,就被你偷點了,看來你有偷偷注意我右上角的區塊唷..^^,但我還有很多小細節尚未改完,還沒到我可以接受的樣子...囧

你說的那個問題,我看你的blog,那個-->應該是在你的template中<body> 的上方


To Cellocoffee:
喔...沒錯,Blogger更新了RSS的格式了..因此,請改成底下的code

<div id="newcommentschenkaie">
<h2>Loading...</h2>
</div>

<script>
function compareentry(a,b){
order= Date.parse(a.published.$t.replace(/^(\d{4})-(\d{2})-(\d{2})T([0-9:]*)([.0-9]*)(.)(.*)$/,
'$1/$2/$3 $4 GMT')) - Date.parse(b.published.$t.replace(/^(\d{4})-(\d{2})-(\d{2})T([0-9:]*)([.0-9]*)(.)(.*)$/,
'$1/$2/$3 $4 GMT'));
return 0-order;

}
function handleCommentschenkaie(json) {

var temp = '<ul id="Feed001_feedItemListDisplay">';
var postshow=10;
var sortentry=json.feed.entry.sort(compareentry);
for (var i=0, post; post = sortentry[i]; i++) {
if(i>=postshow) break;
var title=post.content.$t.substr(0,30);
var link=post.link[0].href;
var authorname=post.author[0].name.$t;
var timestamp=post.published.$t.substr(0,10);
link = link.replace("#", "#comment-");
temp += '<li>'+ authorname +' [' +timestamp +'] :<br/><span class="item-title"><a href="'+link+'">'+ title +'</a></span></li>';
}
temp+='</ul></br><a href="http://feeds.feedburner.com/KaiesBlogComments" title="閱讀更多迴響"><img src="http://chenkaie.blog.googlepages.com/feed-icon-16x16b.png"/>&nbsp;More Comments... / 更多迴響...</a>';
document.getElementById("newcommentschenkaie").innerHTML = temp;
}
</script>

<script src="http://chenkaie.blogspot.com/feeds/comments/full?alt=json-in-script&callback=handleCommentschenkaie" type="text/javascript"></script>

Who: 土人 123 Class:
When: August 25, 2007 6:05 AM  

謝謝大大的熱心貢獻,部落世界沒有你就是黑白的啦。拍手拍手!

Who: Nekki Class:
When: August 25, 2007 11:17 AM  

大大還是找不到>,<
這問題真的很奇怪,我翻遍了所有一一>語法,都有對應的標籤<!--,就是找不到落單的

Who: Tsung-Kai Chen Class:
When: August 25, 2007 12:15 PM  

To 土人123:
您言重了大哥...哈哈!

To Nekki:
咦,我再看一下code,他就在這個地方耶,就body的下方

</head><body>--&gt;
<script src="http://g2dbtw.googlepages.com/prototype.js" type="text/javascript"> </script>
<script src="http://g2dbtw.googlepages.com/scriptaculous.js?load=effects" type="text/javascript"></script><script type="text/javascript" src="http://g2dbtw.googlepages.com/effects.js"></script>

你再check一下吧

Who: Danny Class:
When: August 25, 2007 4:36 PM  

Hi Kaie 大

我照你新的最新回應語法置換過了,也把原本所有chenkaie的地方置換成我的iamdannyboy,為何結果都只出現loading....呢?

Who: Tsung-Kai Chen Class:
When: August 25, 2007 6:07 PM  

To Danny:
咦...這麼怪,那你只換 <script src="http://chenkaie.blogspot.com/feeds/comments/default?alt=json-in-script&callback=handleCommentschenkaie" type="text/javascript"></script> 這裡面的chenkaie就好,這樣試看看吧.

Who: Danny Class:
When: August 25, 2007 9:38 PM  

找到解決方法了,
在堯@部落格裡提到,要將網站提供選成"完整"才可以,我先前都選成"簡短"。

不過還謝謝你喔 :)

Who: Tsung-Kai Chen Class:
When: August 26, 2007 1:56 AM  

To Danny:
喔…原來如此呀! 謝謝你喔,其實我也沒注意那麼多,一直都設成Full ..囧

Who: Nekki Class:
When: August 28, 2007 10:35 AM  

這真是太神奇了
就算整個模板下載下來,還是找不到
偏偏用IE 和 Opera 看都沒這問題
Firefox 還是一直出現

下載新的Portable Firfox來看
還是一樣...冏
可能是FF的問題吧

感謝大大幫我偵錯,浪費你不少時間>.<

Who: Tsung-Kai Chen Class:
When: August 28, 2007 1:55 PM  

To Nekki:
呵哈…一點也不神奇啦!! 檢視原始碼之後,便能看到真相...Browser自己解讀html語言之後,都有一些自己的rule,所以勒什麼都有,什麼都看,什麼都不奇怪啦..

Who: 統一大布丁 Class:
When: September 04, 2007 1:45 PM  

你好~
我有照你的方法設定了,但是…一樣沒有圖出現耶?!
@@"請問可以幫我看有什麼地方出錯嗎?謝謝

Who: Tsung-Kai Chen Class:
When: September 04, 2007 3:44 PM  

To 統一大布丁:
咦...這個,感覺有點難debug...除不介意的給我帳號密碼話,可以幫你試看看... ^^"

Who: 統一大布丁 Class:
When: September 05, 2007 9:27 AM  

呃...那沒關系好了^^"
我再試一遍好了XD
謝謝你哦^^

Who: .. Class:
When: September 08, 2007 6:51 PM  

Kaie大,您好,
我照您的方法做了,可是照片總是無法顯示,而且我的 Floating Small Icon也無法浮動,勞煩請您幫忙指點錯處,謝謝!

Who: Tsung-Kai Chen Class:
When: September 09, 2007 3:43 PM  

To ..:
關於Floating Small Icon的問題,出在於你#mininav{}中並沒有加入 position:fixed 這個屬性,所以當然不會浮動
至於照片的問題,我檢視你的blog原始碼之後,發現Step1的東西似乎沒正確插入,看不到該有的code

Who: .. Class:
When: September 09, 2007 7:23 PM  

成功了,感謝Kaie大大。

Who: Ritek Class:
When: September 10, 2007 10:33 PM  

to chen kaie大

我之前也是用這個hack,非常喜歡!
但是我的template換成阿倫校長的iNeoogle之後就沒辦法套用這個hack...

非常可惜....

不知道該如何處理呢?

Who: Tsung-Kai Chen Class:
When: September 11, 2007 12:29 AM  

To Ritek:
關於這個問題,我想目前應該是沒有什麼好的解決辦法。因為Neo-Like的template所使用的是AJAX/JSON技術,然後擷取出來的資訊並不夠詳細,只能取得留言者的相關資料,很遺憾的並沒有留言者圖片這一項! 這也是我一直沒有轉到Neo平台的因素之一 ^_^ I love this hack..

Who: Benson Class:
When: September 30, 2007 8:04 AM  

Hey Chen,

能請教你一個問題嗎?關於訪客留言欄右上角處的計數,可以分享相關的辦法、技巧嗎?謝謝你

Who: Tsung-Kai Chen Class:
When: September 30, 2007 10:51 AM  

To Benson:
沒問題呀,但這是我個人用爆力法亂寫的...囧,因為透過Blogger提供的變數中,我找不到每一則comment的Index表示法,只有類似這個"post.numComments",總共comment數而已。至於我的爆力作法如下:

Step1. 在CSS的部份加上底下code(請依照您個人版面,作相關修改):

.CommentIndex{
float:right;
position:relative;top:25px;left:3px;
margin-left:-200px;
font: italic bold 30pt 'Century Gothic','Trebuchet MS';
color:red;
opacity:0.3;
-moz-opacity:0.3;
filter:alpha(Opacity=30);
}

.CommentIndex:hover{font-size:80px;}

Step2. 找到如這篇文章上頭Step1. 的內容 <dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
將整個取代為底下的code:
<dl id='comments-block '>
<script type='text/javascript'>Index = 1;</script>
<b:loop values='data:post.comments' var='comment'>
<span class='CommentIndex' title='Just Comment Index'><script type='text/javascript'>document.write(Index); Index= Index+1 ;</script></span>

Who: Benson Class:
When: September 30, 2007 6:36 PM  

Chen,
:-) 謝謝你提供如此有力的辦法,謝謝你 \m/

Who: Davin Class:
When: October 18, 2007 12:40 PM  

TO版大:
我改過程式碼後,一樣沒有顯示圖像耶?
不知我是否有漏掉哪個步驟?
煩請幫我解惑一下!

Who: Tsung-Kai Chen Class:
When: October 18, 2007 1:59 PM  

To Davin:
請見上頭第34及35個留言,你就知道why了...^_^

Who: Chris Class:
When: November 09, 2007 12:54 AM  

想請問一下

這是 我的template 我的blog

1.
我用這個blogger hack 可是圖片會和留言擠在一起,要像你一般把圖片放在使用者名稱的旁邊該改哪裡?

2.
還有我想增加和你一樣的Who When 怎麼做?

3.
還有我想用區分auther和其他使用者留言的顏色區分,可是css的語法和作者的有些出入,可以幫我解釋它的語法與我的template comment部分所對應的關係是?

4.
在comment和link to this post的字前面放上圖片該將與法改在哪裡呢?

5.
還有想改Post a comment的字要在哪裡改?

6.
要將post a comment這個連結放到comment標題的下方有辦法做到嗎?

很抱歉一次問了這麼多問題,如果有很好的教學文章可以給我連結就好,我有試著找過,不過關鍵字就是不精準,感謝!

Who: Tsung-Kai Chen Class:
When: November 09, 2007 9:10 AM  

To Chris:
關於第一點及第二點,這要解釋有點麻煩,最快的方法就是直接給你我的Code,你研究一下應該就了解了 ^_^
.底下為新增的CSS部份->
.commentphoto {
margin: 25px 0 0 0;

}
* html .commentphoto { /*IE only*/
margin: 30px 0 0 0;
}


.commentphoto img{
float: left;
padding: 2px;
border: 1px solid #333;
margin: -25px 10px 0px 40px;
}
* html .commentphoto img { /*IE only*/
float:right;
margin: -25px 0 0 0;
}
.底下為我的Code->
<div style="clear:both">
<dt class='commentphoto' expr:id='"commentphoto" + data:comment.id'></dt>
&lt;script type="text/javascript"&gt;if(typeof(commentPhotoIds) == 'undefined') var commentPhotoIds = []; commentPhotoIds.push({'id':'commentphoto<data:comment.id/>', 'url':'<data:comment.authorUrl/>'});&lt;/script&gt;

第三點的話,說是出入,也還好…你只要加入紅色字部份的css以及這個網頁( this page)所提及東西(紅色要加,藍色看個人),就ok了,至於底下的
.comment-body {
margin:0;
padding:0 0 0 20px;
}
.comment-body p {
font-size:100%;
margin:0 0 .2em 0;
}
不加也沒差,因為並沒有涉及顏色,所以不鳥他。

第四個問題,加入以下即可…再修改成你要的圖即可
#comments h4 {
margin: 0px;
padding: 8px 0 0 30px;
font-size: 20px;
color: #555;
background: url(http://bloggerhacks.googlecode.com/files/CommentIcon.png) no-repeat;
height: 29px !important; /* for most browsers */
height /**/:37px; /* for IE5/Win */
}
第五題的方法就是,將<data:postCommentMsg/>這串取代為你想要的字。

第六的話,就是將底下這段
<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</p>
移動到這行<dl id='comments-block'>上方。

其實你問的很多都我亂改一通的,我也不知有沒有教學,其實真正只要學HTML/CSS就可以懂得如何改出以上的東西了..^_^

Who: &nbsp Class:
When: April 24, 2008 11:39 AM  

你好,
我想問的是
要怎樣才能把照片放到右手邊
就像你的一樣
謝謝

Who: Tsung-Kai Chen Class:
When: April 24, 2008 1:05 PM  

To &nbsp :

在step1裡的code (底下)
<dt style="float:left;margin-right:5px;clear:both;" expr:id='"commentphoto" + data:comment.id'>
將 float:left;改為float:right;
^_^

Who: terminals-blocks Class:
When: May 08, 2008 3:04 PM  

tq for ur info...it's very wonderful Muay Thai MMA

Who: jenming Class:
When: May 14, 2008 7:42 PM  

Kaie大你好,我在原作者的 comment 中有發現你提供的修正,有解決 Firefox 下會不斷出現錯誤的訊息,不過在 IE 好像還是會談出一樣的訊息,是否有解呢? 非常謝謝你的無私分享 ^_^

Who: Tsung-Kai Chen Class:
When: May 14, 2008 8:11 PM  

To jenming:
原來都是自己人呀..XD,我後來的修正過後的作法,請見我剛剛修正的原文..^^,step1及step4都有。

Who: jenming Class:
When: May 15, 2008 12:32 AM  

K大你好,繞了半個地球原來都是自己人 ^^"
剛剛測試了K大的回文,我交叉測試後,自己的環境下若是有採取 step2 的方案話,FF 和 IE7 都跑不出圖片,但不會在因為迴圈的數量問題一直彈出錯誤訊息,所以我目前還是保留原作者的 step2,這樣的話 FF & IE7 都能正確顯示 avatar,不過回到首頁後還是會出現 "'commentPhotoIds' 未被定義",但我不確定是不是自己的 ReadMore Hack 造成;最後,謝謝K大的熱心和幫忙 ^+++^

PS. K大目前你的網頁用 IE 和 FF 都正常,不跳錯誤訊息了 ^_^

Who: Tsung-Kai Chen Class:
When: May 15, 2008 1:09 AM  

To Jenming:
我想這次應該對了..囧,不知在copy & paste時,哪裡miss了,還有你說的首頁的問題,在step3下面,有再多新增一行判斷式,應該就OK了,若有問題你再跟我說...^^

Who: jenming Class:
When: May 15, 2008 8:40 AM  

K大你好,OK囉,FF & IE 的頁面都正常,太讚了啦,很高興認識你喔 ^+++++^

Who: Kaie Class:
When: May 15, 2008 9:13 AM  

To Jenming:
大家攏系台灣郎,應該的應該的,台灣加油..!!

Who: 純白色 Class:
When: May 22, 2008 12:19 AM  

你好..我是龍~

我剛套用了你的顯示大頭語法,也檢查了好幾次。
但大頭還是沒有跑出來,可以幫我看看問題在哪嗎?

Orz

Who: 純白色 Class:
When: May 22, 2008 3:12 PM  

我做了圖片解說...

請看~

http://lonyice.googlepages.com/b.png

是我電腦有問題嗎..


至於回應區對話框語法...
我不會改...能不能指導一下

Who: 純白色 Class:
When: May 22, 2008 5:21 PM  

發現問題所在
因為我直接套你的語法所以並沒檢查

仔細一看你教學裡step1有些文字代碼並沒有正卻顯示出來


如<、>...等等的

所以我改用http://skyvee.net/2007/09/bloggerblogspotcomment.html

這篇skyvee大大的教學,應該是一模一樣的。
只是用了以後..大頭還是沒正常顯示...


仔細一看才發覺,在每次存檔後,我的部份'號會變成'
不知道該如何解決...到底是哪裡有問題呢?

Who: Tsung-Kai Chen Class:
When: May 23, 2008 1:04 AM  

To 純白色:
我開http://01testworld.blogspot.com/這個blog都還蠻正常的耶...,沒遇過啥怪問題。至於你說的<,>你在template裡若有這些代碼,其實會被blogger自動轉成我所貼的&lt;,&gt;這種代碼。最近較忙,有空些再幫你分析看看..

Who: Tsung-Kai Chen Class:
When: May 23, 2008 1:06 AM  

To 純白色:
對了,忘了貼圖..XD
http://chenkaie.bigfile.googlepages.com/IEandFF.jpg

Who: 純白色 Class:
When: May 23, 2008 2:12 PM  

一直出現存檔後有很多符號會莫名奇妙的變成代碼問題 ... 找不到問題所在...ˊˋ 好想放棄...

Who: Tsung-Kai Chen Class:
When: May 24, 2008 12:47 AM  

To 純白色:
變代碼是正常的呀..XD 只要code貼對,就ok啦.管他變啥

Who: 純白色 Class:
When: May 24, 2008 1:17 AM  

是喔...不會影響語法運作嗎?

可是我的大頭圖片都不會正常顯示阿...



還有如何讓回應出現對話框效果阿

Who: Tsung-Kai Chen Class:
When: May 25, 2008 12:14 AM  

To 純白色:
是呀,是blogger自己轉換的,所以是ok的。
對話框效果,請參見這個template的souce code [Template] Kubrick style for Blogger beta 就有囉!!

Who: 純白色 Class:
When: May 25, 2008 5:54 AM  

大哥...你給我看的那個..
我不知道是什麼意思耶 T^T?

而且我的大頭都沒出現T^T

改了快一星期了...
有空時,可以幫我看看到底怎麼了嗎..

謝謝...

PS. 我對CSS語法只能說知道原理,但不會寫,也只能看懂一點點..

Who: Tsung-Kai Chen Class:
When: May 25, 2008 9:33 AM  

To 純白色:
咦,若你不介意的話,不然你把username,passwd寄到我的信箱chenkaie@gmail.com,我直接幫你弄看看

Who: 純白色 Class:
When: May 26, 2008 1:14 AM  

大哥,給你帳密是ok的。

但是我有些細部的小地方想問你,想說直接跟你聊會比較清處
但密你好像都在忙,你回時我又剛好沒看到...

我有加你msn了,可以用那個聊嗎?

不然我還是把想知道如何改的地方連同帳密一起寄給你?


ps. 不知道為什麼,我電腦好像怪怪的,開你的網頁容易內格

Who: 辦公室文具 Class:
When: August 27, 2008 3:59 PM  

i know u r a grammer studier , i hv ever study grammer , but not i am not

Who: Balflear Lee Class:
When: September 17, 2008 11:31 PM  

不知道為什么我的IE會出現運行錯誤﹐FIREFOX就沒問題﹐我嘗試的時候是用IE6。

Who: Tsung-Kai Chen Class:
When: September 27, 2008 11:39 PM  

To Balflear Lee:
咦..這我也沒遇到耶,你可能要裝script editor debug一下,可以參考這一篇文章 http://www.jonathanboutelle.com/mt/archives/2006/01/howto_debug_jav.html

Who: ShyuWei Class:
When: September 29, 2008 8:13 PM  

你好 想請問kaie大 那個圖片有時後會顯示有時候不會顯示 是不是因為連外的server不穩 還是說有解覺得方法呢 想了很久還是找不出來XD 謝謝

Who: 艾倫蔡 Class:
When: September 30, 2008 5:02 PM  

好像只要在同一篇文章用同一個身份發表一篇以上的留言,就會有幾篇留言會顯示預設的圖而不是作者的圖

Who: Tsung-Kai Chen Class:
When: October 01, 2008 10:25 PM  

To 艾倫蔡:
好像的確會如此...這我也搞不太清楚了,畢竟是原作者寫的code我也沒時間去trace,哈…加減用吧!!

Who: Tsung-Kai Chen Class:
When: October 01, 2008 10:32 PM  

To ShyuWei:
嗯,的確有這個問題,畢竟那個hack的source code是在原作者那邊所host的,尤記得原作者還有提到說,若你有比較大量的request時,例如時常有某一篇就大於100個以上的comments時,會知他一聲,因為同時發出這麼request會造成server的負擔!! ^^...所以比較好的解法,應該是自己去host這支程式 http://scrape.singpolyma.net/avatar.php

Who: ★〞General -- STING遊戲軍團 Class:
When: October 13, 2008 5:31 PM  

您好,
我今天發現回應者圖片的功能好像失效了!
不知道是不是Blogger又更新了!?
因為我看你的回應的圖好像也沒了呢...

Who: Tsung-Kai Chen Class:
When: October 13, 2008 11:05 PM  

To General :
好像是這樣沒錯,偶爾會失效,若一直維持很久的話,恐怕就是被原作者拿掉了...XD

Who: Tsung-Kai Chen Class:
When: March 03, 2009 12:39 AM  

OH YA! 大頭照又回來了... 自己host這支php程式即可 ....^^,有需要的來這邊拿吧…
http://svn.devjavu.com/singpolyma/trunk/blogger/avatar.php

Who: BigHeadAnn Class:
When: April 05, 2009 6:23 PM  

照著做了,可是大頭照還是沒有顯示出來>.<
怎么會這樣呢~~~

Who: Tsung-Kai Chen Class:
When: April 05, 2009 6:48 PM  

To BigHeadAnn:
請參考一下留言第70~73的對話就清楚囉 … ^_^

Who: BigHeadAnn Class:
When: April 08, 2009 4:31 PM  

看不懂...T.T
(自己host這支php程式即可)
how 2 host?
可以麻煩你解釋一下嗎?謝謝
我很笨......

Who: Anonymous Class:
When: April 08, 2009 5:11 PM  

ok.thx

Who: Tsung-Kai Chen Class:
When: April 08, 2009 10:39 PM  

To BigheadAnn:
就是將那隻php程式,放個某個有support php的Web主機上,例如...
至於支援php的主機,在google找free php hosting就有一堆了!!

Who: IamNotSure Class:
When: April 17, 2009 11:21 PM  

HI chen:

不知为何,我的头像总是显示默认的图案(我已经换成别的图片了),而不会显示个人的Blogger的头像,能帮帮我么?

详细情况:
http://54youke.blogspot.com/2009/04/sfdgsdfgsdf.html

Who: IamNotSure Class:
When: April 17, 2009 11:23 PM  

HI chen:

不知为何,我的头像总是显示默认的图案(我已经换成别的图片了),而不会显示个人的Blogger的头像,能帮帮我么?

详细情况:
http://54youke.blogspot.com/2009/04/sfdgsdfgsdf.html

Who: Tsung-Kai Chen Class:
When: April 21, 2009 2:15 AM  

To IamNotSure:
咦,看起來似乎是每次都抓失敗囉...倒是沒遇過,但看起來有圖像出來,感覺有正常運作,該不會是被GWF擋掉了呀..XD....

Who: IamNotSure Class:
When: April 23, 2009 4:57 PM  

Chen,

我用代理试了下,发现还是那个样子 T T

发现你现在取消了显示评论者头像的Hack,不然可以看看你的有没有效果...

Who: Tsung-Kai Chen Class:
When: April 23, 2009 11:38 PM  

To IamNotSure,

是喔,那還真難搞...
但我看我的Blog都是正常的耶!都有顯示...

Who: HDLineage Class:
When: April 25, 2009 4:05 AM  

未什麼我的模組不能用
我是用官方的模組
可是就算改了也顯示不出來

Who: Tsung-Kai Chen Class:
When: April 25, 2009 10:04 PM  

To HDLineage:
你可以參考一下這篇的第76則留言,是否為同一問題!!

Who: HDLineage Class:
When: April 29, 2009 11:49 AM  

成功了
之前原來是我host的主機不支援外部連結
還必須去找一個支援的
後來找到phpnet.us 這格空間支援喔

Who: Tsung-Kai Chen Class:
When: April 29, 2009 10:28 PM  

To HDLineage,

嗯,恭喜呀,我剛去你那留言打廣告囉!

Who: Anonymous Class:
When: May 31, 2009 3:28 PM  

請問一下...
我已下載已原作者的 php 檔,也放了在支持 php 的 web hosting 上,但仍不成功,我對 php 不太認識,想請問一下是否在 php 檔上須要修改甚麼?

Who: Tsung-Kai Chen Class:
When: June 04, 2009 12:21 AM  

@Anonymous
什麼都不必改,只要確認有真的跑起來就OK了!!

Who: Alston Class:
When: July 12, 2009 1:36 PM  

我也留個言,試一下囉

Who: Anonymous Class:
When: July 23, 2009 7:10 PM  

Hi, i'm trying to apply this hack to my blog. But it doesn't works.
I have seen that actually the scripts are not hosted online.
Can you please re-upload the scripts to another host?
Many thanks

Jack

Who: Tsung-Kai Chen Class:
When: July 23, 2009 7:23 PM  

To Anonymous:
You could get the original source code here ^^:
http://svn.devjavu.com/singpolyma/trunk/blogger/avatar.php

Who: Anonymous Class:
When: July 23, 2009 9:05 PM  

Many, many thanks for you kind reply.

Please help me if you can.

This are the steps that I have done:
(Using the Minima template)


1) Searched the code:

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>

2) After it, I added the code:

<div style="clear:both">
<dt style="float:left;margin-right:5px;clear:both;" expr:id='"commentphoto" + data:comment.id'></dt>
<b:if cond='data:comment.authorUrl'>
&lt;script type=&quot;text/javascript&quot;&gt; if(typeof(commentPhotoIds) == &#39;undefined&#39;) var commentPhotoIds = []; commentPhotoIds.push({&#39;id&#39;:&#39;commentphoto<data:comment.id/>&#39;, &#39;url&#39;:&#39;<data:comment.authorUrl/>&#39;});&lt;/script&gt;
<b:else/>
&lt;script type=&quot;text/javascript&quot;&gt; if(typeof(commentPhotoIds) == &#39;undefined&#39;) var commentPhotoIds = []; commentPhotoIds.push({&#39;id&#39;:&#39;commentphoto<data:comment.id/>&#39;, &#39;url&#39;:&#39;&#39;});&lt;/script&gt;
</b:if>

3) Searched the code: </b:loop> and added before it the code: </div>

4) Before </body> I added:

<script type='text/javascript'>
//<![CDATA[
function commentPhotoDo() {
var tag;
for(var i = 0; i < commentPhotoIds.length; i++) {
tag = document.createElement('script');
tag.type = 'text/javascript';
tag.src = 'http://scrape.singpolyma.net/avatar.php?maxwidth=70&url='+encodeURIComponent(commentPhotoIds[i].url)+'&id='+encodeURIComponent(commentPhotoIds[i].id)+'&defaultimage='+encodeURIComponent('http://img139.imageshack.us/img139/1011/defaultavatarad7.png');
document.body.appendChild(tag);
}//end for var i in commentPhotoIds
}//end function commentPhotoDo
if(typeof(commentPhotoIds) != "undefined") commentPhotoDo();
//]]>
</script>



I have changed the lost php (http://scrape.singpolyma.net/avatar.php) with: http://svn.devjavu.com/singpolyma/trunk/blogger/avatar.php

All steps like in your guide, but it doen't works. I see that in your blog all works well! so what can be the problem?

Many thanks again.

Jack

Who: Tsung-Kai Chen Class:
When: July 23, 2009 9:27 PM  

@Anonymous:
Replace this script
http://svn.devjavu.com/singpolyma/trunk/blogger/avatar.php
with this new one

http://chenkaie.110mb.com/avatar.php

Who: Jack Slater Class:
When: July 23, 2009 9:54 PM  

Thanks again, Tsung-Kai Chen

I have replaced the script with yours, it now works, but the avatar shown is the standard face (that for pleople not having an avatar).

Anyway thanks.

I have also created an account on 110mb.com and uploaded the script separately, but the result is the same.

Maybe some bugs in the script?

Jack

Who: Celestine Class:
When: December 25, 2009 7:12 PM  

我已经照着版主你的方式弄,但是却没看到照片的出现
已经尝试了几遍依然如此
能否帮我解答一下吗?

http://celestinelsw.blogspot.com/