一個步驟找出部落格速度很慢的真相


Pingdom測速網站:http://tools.pingdom.com/fpt/

原文摘自:Pingdom 找出拖垮網站速度的元凶(網頁速度檢測) - 香腸炒魷魚:

小笨霖英語筆記本 七十四: Off 的妙用

"I don't have to work today."= "I am off today." 會用off,生活便利無窮!

1. I am off today. 我今天不用上班.

2. She lives off campus. 她住在校外. (on cappus, 住在校內)

3. Off my sofa. 給我從沙發上下來. ( Three on, two off. 就是三個人上車, 兩個人下車)

4. Tell her the whole thing is off. 告訴她整件事己經取消了.

5. I am off the hook now. 我解脫了.

6. My girlfriend and I have been on and off, on and off several times. 我跟我女朋友分分合合好幾次了.

7. Hands off. 把手拿開.

8. I am off to bed right now. 我要上床去睡覺了.

9. You got $20 off your first purchase. 第一次購買可以節省二十塊喔!

10. Could you off my computer? 你能不能關掉我的電腦? ( turn off 可以簡略成 off, turn on 就沒有人簡稱 on )

轉摘自:小笨霖英語筆記本 七十四: Off 的妙用 詳原文請至原作者部落格,感恩您。

免費幫你設計Logo和按鈕



今天發現一個很不錯的小網站:可以免費幫你設計Logo和各種按鈕

點進去後,雖然是國外網站,不過因為介面非常簡單,根本不需要擔心語言的問題



首先,讓我們點到這個網站:製作logo及按扭,接著你就會看到打開來的畫面如下:






上面看到的是讓你選你喜歡的Logo樣式,選單內有多不同樣式
我只貼了大約一半



 接下來就是讓你選你喜歡的按鈕樣式了,選單內有多不同樣式如下:



看你想先試做LOGO還是按鈕,只要在你喜歡的圖示上點一下,就可以進入到製作頁面
他們的選擇性非常多元,點進去後還可改變顏色、背景、質地、大小和陰影等
就連文字的排列都可以自己組合,非常彈性,真的做到量身訂做
現在就來選一個你想做的東西吧!!




選好了嗎?

這次部落迷(BlogMe)要為大家示範的,是右下角,用紅色圈起來的樣式




在圖示上點一下進入,即可看到這個畫面:




在文字輸入列裡,我輸入「中文嘛通!」
而且我刻意換行輸入,還寫了全形的標點符號,上面的預覽Logo很也地就秀出來了
你還可以依自己的喜好更改文字的顏色、呈現方式……等


有些LOGO的設計是有底圖的,那你就連背景都可以選
他們有背景庫,如木材質感、咖啡豆、碎石頭等,數十種選擇

記得每更換一下新的設定,就看一下上面的預覽結果
看自己喜不喜歡



好囉,要完成了!
在頁面下方可以讓你選擇存檔的類型
選好了之後,就按下「Render Logo」



接著,結果就出來啦~~~
他們非常的貼心,還會問你要 「下載」、「編輯」(若你覺得不滿意,想繼續編輯)、
以及拿到HTML Code,甚至還可以把你的作品打包寄回去哦!!!!


不過,由於取得HTML碼是要加入會員(免費,用其他的帳號加入就行)
但是部落迷(Blog Me!)我……是個懶人(你了我,對吧~)
所以就不加入了,反正如果你上傳到你的網路相簿,自然可以取得html code,你說是嗎~


今天就為各位介紹這個網站
哦對了,仔細看他的使用條件,他表示此服務可以讓你「盡情」使用不必顧慮,但若如果你們喜歡網站提供的服務,別忘了幫忙推廣這個網頁,或留下連結哦!


文章作者:部落迷(Blog Me!)


免費幫你設計Logo和按鈕



今天發現一個很不錯的小網站:可以免費幫你設計Logo和各種按鈕

點進去後,雖然是國外網站,不過因為介面非常簡單,根本不需要擔心語言的問題



首先,讓我們點到這個網站:製作logo及按扭,接著你就會看到打開來的畫面如下:






上面看到的是讓你選你喜歡的Logo樣式,選單內有多不同樣式
我只貼了大約一半



 接下來就是讓你選你喜歡的按鈕樣式了,選單內有多不同樣式如下:



看你想先試做LOGO還是按鈕,只要在你喜歡的圖示上點一下,就可以進入到製作頁面
他們的選擇性非常多元,點進去後還可改變顏色、背景、質地、大小和陰影等
就連文字的排列都可以自己組合,非常彈性,真的做到量身訂做
現在就來選一個你想做的東西吧!!




選好了嗎?

這次部落迷(BlogMe)要為大家示範的,是右下角,用紅色圈起來的樣式




在圖示上點一下進入,即可看到這個畫面:




在文字輸入列裡,我輸入「中文嘛通!」
而且我刻意換行輸入,還寫了全形的標點符號,上面的預覽Logo很也地就秀出來了
你還可以依自己的喜好更改文字的顏色、呈現方式……等


有些LOGO的設計是有底圖的,那你就連背景都可以選
他們有背景庫,如木材質感、咖啡豆、碎石頭等,數十種選擇

記得每更換一下新的設定,就看一下上面的預覽結果
看自己喜不喜歡



好囉,要完成了!
在頁面下方可以讓你選擇存檔的類型
選好了之後,就按下「Render Logo」



接著,結果就出來啦~~~
他們非常的貼心,還會問你要 「下載」、「編輯」(若你覺得不滿意,想繼續編輯)、
以及拿到HTML Code,甚至還可以把你的作品打包寄回去哦!!!!


不過,由於取得HTML碼是要加入會員(免費,用其他的帳號加入就行)
但是部落迷(Blog Me!)我……是個懶人(你了我,對吧~)
所以就不加入了,反正如果你上傳到你的網路相簿,自然可以取得html code,你說是嗎~


今天就為各位介紹這個網站
哦對了,仔細看他的使用條件,他表示此服務可以讓你「盡情」使用不必顧慮,但若如果你們喜歡網站提供的服務,別忘了幫忙推廣這個網頁,或留下連結哦!


文章作者:部落迷(Blog Me!)


加入FB 讚 + 寄出, 於每篇文章前或後

Add Facebook XFBML Like Button to Blogger

(XFBML) version--Like button along with count and send
                             --for XFBML (have FB Page) user only

這個版本加了二個革命性的重要功能:1、幫你做精準行銷 2、病毒行銷



功能一
除了可以按「讚」外,還多了一個「寄送」的選項,若是有讀者特別喜歡你的某篇文章,甚至想要收藏起來、或是寄給某個需要該文內容的目標對象,這簡直就是直接幫你做推薦、轉介紹、以及精準行銷,連行銷對象都幫你設定好了!(呵呵,突然在我腦海裡出現一個武俠畫面---尚方寶劍,出鞘必見血!)好啦,我知道我太投入了……

功能二
讓我們按讚的同時,還可以留下評論,這樣使讚的功能更為大幅提高,不但加大了讀者打開連結網頁的機會,甚至無形中,還讓你的讀者群有機會將你的某篇文章,因為按讚分享出去後,還產生了討論的效應!


好吧,接下來我們就來看範例,究竟這件事是怎麼發生的……


The best feature of XFBML version is when someone likes your post and wants to share it in their Facebook profile, it will open a comment box to add his comment. They can also send your post to their friends whom they like to.
like comment
facebook send


首先,必須到FB的官網申請專屬於你的程式碼(記得先登入FB),接下來你就會看到這個頁面,把空格處填入相關資訊,再按下「Get Code」鍵即可。


Like options

In the XFBML part there will be two set of snippets, the first one is the script and next is the button snippet (highlighted in blue) to render it.
XFBML Script


Step 1. 
進入後台,選擇  範本 > 修改HTML > 按繼續 >勾選"展開小裝置範本"。


Step 2. 
打開「修改HTML」後,找到下面我以粗體字標示出來的地方:
<html ...... xmlns:expr='http://www.google.com/2005/gml/expr'>

在這段文字的後面,加入如下的語法

xmlns:fb='http://ogp.me/ns/fb#'
記得要加入一個半形字的空格,所以,出來的結果應該看起來像這樣:
<html ...... xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://ogp.me/ns/fb#'>
這個語法的功能是,讓舊版本的瀏覽器(如IE),也可以產生作用。


Step 3. 
找到 <body> (若你用的是Google Blogger內建的範本,請找這段語法:<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
找到之後,直接(不須任何空格或分段)
在後面加入你剛才在FB官網取得的程式碼第一段,如下:
<div id='fb-root'/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/zh_TW/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
請記得要確認程式碼中標式的語文是否是繁體中文(zh_TW),大部份直接給的會是英文(en_US),記得把它代換為繁體中文,否則你的網友們看到的就不是「讚」,而是「Like」了。

當然,如果你的部落格不是使用繁體中文,也請記得將語言改為您使用的文字(紅色部份),在這裏的例子(zh_TW)舉例的是台灣,使用繁體中文。

**上例原作者將FB官網提供的程式碼稍作修正,但是更為方便,連粉絲頁的APP ID都不必寫進去了!


Step 4. 
找到 <data:post.body/> ,在後面(或前面,看你想把他放文章最前面或最後面)直接加入你剛才在FB官網取得的程式碼第二段,如下:
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div class='like'>
<fb:like expr:href="data:post.url"
send="true" show_faces="true" width="450" font="arial"></fb:like>
</div>
</b:if>
在這裏加的是第二段程式碼,原作者也做了更好的修正(即語法中綠色的部份),原來官網產生的程式碼在按「讚」後,只會在FB牆上顯示該篇文章的URL,而作者使用的修正碼則會直接顯示超連結。

至於你看到藍色語法的部份,也是原作者額外加入的,這個目的是讓「讚」與「寄送」的選項會在你所有的頁面。

這個部份是比較困難的步驟,要注意哦:
中間被”fb:lke”標籤包圍的部份,是必須再依每個人的狀況更改的。
當你在FB官網依序填入你的選擇後,會產生一組程式碼,也就是出現在程式碼第三段的語法

只會在以我個人為例,我喜歡如下圖的呈現方式:

所以我的程式碼就是:
<fb:like href="http://blog-me-sharon.blogspot.com/" send="true" layout="button_count" width="150" show_faces="false"></fb:like>
但因為必須將href="http://blog-me-sharon.blogspot.com/"改為 expr:href="data:post.url”,所以在修改後,這一行的語法會變成:
<fb:like expr:href="data:post.url" send="true" layout="button_count" width="150" show_faces="false"></fb:like>
接著,再把改好的語法,放進由藍色<if>包圍的中間,那麼前面整段語法會變成:
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div class='like'>
<fb:like expr:href="data:post.url" href="http://doctor-lin.blogspot.com/" send="true" layout="button_count" width="700" show_faces="false"></fb:like>
</div>
</b:if>

另外,包括寬度單位(width)、是否顯示大頭貼(show_faces="true")、是否出現「寄送」選項(send="true)都是可以依你自己的喜好更改,不要就是false,要就是true,你可以隨心所欲的設定。




Step 5. 
到這裏就大功告成囉!!別忘了在存檔後,也將你的範本下載到你的硬碟裡備份。





加入FB 讚 + 寄出, 於每篇文章前或後

Add Facebook XFBML Like Button to Blogger

(XFBML) version--Like button along with count and send
                             --for XFBML (have FB Page) user only

這個版本加了二個革命性的重要功能:1、幫你做精準行銷 2、病毒行銷



功能一
除了可以按「讚」外,還多了一個「寄送」的選項,若是有讀者特別喜歡你的某篇文章,甚至想要收藏起來、或是寄給某個需要該文內容的目標對象,這簡直就是直接幫你做推薦、轉介紹、以及精準行銷,連行銷對象都幫你設定好了!(呵呵,突然在我腦海裡出現一個武俠畫面---尚方寶劍,出鞘必見血!)好啦,我知道我太投入了……

功能二
讓我們按讚的同時,還可以留下評論,這樣使讚的功能更為大幅提高,不但加大了讀者打開連結網頁的機會,甚至無形中,還讓你的讀者群有機會將你的某篇文章,因為按讚分享出去後,還產生了討論的效應!


好吧,接下來我們就來看範例,究竟這件事是怎麼發生的……


The best feature of XFBML version is when someone likes your post and wants to share it in their Facebook profile, it will open a comment box to add his comment. They can also send your post to their friends whom they like to.
like comment
facebook send


首先,必須到FB的官網申請專屬於你的程式碼(記得先登入FB),接下來你就會看到這個頁面,把空格處填入相關資訊,再按下「Get Code」鍵即可。


Like options

In the XFBML part there will be two set of snippets, the first one is the script and next is the button snippet (highlighted in blue) to render it.
XFBML Script


Step 1. 
進入後台,選擇  範本 > 修改HTML > 按繼續 >勾選"展開小裝置範本"。


Step 2. 
打開「修改HTML」後,找到下面我以粗體字標示出來的地方:
<html ...... xmlns:expr='http://www.google.com/2005/gml/expr'>

在這段文字的後面,加入如下的語法

xmlns:fb='http://ogp.me/ns/fb#'
記得要加入一個半形字的空格,所以,出來的結果應該看起來像這樣:
<html ...... xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://ogp.me/ns/fb#'>
這個語法的功能是,讓舊版本的瀏覽器(如IE),也可以產生作用。


Step 3. 
找到 <body> (若你用的是Google Blogger內建的範本,請找這段語法:<body expr:class='&quot;loading&quot; + data:blog.mobileClass'>
找到之後,直接(不須任何空格或分段)
在後面加入你剛才在FB官網取得的程式碼第一段,如下:
<div id='fb-root'/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/zh_TW/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
請記得要確認程式碼中標式的語文是否是繁體中文(zh_TW),大部份直接給的會是英文(en_US),記得把它代換為繁體中文,否則你的網友們看到的就不是「讚」,而是「Like」了。

當然,如果你的部落格不是使用繁體中文,也請記得將語言改為您使用的文字(紅色部份),在這裏的例子(zh_TW)舉例的是台灣,使用繁體中文。

**上例原作者將FB官網提供的程式碼稍作修正,但是更為方便,連粉絲頁的APP ID都不必寫進去了!


Step 4. 
找到 <data:post.body/> ,在後面(或前面,看你想把他放文章最前面或最後面)直接加入你剛才在FB官網取得的程式碼第二段,如下:
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div class='like'>
<fb:like expr:href="data:post.url"
send="true" show_faces="true" width="450" font="arial"></fb:like>
</div>
</b:if>
在這裏加的是第二段程式碼,原作者也做了更好的修正(即語法中綠色的部份),原來官網產生的程式碼在按「讚」後,只會在FB牆上顯示該篇文章的URL,而作者使用的修正碼則會直接顯示超連結。

至於你看到藍色語法的部份,也是原作者額外加入的,這個目的是讓「讚」與「寄送」的選項會在你所有的頁面。

這個部份是比較困難的步驟,要注意哦:
中間被”fb:lke”標籤包圍的部份,是必須再依每個人的狀況更改的。
當你在FB官網依序填入你的選擇後,會產生一組程式碼,也就是出現在程式碼第三段的語法

只會在以我個人為例,我喜歡如下圖的呈現方式:

所以我的程式碼就是:
<fb:like href="http://blog-me-sharon.blogspot.com/" send="true" layout="button_count" width="150" show_faces="false"></fb:like>
但因為必須將href="http://blog-me-sharon.blogspot.com/"改為 expr:href="data:post.url”,所以在修改後,這一行的語法會變成:
<fb:like expr:href="data:post.url" send="true" layout="button_count" width="150" show_faces="false"></fb:like>
接著,再把改好的語法,放進由藍色<if>包圍的中間,那麼前面整段語法會變成:
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div class='like'>
<fb:like expr:href="data:post.url" href="http://doctor-lin.blogspot.com/" send="true" layout="button_count" width="700" show_faces="false"></fb:like>
</div>
</b:if>

另外,包括寬度單位(width)、是否顯示大頭貼(show_faces="true")、是否出現「寄送」選項(send="true)都是可以依你自己的喜好更改,不要就是false,要就是true,你可以隨心所欲的設定。




Step 5. 
到這裏就大功告成囉!!別忘了在存檔後,也將你的範本下載到你的硬碟裡備份。






up