www.flickr.com

5/26/2007

「教學」黑米小按鈕在 Blogger 上的置放方法

HemiDemi 黑米網摘網站,最近推出了「黑米小按鈕」的功能,這段 javascript 語法可以讓部落格站長將語法寫入到版型或是文章中,這樣假如有人收錄這篇文章在黑米網站上,你的部落就會顯示有多少人收藏你的文章,並有多少人討論你的文章。

這是一種很方便的跨網路社群模式,之前 CK 寫了兩個外掛模組
HEMiDEMi Scriptlet - 誰在背後講我?
HEMiDEMi Scriptlet - 誰收藏本文?
都是類似的工具,CK 寫的還包括了大頭貼的顯示,看起來非常有趣,而黑米自家的則是非常清爽,將收藏和討論的數字一併顯示,大家可以依照需要各取所需。

小梅子的 Blog 架設在 Google 的 Blogger 平台上,它的樣板稍微複雜一點,小梅子想或許也有別人想知道怎麼將黑米小按鈕放在 Blogger 上面,所以有這篇簡易教學。

先看看不同的位置效果。

這是將黑米小按鈕放在每一篇文章的結尾,回應的前面,黑米小按鈕的語法請直接取用,問題是這個要放在 Blogger 板型的哪裡。

要搞懂這個,請先了解目前 Blogger 的板型模式有分新版和舊板兩種,小梅子這邊的教學是針對新版的,假如你還在舊板的 Blogger,請自行先升級到新版,新版的好處多了不少,包括了 Tag 等的使用,會更靈活。

但老實說,新板的要修改板型也更難一些。

在登錄了 Blogger 後台以後,請找到【範本】下的【修改 HTML】的選項。

這裡請注意,這邊有一個【在編輯模版之前,您可以先儲存一份模版。 下載完整模版】的功能,請務必下載一份你現有的板型備份,這樣假如不幸手賤搞砸了,還可以完整回復先前的設計。

然後右方有一個【展開小裝置範本】的選項,請打勾,這樣下方的板型模組碼,才會完整的顯示出來。

接下來的動作要頭腦清晰點 :P

請在這一串板型模組碼中,找到
<b:includable id='comments' var='post'>
這一句,然後將黑米小按鈕的語法放在後面。

整體看起來就會像是這樣:

<b:includable id='comments' var='post'>
<script type="text/javascript">
HEMiDEMi_Bookmark_Button_Style = 'button1';
</script>
<script src="http://js.hemidemi.com/javascripts/hemidemi_bookmark_button.js" type="text/javascript"></script>


點一下右下角的【儲存範本】,就可以收工看一下顯示的效果如何。

另外一個可以擺放的位置,是在文章回應的下方,再置放黑米小按鈕,這邊順便推薦一下 CK 寫的HEMiDEMi Scriptlet - 誰在背後講我?的黑米外掛語法,這樣就可以同步將黑米上面別人討論你的文章,也直接顯示在同一個頁面下,你就不用到處觀看,深怕哪邊忘了回應。

類似剛剛上面的做法,同樣,我們要在板型模組碼中,找一個叫

<b:if cond='data:blog.pageType == "item"'>
的語法,然後將黑米小按鈕,甚至 CK 寫的誰在背後說我兩組小語法都放在這個後面。

整體看起來就會像是這樣:

<b:if cond='data:blog.pageType == "item"'>
<script type="text/javascript">
HEMiDEMi_Bookmark_Button_Style = 'button1';
</script>
<script src="http://js.hemidemi.com/javascripts/hemidemi_bookmark_button.js" type="text/javascript"></script>
<script src='http://webdev.yuan.cc/scriptlets/hemidemi_comments.js'>
</script>


這樣你就會得到雙效合一的顯示效果了 :-)

有趣嗎吧,大家一起動手來玩黑米小按鈕吧 ^_^

16 則留言:

Rack Lin 提到...

Dear 小梅子:
請服用 "黑米小按鈕 加強版" 不用大改你的 template.
當然也支援首頁列表下的多文章的多按鈕功能.

http://racklin.blogspot.com/2007/08/blog-post_13.html

小梅子 提到...

to rack lin

行家一出手,便知有沒有啊,謝囉

讀書人 提到...

感謝您~~~我成功了!
謝謝您!

小梅子 提到...

to 讀書人 jameshung

恭喜你,希望你 Blogspot 玩的愉快 :-)

狐狸 提到...

謝謝你的教學喔~
我也成功了

不過我把你寫的第二個置放位置的黑米書籤語法移掉,因為在我的頁面上它就變成重複了,不太好看

真的謝謝了喔~

小梅子 提到...

to 狐狸兄

恭喜你也來玩黑米,不過加入黑米並不會「幫助你早日把到妹、以及讓教授愛你,論文過關」的喔,這些還是得自己努力啦,哈哈哈哈。

limonadagurl 提到...

不好意思喔...我沒有找到你說的語法ㄝ...你知道爲什麼嗎?

Corrina 提到...

你好...看到了你的教學
也找到了要把黑米放在後面的語法
可是....什麼都沒出現ㄝ
怎麼會這樣呢?
我對電腦真的有障礙
麻煩誰能幫我解答

小梅子 提到...

to corrina

我去看了你的部落
我有看到黑米的按鈕出現哩

Corrina 提到...

真的喔....
不過後來我姊姊幫我又試了很多次
終於成功了
呵呵~~謝謝你喔!!^^

皇后殺手鎮魂曲~ 提到...

Dear版大:

小弟也有個問題~
我一樣找到位置將語法放入了~
但在blog上還是看不到黑米小標籤~
請問版大知道原因ㄇ?

小梅子 提到...

to 皇后殺手鎮魂曲~

會不會是因為你的版型修改過了,所以導致黑米按鈕出不來?

皇后殺手鎮魂曲~ 提到...

Dear版大:

我是版型改變後才加入黑米小按鈕的~
但語法加入後還是看不到...= =
是否有需要注意的地方我沒注意到,還是......

aiyipianni 提到...
網誌管理員已經移除這則留言。
aiyipianni 提到...
網誌管理員已經移除這則留言。
Lawrence 提到...

Dear 小梅子,

看到您的blog,FunP是放在每篇文章的最前面.
所以請問如果要放在每篇文章的最前面,FunP或黑米語法要放在版型那邊呢?? 謝謝.