Blogger最新推出「New Share Buttons」分享按鈕,超有質感!

玩樂家 | 6/27/2010 | | | Share on Facebook
本文 由 玩樂部落格大全 發布!文章引用須遵守 引用須知 ,轉貼時請勿刪除本行! 終於脫離用外掛來分享的日子了~~Blogger終於推出 「New Share Buttons」分享按鈕,雖然現在只支援Google Buzz, Twitter, and Facebook... 本文玩樂部落格大全發布!文章引用須遵守引用須知,轉貼時請勿刪除本行!

終於脫離用外掛來分享的日子了~~Blogger終於推出「New Share Buttons」分享按鈕,雖然現在只支援Google Buzz, Twitter, and Facebook等等而已,但是在官方部落格BUZZ中「buzz.blogger」承諾以後會陸續加入更多分享服務(不知道台灣國內慣用的分享書籤也會不會加入?)讓讀者可以點一下圖示就可以把你的好文章推給朋友知道!



一、設定顯示「New Share Buttons」分享按鈕
資訊主頁=>設計=>網頁元素=>網誌文章,然後按下編輯就會跳出設定頁面,勾選「顯示分享按鈕」之後,再按下儲存就會顯示了喔~~


下圖是設定好的「New Share Buttons」分享按鈕,如果你想要分享一篇文章的時候,只要滑鼠指標游過欲分享的服務,像Facebook,則Facebook的圖示就會從灰色變成彩色 ,而且分享按鈕設計很有立體感,多層次的變換顏色,還滿有質感的。分享按鈕中的Facebook圖示點下去,就會連到Facebook,登入後就可以進行推文、分享了!




二、設定好了還是沒有顯示「New Share Buttons」分享按鈕
這可能你不是使用官方樣式模板或模板內沒有相關程式碼,只要加入一段設定程式碼就可以顯示出「New Share Buttons」分享按鈕!
資訊主頁=>設計=>修改 HTML=>勾選展開小裝置範本修改前還是請先備份!這裡
然後你就可以搜尋下方裡面會有一段程式碼,其中line-1或line-2(數字不一定)都可以試試看。


<div class='post-footer-line post-footer-line-1'><span class='post-labels'>







下方的「New Share Buttons」分享按鈕 的設定程式碼放在剛剛找到的程式碼之後就可以了喔~
<div class="post-share-buttons"><b:include data="post" name="shareButtons"> </b:include></div>






三、如何在分享按鈕前加入說明文字標題?
只要在「New Share Buttons」分享按鈕 的設定程式碼前,加入你想要顯示的文字
想要顯示的文字<div class="post-share-buttons"><b:include data="post" name="shareButtons"> </b:include></div>



就可以如下圖顯示出來







雖然現在只載入國際上常見的分享服務,不過相信未來有一天,Blogger應該會把台灣國內常見的分享服務加入,就耐心等待吧~

引用來源



Share on Facebook

歡迎幫我們在玩樂家粉絲團點個讚!獲得最新好文!

玩樂家歡迎你加入我們,Google +1獲得最新好文!
Related Posts Plugin for WordPress, Blogger...

6 則留言 :

  1. 您好~我想請問一下
    如果我用的模板連你提供要找尋的那段原始碼都找不到的話,
    我應該把他貼在哪裡才可以正確顯示呢??
    我想放在文章最下面,Email分享圖示的旁邊,
    謝謝~

    回覆刪除
  2. TO 尼扣
    請把「New Share Buttons」分享按鈕的設定程式碼貼在

    <*div class='post-footer-line post-footer-line-3'>
    <*span class='post-location'>

    之後看看(請把*去掉)。

    位置請到資訊主頁=>設計=>網頁元素=>網誌文章,然後按下編輯就會跳出設定頁面,從中拖曳分享按鈕至想要顯示的位置。

    回覆刪除
  3. hello!!你建議的這個方法我有試過~但還是沒有顯示耶~哈
    不過之後我亂貼貼在email post上面,且只有貼第二段語法就出現囉!還是很謝謝你的分享咧~^^

    回覆刪除
  4. To 尼扣
    恭喜你成功!如果你同意的話,可以讓本站在本篇文章新增你的成功經歷嗎?

    還有想請問你所講的第二段語法是
    <*b:include data="post" name="shareButtons">
    ?

    回覆刪除
  5. 謝謝您分享的訊息,讓套用外部 template 也能裝上這個分享按鈕

    回覆刪除
  6. 謝謝你分享!!終於成功了~~YAYAYAY~~~

    回覆刪除