skip to main |
skip to sidebar
近期，Blogger 平台進行一次重大更新，那就是將 Blogger 系統的部落格所屬網址，會以讀者瀏覽連線時所屬的國家或地區為依據，自動導向其國家或地區的專屬網域。除非是自訂專屬網址的網頁，就不會被 Google 自動轉址。而這幾天的台灣的網域也開始進行網址導向了，例如台灣網域就會將「.com」轉向成「.tw」，日本網域轉向成「.jp」等等。相關資訊可以參考官方的中文說明：「為什麼我的網誌會重新導向特定國家/地區的網址？」
其目的是為了因應各個國家對其言論管制標準有所差別，所以當某國法律對其法域的言論管制有所限制時，Blogger 平台可單就其網域的專屬網址進行禁止就好，而不必影響其他網域的言論（或說 Google 服務）輸出。可參考官方說明：
「這麼做是為了提供更多支援服務，以便配合當地政策來管理網誌內容。如果我們收到移除要求，指出某項內容違反當地法律，則適用這些法律的當地網域讀者就無法再瀏覽這些內容。這項改變完全遵照 Google 對言論自由與爭議內容的處理方針施行 (新舊版處理方針的內容完全相同)。」
不久之前，Blogger 發布了推出「串連式留言（Threaded comments）」功能的這項消息，總算補充了此平台在類似功能上的不足。隨後也有 Blogger 的使用者釋出了客製化版本，例如「Blogger threaded commenting hack v2 」這篇文章，作者打破了 Blogger 官方兩層式的串連，而設計初六層式的串連留言，可說相當特別。（記得原作者在 Blogger 官方尚未推出串連式功能的時候，就曾自製出個人的串連式版本功能了。）
昨天閱讀到網友整裡並分享其他客製化風格（Style）的文章，我也覺得相當實用，有興趣的 Blogger 使用者可以試試看，我可能要等未來有時間了才會套用看看吧，最近就保持進度的念書下去吧。
最後將這三則文章作個簡單的說明，其中「Threaded Comments for Blogger With Awesome Style」是將原來官方版本作風格（Style）上的單純優化，例如增加框線、圓角與按鈕優化等，而「5 Threaded Comment styles」除了有特殊的客製版面設計外，與前文最大的不同在於使用色塊將個別串連的留言獨立起來，讓每個串連間的聯系可以更明顯。最後「Highlight Author Comments in Blogger's New Threaded Comment System」如同標題說明一般，是讓作者回應高光功能放入新的串連式連結之中。讀者可以好好比較各種風格的不同，在選擇喜歡的範本進行套用，建議點選原文閱讀原作者更仔細的說明。
等待許久，Blogger 終於推出「串連式留言（Threaded comments）」功能，通常在台灣大多稱作「直接回覆討論串」，是指使用者可以直接在一系列留言中直接就某個留言進行回覆，在系列留言中獨立出一個留言串，讓對話方可以方便的找到彼此的留言。可說是非常實用的功能。
官方消息來自於「Engage with your readers through threaded commenting-Blogger Buzz」，官方教學是這篇「Threaded comments - Blogger Help（中文網頁）」
如同之前文章一再透露，我是美味書籤〈Delicious〉這項「古老」網路服務的長期使用者，對於美味書籤的使用我幾乎達到了「直覺」甚至「依賴」的程度，有很多我過去的網路訊息都儲存在美味書籤之中，而且沒有備份，對於之前Yahoo!想把美味書籤服務關閉的消息也讓我「歇斯底里」了一下，對於書籤服務能夠延續下去也讓我鬆了一口氣。
延續「Facebook 的「讚」與「分享」元件的比較與推薦」以及「「讚」（Like）功能的安裝（for Blogger）」兩則文章的主題，這次紀錄一下關於「分享」（Share）功能的安裝方式如下：
Step 1:
登入 Blogger，進入「設計」並點選「修改 HTML」（強烈建議您在編輯範本之前，先儲存備份。）。然後，請尋找「</head >」。
Step 2:
將以下 CSS code 放置你想要的位置，其中「width」部份必須依你主文處的寬度來調整：
<a expr:share_url='data:post.canonicalUrl' name='fb_share' rel='nofollow' type='button_count'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
Step 3:
儲存範本（Template）即可。以上是引用網友「Facebook share counter button推文計數按鈕如何安裝」這篇文章的方法，作者也分享了位置微調的方法與相關看法，也建議讀者們能夠點選文章延伸閱讀一番。
有網友閱讀「Facebook 的「讚」與「分享」元件的比較與推薦」一文後詢問如何安裝 Facebook「讚」（Like）按鈕，Facebook 的 Social plugins 本身有提供 Like Button 生產器與說明的頁面，不過其功能較接近給單一頁面網址使用的，與多分頁模式的部落格相比似乎不太適合，因此我參考其他網友的文章整理出一下方法：
Step 1:
登入 Blogger，進入「設計」並點選「修改 HTML」（強烈建議您在編輯範本之前，先儲存備份。）。
Step 2:
將以下 CSS code 放置你想要的位置，其中「width」部份必須依你主文處的寬度來調整：
<iframe allowtransparency="true" expr:src=""http://www.facebook.com/plugins/like.php?href=" + data:post.canonicalUrl + "&layout=standard&show_faces=true&width=500&action=like&colorscheme=light"" frameborder="0" scrolling="no" style="border: none; height: 35px; overflow: hidden; width: 500px;"></iframe>
<div style='clear: both;'/>
以上 CSS code 參考海芋小站的「在Blogger上放上Facebook 的讚按鈕」一文。不過無法選擇按鈕樣式（Button Type），想選擇其他樣式的讀者可以連結到「Blogger Widgets」的這篇「Facebook Like / Recommend Button For Blogger」文章，內文有附「Like Button 生產器」，使用者能夠進行樣式及其它功能的微調。
Step 3:
儲存範本（Template）即可。此時，應該可以使用 Like Button 了。此外，除了以「iframe」方式安裝外，還有網友提供「XFBML」方式來呈現，請參考「Facebook Social plugins - Like Button 無痛導入」一文。
Facebook 社群網站中有兩種社群元件（Social plugins ）非常類似，一種是「讚」（Like Button）的計數按鈕（有稱作貼紙，以下同），另一種是「分享」（Share）的計數貼紙。其中「分享」計數貼紙是較早期的 Facebook Widgets 社群功能，可認為是目前社群元件（Social plugins）的前身。
「讚」與「分享」使用上的不同
使用上，當讀者按下「讚」（Like）時，那麼被按下「讚」的網頁連結會直接出現在讀者的 Facebook 個人檔案，使用上非常方面，一個動作即可完成。但是它的缺點在於 Facebook 會直接抓取網頁內容作為文章摘要，讀者本身是不能修改的，因此如果該網頁存在有過多不相干訊息的話，也很容易讓 Facebook 摘入離題的摘要。
» Facebook「讚」（Like）功能的安裝教學（for Blogger）
與「讚」的是，當讀者按下「分享」(Share)時，首先會跳出一個工作視窗，讀者可以修正Facebook本身摘入的標題、內容或圖案，甚至讀者自行新增，等到讀者自行認定正確後，在分享到讀者本身的 Facebook 個人檔案。缺點自然是讀者比需多出數個步驟始能完成分享的動作。
» Facebook「分享」（Share）功能的安裝（for Blogger）
可說各有特色，有失有得。
部落格設計上，個人較推薦「讚」（Like）
對於部落格本身，為了讓社群功能最大話，自然是兩種功能兼具最好，不過有時為了版面本身的設計因素，或是為了讀者閱讀環境最佳化等考量，有時候往往只能選擇其一作為社群功能時，我個人認為應以「讚」（Like）為優先，有以下幾點理由：
1.「讚」只需一個動作：
我個人認為網路便捷性高時較能鼓勵網友多於分享，畢竟 Facebook 的摘入誤判屬於特殊情形，只要版面不必要得內容減少即可避免（也有 Facebook 本身的新功能進化）。
2.「讚」較容易被點選：
讀者會分享文章，通常在於讀者認文章程度不錯，並且達到可分享的程度時（當然有時是不論文章程度好壞，因打到讀者分享點而分享的），但是，有時候讀者雖然認為文章寫得不錯，但是還未達到分享的程度時，這時候「讚」較適合讀者的讀後情境，故「讚」的功能範圍較「分享」廣闊。
3.「讚」目前較普遍：
由於「讚」是屬於較近期的社群元件（Social plugins），因此目前各網絡頁面多以「讚」為優先。多數「分享」與「讚」併呈，較少見單獨「分享」的（多數是早期網站未作新增或更新的）。
4.「分享」有替代方式：
Facebook 另有將「分享」設置於書籤列超連結的「javascript」方式，而較喜歡分享的網友多數都使用該方式進行分享的，故分享按鈕會通常情形僅為計數功能而已。
當然，以上為個人觀念狹隘的意見，尚需端視讀者本身的網路習慣而定。
今天從 BloggerTheme.Net 的這篇文章看來的教學，簡單的翻譯一下：
如何在圖片上製造不透明效果(for Blogger)呢？首先，原文作者以 hover effect （是指當滑鼠指標指著某個網頁元素，但尚未啟用（或點選）這個元素時，而產生的效果風格。）來作為增加不透明的特效手法。步驟如下：
Step 1:
登入 Blogger，進入「設計」並點選「修改 HTML」（強烈建議您在編輯範本之前，先儲存備份。）。然後，請尋找「</head >」。
Step 2:
將以下 CSS code 放置於「</head>」之前（或者說是<head> 與 </head> 之間）：
<style type='text/css'>
a.opacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}
a.opacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>
Step 3:
儲存範本（Template）。現在，當您想在部落格中的某一圖片增加不透明特效時，必須在圖片的「linking code」增加「class="opacity"」這個步驟在你的「image code」之中，例如原文中的< a >標籤。
正常的Code：
<a href="http://stickeraction.com/nomistreatment/go" title="禁虐"><img src="http://stickeraction.com/nomistreatment/sticker/3" alt="禁虐" border="0" /></a>
改變後：
<a class="opacity" href="http://stickeraction.com/nomistreatment/go" title="禁虐"><img src="http://stickeraction.com/nomistreatment/sticker/3" alt="禁虐" border="0" /></a>
範例：
最後，藉機會傳播一下：「請愛護小動物，不要輕易地傷害牠！」
如果想要增加 Tweetmeme button 在自己的 Blogger site 的話，我參考了「Tweetmeme Help」中的兩篇文章（文章一、文章二），進行了 Template 的編輯。
其中，在想要增加 Tweetmeme button 的地方增加以下語法：
<script type="text/javascript">
tweetmeme_url = '<data:post.url/>';
</script>
<script type="text/javascript" src="http://tweetmeme.com/i/scripts/button.js"></script>
「TweetMeme Button」的解說中，使用者也可以自行選擇樣式（也好像只有 Compact 可以選擇）與短網址提供來源。再者，也可以增加以下語法，讓推文內容變成「RT @username title (link)」範本。
tweetmeme_source = '推特 username';
得知部落格入圍還蠻意外的，畢竟是第一次參加 (已經是第四屆了)，也覺得自己的內容不夠充實，單調的內容也似乎無法得到評審們的青睞，所以心底不敢抱有太大期望，加上最近生活突然變的忙碌，幾乎是有點淡忘這次比賽接續的發展了。
聽說主辦單位有寄通知函到報名信箱，不過我好像沒有收到耶 (還是收到垃圾郵件被我刪除了)，我是有網友告訴我公佈在初審入圍名單才得知的，有點尷尬，後來仔細閱讀《部落格大獎張貼入圍宣告相關辦法》後，回應主辦單位的要求而發表這篇文章。
我有看到許多高水準的優質部落報名參加耶，還有一些網路上認識的朋友也紛紛入圍了，跑去每個網站為大家道賀恭喜一下 (愛湊熱鬧)，蠻為大家感到高興的，畢竟能入圍就是一種肯定與鼓勵。
大家加油！
活動首頁：http://blogaward.chinatimes.com
初審入圍：年度最佳訊息觀點部落格
在 Blogger.com 中，若安裝某個 Page Elements 後，這 Page Elements 將顯示在部落格每個頁面之中。不過我在很久之前看過幾篇文章，表示只要設定好條件，是可以控制 Elements 所顯示的頁面的。
例如將某個 Page Elements 只顯示在瀏覽首頁的側邊列 (Sidebar) 上，或是只顯示在分頁文章之中 (即首頁不顯示)。這樣不只能夠在頁面設計保留更多彈性，也有一些優點：
1. 配合分頁性質，來減少讀取不必要的元件，使得網頁顯示更有效率。
2. 作者可以更有效控制「給瀏覽者」的首要資訊。
3. 讓介面更清爽。
可以參考「堯@部落格」的教學，是使用「修改 HTML」的方式進行元件修正的，因此提醒使用者在修改前最好先備份範本：
如何讓某些元件只在首頁 / 內頁顯示 [堯 @ 部落格]
如果跟我一樣，裝了一堆Page Elements，卻希望有些只出現在首頁，有些只出現在內頁，那這篇文章就可能是你所需要的。這個作法是利用修改HTML TEMPLATE的作法來作，然而可能會有些人不小心改錯了，而改錯的風險很大，所以建議先行備份，這樣至少還可以還原回去。
首先點選範本，然後點選修改HTML，最後把「展開小裝置範本」打勾。然後找到你想要修改的元件。然後找到includeable的標籤，在下上各加入一行，修改如下：
<b:widget id='HTML1' locked='false' title='訂閱服務' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType != "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>
只在首頁及搜尋頁顯示：
cond='data:blog.pageType != "item"'
只在內頁顯示：
cond='data:blog.pageType == "item"'
而 Abin 的教學算是進階版的，因為不只可控制文章分頁與首頁部份，甚至可以設定條件在 Archive 存檔頁面或 Label 標籤分類頁面：
讓側邊列 (Sidebar) 的元件只在首頁顯示/不顯示 [Abin's Tech Note]
Blogger 頁面旁邊的 Sidebar 可以加掛很多模組，但是只要塞入一個元件 (Element)，在任何頁面就都一定會出現。如果在某些條件下，特定元件可以選擇顯示或不顯示，一方面畫面也可以更清爽，少讀了某些元件網頁顯示也會更快更有效率。方法很簡單，只要在元件原始碼的外面加入 if 的條件判斷句，「當在什麼頁面的時候」，才會顯示元件的內容，就可以達到這個目的了。下面整理修改的範例，還有幾個常見的判斷條件。
事實上這算早期的 Blogger 基礎教學了，我是以書籤收集的想法來進行分享，歡迎網友討論。
這是篇不專業教學文啦，因為我也是剛學會的。（笑）
我想修改版面的相關問題還是要請教其他高手才行。在之前，我發現到部落格的文字段落有些問題，可能因為全型半型的關係，或是符號的增加，或是英文數字的字數排列問題，導致文字段落呈現鋸齒狀，長短不齊的問題。例如下圖是《官幣大社台灣神社》一文的「台灣神社始於西元 1901 年興建於劍潭山...」段落。段落長短不齊的現象，不只網頁設計上不夠美觀，也可能造成讀者閱讀上的困難。
這時候就好想要有 Word 的「左右對齊功能」。
請教網友之後，才知道增加「左右對齊功能」還蠻簡單的：首先
(1)打開「修改Html」的頁面，
(2)在當中尋找到「post」的元素中，增加：
text-align:justify;
text-justify:inter-ideograph;
最後，按下儲存之後便成功了。可以試試看頁面是否變成「左右對齊」的樣子。這樣不只排版美觀，也降低讀者閱讀的障礙。我個人覺得這個修改倒蠻實用的。
之前我還發現到部落格的「sidebar」部分的文字似乎太過擁擠。因此我在「sidebar」當中增加：
letter-spacing: 1.5px;
「letter-spacing」的使用是要讓部落格的文字調整出一點點距離，減少文字之間的擁擠感，讓讀者可以好讀一點。部落格在版面上的一點小用心，希望的是可以增加訪客瀏覽文章時的舒適感，個人感覺非常實用因此和大家分享喔！還有其他奇怪的想法也可以討論看看。
今天 (6/28) Blogger in Draft 一次發表了許多新功能，可以參考《Updates and Bug Fixes for June 26th》這篇文章。其中我認為最需要以及最有用的功能有兩個：
Embedded Comment Form:稱作「已內嵌下列文章」，就是直接在文章內嵌入回應區塊，而不必像之前的 Blogger 樣式另開視窗。
Import and Export:部落格存檔匯入和匯出功能。將部落格內的文章和回應以 XML 檔案匯出，並得以將檔案匯入部落格內。
Blogger 原來預設的回應樣式是必須新開視窗的，對於 Blogger 的使用者來說，因為習慣而不太有使用上的障礙，但是由於這樣的回應文章格式不同於台灣多數的部落格平台，所以會造成其他使用者的不習慣，我就有遇到這種留言障礙的情形，所以這次 Blogger 的新功能實在是太受用了，雖然新功能的格式我還是有點不滿意。(因為使用介面依舊和台灣多數部落格平台不同)，但是不得不承認這是一大進步。
如果本來就使用 Blogger 所預設提供的模板的，原則上只要在「設定」中的「意見頁面」修改「意見表單位置」這個選項就好。但是如果模板經過個別修改或設計的，就必須手動修改了。
關於手動修改的 (就是選了「已內嵌下列文章」選項還是跑不出新功能的)，可以參考「小 Ken 思路不轉彎」的《Embedded Comment Form 和 Star Ratings 安裝》與「山頂秘密基地」的《如何把 Google Blogger 的意見表單內嵌於文章之中》兩篇文章。
Blogger 的文章備份問題雖然可以用某些方法匯出，可是總是感覺不方便與麻煩，Import and Export 功能似乎可以用來彌補部落格備份這個問題。所以對我而言也感覺有相當的重要性。
當初選擇 Blogger 作我的部落格平台，即是看中它的零廣告與自由性，沒想到 Blogger 的成長彈性也相當突出 (雖然有時候感覺新功能更新有點慢)，這會讓許多使用者對於 Blogger 的依賴與使用忠誠又加深了不少呀。因為，可以明顯地感受到 Blogger 團隊的成長與開發企圖心。這點對於使用者的信任感來說有相當的影響性。
如果想要新增新功能，可直接登入 Blogger in Draft 作新增 / http://draft.blogger.com/home
相關閱讀
在文章內直接發表意見,不用換頁了! [Fun New Run High]
Draft Blogger(blogger 用來測試新功能的網站)目前正在測試一些新功能,其中有項功能令人振奮,就是可以直接在文章頁面留言了! 這項功能在目前的blogger還沒開放,必須從Draft Blogger登入,直接設定。
，或跟隨：Follow @weihsi