2007/06/24

在blogger首頁每篇文章中加入黑米(HEMiDEMi)按鈕




繼介紹過加入digg,推推王(FunP)"推文按鈕"到blogger後,黑米也有"推文按鈕", 同樣可以加在部落格文章中, 顯示這篇文章目前已有多少人推薦, 而且如果有黑米的帳號, 還可以直接推文.

要如何在blogger加入這個按鈕呢?

只要貼上一段程式碼就可搞定!除了可以在首頁每篇文章都顯示各推文數外, 也可以顯示在單篇文章.


加入程式碼之前,先記得備分一下template.
然後,選範本-->選修改HTML-->勾取 展開小裝置範本(一定要勾取,否則無法加入在每篇文章內)

1.找到這段code
<p><data:post.body/></p>

這行程式碼代表文章內文.

2.如果想放在文章右側,在<p><data:post.body/></p> 之前, 加入以下程式碼.(注意: 如果不只一處, 就都要放在這行程式碼之前)
<div style='float:right;margin-left:10px;'>
<script type='text/javascript'>
HEMiDEMi_Bookmark_Button_URL = &#39;<data:post.url/>&#39;;
HEMiDEMi_Bookmark_Button_Title = &#39;<data:post.title/>&#39;;
</script>
<script src='http://js.hemidemi.com/javascripts/hemidemi_bookmark_button.js' type='text/javascript'/>
</div>


3.如果想放在文章左側,在<p><data:post.body/></p> 之前, 加入以下程式碼.
<div style='float:left;margin-right:10px;'>
<script type='text/javascript'>
HEMiDEMi_Bookmark_Button_URL = &#39;<data:post.url/>&#39;;
HEMiDEMi_Bookmark_Button_Title = &#39;<data:post.title/>&#39;;
</script>
<script src='http://js.hemidemi.com/javascripts/hemidemi_bookmark_button.js' type='text/javascript'/>
</div>


效果如下,


4. 如果要橫式按鈕, 就在HEMiDEMi_Bookmark_Button_Title = &#39;<data:post.title/>&#39;;之後, 加入下述這行程式.
HEMiDEMi_Bookmark_Button_Style = 'button1';

效果如下,


相關文章 :

20 comments:

Ben 提到...

很受用的教學,我也在自己的Blog上成功的加上黑米了!!

星子 提到...

好巧!我也是剛剛加好!

Skyvee 提到...

Ben, 謝謝你的留言, 很高興有幫上忙. :)

Skyvee 提到...

星子,

謝謝你的留言. :D

Lica Tsai 提到...

好讚,我正慢慢研究你提供的一些小東西中,
十分受用啊~! 感謝你!! 值得推薦的好地方!我在我的網站也推推推了你家唷~!

Skyvee 提到...

Lica 謝謝你, 我也想去你家坐坐, 如果你方便留下網址的話.. :)

異塵行者 提到...

決定要開始為文章增設按鈕功能了,謝謝你這邊的教學啦^^受用無窮。

Skyvee 提到...

異塵行者終於要新增按鈕啦!這樣以後要推您的文章,步驟就可以省多啦!對大家也是個好消息啊! XD

不要這麼說, 能夠幫到忙, 或是跟大家一起研究,我自己也受用無窮哩! 我才要謝謝大家的意見回饋啊!

stevenwin 提到...

我是剛加入blogger的新手,看了你的step-by-step教學,很容易上手,我終於加好了黑米,真是感謝呀~

Skyvee 提到...

stevenwin,謝謝你的留言. 有空歡迎常來坐坐.:)

LLY 提到...

謝謝你的教學,我也成功了!並且在blog中建立連結,希望你不要介意,好站要告訴大家!

Skyvee 提到...

lly 感謝你的留言及連結. :)

tzuche 提到...

謝謝你,我紀錄一年自助旅行的網站,因著你的教學,變得更加生動。

Skyvee 提到...

漢斯您客氣了!剛讀了漢斯的許多文章, 應該要謝謝您願意分享您自助旅行中,所走過,看到,聽到的及一般人看不到的事物. 讓我們知道要珍惜當下擁有的.

tzuche 提到...

hi, Skyvee, 您的部落格我會常來挖寶的,也會介紹給有需要的朋友,我也會把我旅行中的一些資訊記錄下來,給有需要的人。 thanks again!
tzuche

Skyvee 提到...

漢斯,
能夠透過你的文章,跟著你到世界的角落走走,並且用不同角度解釋人生,這也是我們的福氣呢!也謝謝你的願意分享!

我們一起努力吧! ^^

I'm xiren 提到...

我在范本里 找不到 這段code
:(

Skyvee 提到...

xiren,新範本裡,要把前後<p> 移除<p/>,
找這行code.<data:post.body/>

(記得全形<要先換成半形<)

weboss.tw 提到...

謝謝站長的教學,可以另外請教 如何放上 udn書籤的按鈕嗎?
謝謝喔

Skyvee 提到...

weboss,

方法應該都是一樣的,udn 書籤的語法在這(http://bookmark.udn.com/paste.jsp).

張貼留言

謝謝您願意在此分享心得, 讓文章內容更豐富.