前進 Maple Land - 加拿大境外依親移民經驗分享: May 2013

同事說凹蛋糕沒摻油害我好想做來吃~~~

以下轉貼很厲害的blog:

半熟蜂蜜蛋糕（凹蛋糕）

2013/04/25 09:21

濃郁的蜂蜜雞蛋香，簡樸的外表，這一款由日本
紅到台灣的蛋糕特別的地方就是烘烤到半熟，可
以吃到組織特別的口感。

材料及做法都十分簡單，熟度可以依照個人喜歡
調整，約莫一個小時就可以享用到美味的下午茶
。想嚐鮮的朋友可以自己動手試試看~~

半熟蜂蜜蛋糕
6吋圓模1個

材料:
雞蛋1顆,蛋黃3個,細砂糖30g,蜂蜜15g,
低筋麵粉20g,香草精1/4茶匙,

事前準備工作:
1.所有材料秤量好,雞蛋3顆將蛋黃分出,只取蛋黃
2.低筋麵粉使用濾網過篩
3.烤模內部鋪上一張防沾烤焙紙
4.準備一個工作鋼盆,裝上水煮至50度c關火
5.烤箱事先預熱至170度c

步驟:
1.雞蛋1顆+3個蛋黃放入工作鋼盆中,倒入細砂糖及蜂蜜
2.用打蛋器低速將雞蛋與細砂糖及蜂蜜打散並混合均勻
3.將工作盆放入煮至50度c的溫水中隔水加溫
4.然後打蛋器以高速將蛋液打到起泡並且蓬鬆的程度
(約8-10分鐘)
5.打到蛋糊蓬鬆拿起打蛋器滴落下來的蛋糊能夠有非常清楚的
摺疊痕跡就是打好了

6.將香草精淋灑在蛋糊上,用橡皮括刀混合均勻
7.然後將已經過篩的低筋麵粉分2次加入以切拌方式混合均勻
(不要過度攪拌避免麵粉產生筋性影響口感)
8.完成的麵糊倒入烤模中

9.放入已經預熱至170度C的烤箱中烘烤16-20分鐘取出
(若希望蛋糕內部比較熟,烘烤時間可以延長至20分鐘)
10.將蛋糕移出烤模,放至鐵網架上至涼再將紙撕開
(若要送人,紙不要撕比較好看)

補充:
1.烘烤時間長短與蛋糕組織熟度有關,請依照個人
   喜歡調整
2.半熟只是給大家參考,不一定要烘烤到半熟,烘
   烤時間請依照自己能否接受程度調整,25分鐘
   是全熟程度

3.剩下的3個蛋白可以冷凍保存,或參考蛋白利用.

*烘烤16分鐘組織內部

*烘烤20分鐘組織內部,25分鐘是全熟

格友延伸做法:

metori的半熟蜂蜜蛋糕

malidy的半熟蜂蜜蛋糕（凹蛋糕）

放空燕的蜂蜜凹蛋糕

YAN的半熟蜂蜜蛋糕

山地的蜂蜜口味凹蛋糕

小熊的半熟蜂蜜凹蛋糕

MANDY的半熟蜂蜜蛋糕

丫雅的半熟蜂蜜蛋糕

于嫻的半熟蜂蜜蛋糕(凹蛋糕)

phoebe的夯~半熟蜂蜜凹蛋糕

小山的半熟蜂蜜蛋糕（凹蛋糕）

phoebe的夯~第II彈之半熟巧克力凹蛋糕

小菉的半熟蜂蜜蛋糕

brenda的半熟蜂蜜蛋糕（凹蛋糕）

原文轉自：Blogger 最新回應＋留言者頭像＋文章標題

(Pic from: softicons.com,freepik.com,all-free-download.com)

這個版本的「最新回應」小工具，其基本架構仍是延用「上個版本」的程式庫，主要差別為每則留言多了文章標題。優點是一眼就能清楚瞭解哪篇文章有了新留言，不過每則留言的區塊面積也增加了，如果喜歡介面簡潔一點的話還是可以選擇「無文章標題的版本」。以下照例先說明撈後台資料的原理，想直接安裝可跳「三、安裝程式碼」。

一、從 Json 抓留言文章標題

「最新回應」小工具的 feed 基本知識可參考「Blogger 最新回應＋留言者各種身份頭像」。由於留言的 feed 資料不含文章標題，最早的 hack 必須從文章 feed 撈資料來比對標題，但當部落格文章數目達到數百篇或是更多時，這樣的 hack 執行速度就會是大悲劇了。

還好「Blogger API 官網」說明了留言 feed 要如何與文章做連結，先找到 thr:in-reply-to 元素後，裡面可找到文章連結資料。

舉例說明，本站留言 feed 轉 Json 格式的網址為 http://wayne-fu.blogspot.com/feeds/comments/summary?alt=json-in-script，我們若搜尋「thr$in-reply-to」字串可找到該則留言的文章連結相關資料，裡面最重要的是 "source" 資料指向的 "單一文章 feed 網址"，從單一文章 feed 撈資料的速度很快，就可避免從 "網站文章 feed" 撈資料的冗長時間了。

舉其中的一個 "source" 資料當例子，把單一文章 feed 網址後面加上參數 "?alt=json-in-script" 成為這樣的字串 "http://www.blogger.com/feeds/1035379297949976554/posts/default/8856339391020730581?alt=json-in-script" 可轉成 json 格式，在瀏覽器畫面上可找到兩個重要資料：

1. 文章標題：位置在 json 資料 → entry 物件 → title 物件 → $t 字串，可看到標題字串為 "Blogger「留言欄訊息」自訂版面及樣式的方法__兼談留言字詞驗證"。

2. 文章網址：位置在 json 資料 → entry 物件 → link 陣列 → 網址資料在 "ref" 為 "alternate" 的那個物件裡，字串值為 "http://wayne-fu.blogspot.com/2012/10/comment-reminder.html"

有了以上資料就能印出標題，再將以上資料存入自設的陣列裡，若有其他則留言來自同一篇文章，就不必再重複查詢文章 feed，可減少重新送出請求(request)的次數與時間。

二、加強功能、特點

1. 既然改了版，還是多少增加了一些功能、調整了一下版面，例如：

  A：把原本展開收合的圖案 "︾"、"︽" 隱藏起來，滑鼠經過該則留言區時才顯示，讓版面簡潔、美觀許多。

  B：留言者暱稱字體加大、文章標題字體縮小。

  C：把所有區塊的 CSS 都開放出來讓使用者自訂版面。

2. 這個版本的特點為：過去的版本，若某篇文章有留言，而後來該篇文章被刪除，但該文章的留言仍會存在，照樣會出現在最新回應的小工具裏。現在這個版本既然能顯示文章標題，也順便寫了偵測文章是否被刪除的功能。若某則留言的文章被刪除，則會顯示「文章已刪除」字樣，這樣可以提醒站長到後台去把該則留言給刪了。

三、安裝程式碼

1. 這已經是第三個「最新回應」的版本，如果安裝過舊版本的話，先刪除原本的小工具，再按以下步驟重新新增一個「HTML/JavaScript」小工具即可；如果沒有安裝過的話，請先到後台 → 版面配置 → 新增小工具 → 選擇「HTML/JavaScript」→ 填入標題、以及以下程式碼：

<div id="RecentCommentsArea"></div>
<div id="RecentCommentsInfo"><a href='http://wayne-fu.blogspot.com/2012/11/recent-comment-avatar-title.html'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUW8Bcz42RgWemzwXoq4jo-LCBLFvLcPf4as1ylL-yiQWuEa6TXrGM-tz9Bg3GNrEr5jp-LCOfK3QSipBsql7WVqsm3FBCN_7xPhDXgifOYVUCu4rzZs00QyQX-rLhoMIyJmJQYciFqAwN/s1600/info.png' width='20'/></a></div>
 
<style>
#RecentCommentsArea a, #RecentCommentsInfo a {
  text-decoration: none;
}
#RecentCommentsInfo {
  font-size: 85%;
}
.rcDate {
  color: #aaaaaa; 
  font-size: 80%; 
  float: right;
}
.rcAuthor {
  font-size: 110%;
}
.rcText {
  cursor: pointer;
  margin: 5px 0px;
}
.rcPostTitle {
  font-size: 85%;
  font-weight: bold;
  line-height: 110%;
}
</style>
<script>
var rComment_prog = {
  startIndex : 1,  
  showComment : 5,
  summaryLength : 25,
  headWidth : 35,
  blogger : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7DLvcz4TStMr81cDiLe-vvJwkzFhZSsYSXDdoPlVGoLaH6OoRioV0-pAvtav_nEgSyzpSVfV4B8BOzx7JVE6JzfuG9gWQBT2t1_czOhubz5CR2wD-nJU9W8fnunnjXvaTKumYMEEs1LRp/s70/blogger.png",
  openID : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiafIk4mvU8SKP8nOBsLGYRq4Lpz6QeKSKmaqvH7ZikPxw5QVZrXLo1b807ZeatTZ39aWNusiwysh9JX1ZXLn0X2ARbHu9UWfpczRDgfXe-7B0vm54gIO12oEIOVmpPVNGjLQYIJoWR2sHx/s70/openid.png",
  anonymous : "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUAHxprcPWeAzrFVv4KT19lFFTGuT-BDJL07cHRnl-hU-uvxaCrBTbRHEhsWvHDqS1nHjzUvjiI8gdI38ZA8UF00yO7ReHERlrsrWigWFNQEZCM5Vd2-25rEi3Ehu70SNsJ9Hy1Ls_bdM/s70/noname.jpg",
  serialText : "編號",
  totalText : "總共:",
  openLogo : "︾",
  closeLogo : "︽"
};
 
rComment_prog.fetch=0;rComment_prog.total=0;rComment_prog.postUrl=[];rComment_prog.postTitle=[];rComment_prog.dg=function(a){return document.getElementById(a)};rComment_prog.linkColor=function(b){var e=rComment_prog.dg,c=(b==1)?e("rc_swap0"):e("RecentCommentsArea"),d;if(c.currentStyle){d=c.currentStyle.color}else{d=window.getComputedStyle(c).color}return d};rComment_prog.getPostTitle=function(q){var h=q.entry.link,p=q.entry.title.$t,g=rComment_prog.dg,m=rComment_prog.showComment,f,e,a,o,d,b,c=0;if(!Array.indexOf){Array.prototype.indexOf=function(k){for(var j=0;j<this.length;j++){if(this[j]==k){return j}}return -1}}while(c<h.length&&h[c].rel!="alternate"){c++}a=h[c].href;if(rComment_prog.postUrl.indexOf(a)<0){rComment_prog.postUrl.push(a);rComment_prog.postTitle.push(p)}for(f=0;f<m;f++){b="rc_postTitle"+f;o=g(b).href;d=o.indexOf("?");o=(d!=-1)?o.substring(0,d):o;e=rComment_prog.postUrl.indexOf(o);if(e>-1){g(b).innerHTML=rComment_prog.postTitle[e]}}};rComment_prog.getJson=function(b){var a=document.createElement("script");a.setAttribute("src",b);document.documentElement.firstChild.appendChild(a)};rComment_prog.event=function(a){var h=rComment_prog.total,g=rComment_prog.dg,b=rComment_prog.linkColor,f=b(1),k=b(0),e;for(e=0;e<h;e++){var c=a+e,d=g(c),j=d.parentNode.parentNode.parentNode;content=d.previousSibling,summary=content.previousSibling,click=function(m){return(function(){rComment_prog.toggle(m)})}(c),mOver=function(){this.style.color=f},mOut=function(){this.style.color=k};j.onmouseover=function(m){return(function(){m.style.display="inline"})}(d);j.onmouseout=function(m){return(function(){m.style.display="none"})}(d);content.style.display="none";d.style.display="none";d.onclick=click;content.onclick=click;summary.onclick=click;content.onmouseover=mOver;content.onmouseout=mOut;summary.onmouseover=mOver;summary.onmouseout=mOut}};rComment_prog.toggle=function(a){if(typeof a!="number"){var e=rComment_prog.dg(a),d=e.previousSibling,b=d.previousSibling;if(d.style.display=="none"){rComment_prog.swap(1,e,d,b)}else{rComment_prog.swap(0,e,d,b)}}else{var c=rComment_prog.total,f=rComment_prog.dg,e;for(i=0;i<c;i++){n="rc_swap"+i;e=f(n);d=e.previousSibling,b=d.previousSibling;if(a==1){rComment_prog.swap(1,e,d,b)}else{rComment_prog.swap(0,e,d,b)}}}};rComment_prog.swap=function(a,d,c,b){if(a==1){b.style.display="none";c.style.display="inline";d.innerHTML=rComment_prog.closeLogo;d.title="收起留言"}else{c.style.display="none";b.style.display="inline";d.innerHTML=rComment_prog.openLogo;d.title="展開留言"}};rComment_prog.init=function(a){var b=rComment_prog.dg,c;if(!a){a=rComment_prog.startIndex}b("RecentCommentsArea").innerHTML="<div style='text-align: center;'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhidUeJx8ztONRsktTlXTGKxAkLDKcIzBE7Fj59s7IKM1SdXb3onkMTo8nMIvXQSUJzWIp5pAnHExJSS1mULeOmSj_KyFDxuzQKimoZXX-aNr6uEN39WnduijrS3IbPsh-krtZiSbUNkb0K/s512/indicator-light.gif'/></div>";c="/feeds/comments/default?orderby=published&start-index="+a+"&max-results="+(rComment_prog.showComment+1)+"&alt=json-in-script&callback=rComment_prog.main";rComment_prog.getJson(c)};rComment_prog.switchPage=function(b,a,f){var d=rComment_prog.showComment,e=(b>d),c="";b=e?d:b;c+="<p><a href='http://wayne-fu.blogspot.com/2012/11/recent-comment-avatar-title.html' target='_blank'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUW8Bcz42RgWemzwXoq4jo-LCBLFvLcPf4as1ylL-yiQWuEa6TXrGM-tz9Bg3GNrEr5jp-LCOfK3QSipBsql7WVqsm3FBCN_7xPhDXgifOYVUCu4rzZs00QyQX-rLhoMIyJmJQYciFqAwN/s1600/info.png' title='最新回應＋留言者頭像＋文章標題\n程式設計：WFU BLOG' style='float: left; width: 20px;'/></a>";c+="<div style='text-align: right;'><a href='javascript:rComment_prog.toggle(1)' title='留言全部展開'>"+rComment_prog.openLogo+"</a>  <a href='javascript:rComment_prog.toggle(0)' title='留言全部收起'>"+rComment_prog.closeLogo+"</a>  ";c+=rComment_prog.serialText+" "+a+"-"+(a+b-1)+", "+rComment_prog.totalText+" "+f+". ";if(a>rComment_prog.startIndex){c+="<a href='javascript:rComment_prog.init("+(a-d)+");' title='上一頁'><<</a>  "}if(e){c+="<a href='javascript:rComment_prog.init("+(a+d)+");' title='下一頁'>>></a>"}c+="</div></p>";rComment_prog.dg("RecentCommentsInfo").innerHTML=c};rComment_prog.main=function(B){var C=rComment_prog.dg,f=B.feed;if(!f.entry){C("RecentCommentsArea").innerHTML="<div style='text-align: center;'>目前尚無留言</div>"}function k(w){var J,j=w.length,I=[],K={};for(J=0;J<j;J++){K[w[J]]=0}for(J in K){I.push(J)}return I}var h=f.entry.length,a=parseInt(f.openSearch$startIndex.$t),p=parseInt(f.openSearch$totalResults.$t),x="",H=(rComment_prog.showComment>h)?h:rComment_prog.showComment,o=[],d=[],y="",v,u=0;rComment_prog.fetch=h;rComment_prog.total=H;x+="<ul style='list-style: none; padding: 0px;'>";for(v=0;v<H;v++){var b=f.entry[v],r=b.author[0].name.$t,t=b.content.$t,D=/<.*?>/g,e=t.replace(D,"").substr(0,rComment_prog.summaryLength),E=b.published.$t.substr(0,10),A=b.author[0].gd$image.src,z=/\/s\d{2}.*?\//ig,m=rComment_prog.headWidth,q="/s"+m*2+"/",s=(b.author[0].uri)?b.author[0].uri.$t:"",c="關於"+r,F="",G="",g;if(b.title.$t){while(u<b.link.length&&b.link[u].rel!="alternate"){u++}g=b.link[u].href}else{g=(b["thr$in-reply-to"])?b["thr$in-reply-to"].href:"http://wayne-fu.blogspot.com/2012/11/recent-comment-avatar-title.html"}if(b["thr$in-reply-to"]){o[v]=b["thr$in-reply-to"].source}else{G="文章已刪除"}if(A.search("blank.gif")>0){if(s){A=rComment_prog.openID}else{A=rComment_prog.anonymous;s=g;c=""}}if(A.search("openid16-rounded.gif")>0){A=rComment_prog.openID}if(A.search("b16-rounded.gif")>0){A=rComment_prog.blogger}F=A.replace(z,q);x+="<li><i class='rcDate'>"+E+"</i>";x+="<span style='float:left; width:"+m+"px;'><a href='"+s+"' target='_blank'><img src='"+F+"' onerror='this.src=\""+A+"\"' style='width:"+m+"px; padding: 0px; border: 1px solid #ccc;' title='"+c+"'/></a></span>";x+="<div style='margin-left:"+(m+10)+"px; word-wrap: break-word;'><b class='rcAuthor'>"+r+"：</b>";x+="<div class='rcText'><span title='展開留言'>"+e+"... </span><span title='收起留言'>"+t+" </span><a id='rc_swap"+v+"' href='javascript:void(0)' title='展開留言'>"+rComment_prog.openLogo+"</a></div>";x+="<div class='rcPostTitle'>-- <a id='rc_postTitle"+v+"' href='"+g+"' target='_blank'>"+G+"</a></div>";x+="</div><div style='clear: both;'/></li>"}x+="</ul>";C("RecentCommentsArea").innerHTML=x;rComment_prog.switchPage(parseInt(h),a,p);rComment_prog.event("rc_swap");d=k(o);l=d.length;for(v=0;v<l;v++){y=d[v].replace("default","summary")+"?alt=json-in-script&callback=rComment_prog.getPostTitle";rComment_prog.getJson(y)}};rComment_prog.init();
</script>

存檔後即可，想先看效果可參考右邊的側邊欄。

2. 以上紅字、藍字為重要的修改參數，請參考「四、修改參數」。

3. AR 行以後的 javascript 區，為了節省空間所以把程式碼壓縮了；如果有其他的客製需求、或想瞭解原始碼的話，請下載「這個原始檔」。雖然附檔名為 js，但內容包含 HTML、CSS、Javascript，所以是不能外連的。

四、修改參數

請參照上面的程式碼行號來修改以下參數──

H～J：這是小工具下方換頁區塊的 CSS，可自行修改字體大小或其他 style 參數。

K～O：這是日期區塊的 CSS，可自行修改顏色、字體大小、或其他 style 參數。

P～R：這是留言者暱稱區塊的 CSS，可自行修改字體大小、或其他 style 參數。

S～V：這是留言內容區塊的 CSS，可自行修改上下邊界值、或其他 style 參數。

W～AA：這是文章標題區塊的 CSS，可自行修改字體大小、行高、或其他 style 參數。

AE：從第幾則留言開始顯示，通常設為 1。

AF：一頁顯示幾則留言

AG：留言摘要的字元數

AH：頭像圖案的寬度像素 px 值

AI：藍字可改為自訂的 Blogger Logo 圖案網址。

AJ：藍字可改為自訂的 OpenID 圖案網址。

AK：藍字可改為自訂的匿名圖案網址。

AL～AM：請自行對照一下小工具就知道怎麼改了

AN：展開留言的字元圖案

AO：收合留言的字元圖案

五、小結

最新回應這個小工具不知不覺寫了三個版本，已發現的 bug 也都清得差不多了，這一版應該算最完整的版本了，看起來這個小工具也該告一段落了。但我其實還有一個 idea 尚未實現，就是把留言的內容灌進文章區塊，因為這個區塊很大，實現的話效果應該滿有趣的，而目前我已經成功地把隨機文章灌到首頁的文章區塊，相信留言也是可以，等將來如果弄出成果時就可結束這個系列了。

前進 Maple Land - 加拿大境外依親移民經驗分享

Wednesday 29 May 2013

第一階段通過啦! 呀比~~~ - 境外依親移民

Tuesday 14 May 2013

【轉錄】健康的凹蛋糕～❤

半熟蜂蜜蛋糕（凹蛋糕）

Sunday 12 May 2013

等待真是漫長......T_______T

Thursday 9 May 2013

我不是來賣藥的

Wednesday 8 May 2013

【轉錄】Blogger 最新回應＋留言者頭像＋文章標題

Friday 3 May 2013

突然有感