2011年11月8日

為Blogger加入Google Plus(Google+) +1按鈕


 
前一篇介紹了為Blogger嵌入Facebook讚(like)與留言(comment)外掛及留言管理功能
同樣基於為了應用廣大社群力量,這篇也來介紹一下如何插入 Google Plus +1按鈕。

更多外掛如相關文章推薦輪播、部落格廣告賺錢、社群網站外掛等,請見總整理文章:
Blog Plugins:部落格外掛大全整理,什麼都有、什麼都不奇怪


大部份的步驟都和前一篇差不多,所以這篇只會有簡單的教學,
若有不知道該將程式碼插到何處,或是如何開始修改 blog 的 html 碼,
一樣請先請參考:為Blogger嵌入Facebook讚(like)與留言(comment)外掛及留言管理功能

加入 +1 按鈕和前一篇比起來簡單許多。
第一步:進入 +1 按鈕 網頁,填入相關參數。
  1. 大小、語言就自己選擇吧。
  2. 進階選項中的「加入計數」、「剖析」用預設即可,
    JavaScript Callback 函式若沒有要特別寫 JavaScript 也不用填。
  3. +1 的網址填入的值會出現在 href 的屬性值中,但不填也沒關係,google會自動幫你抓到當前的頁面。查了一下相關的資料,附在下面供大家參考:
    https://developers.google.com/+/plugins/+1button/#target-url 中提到這段:

    1. The button's href attribute 
    This attribute explicitly defines the +1 target URL.
    2. The page's  tag
    If the +1 button's href attribute is not provided, Google will use the page's canonical URL. For more information on defining the canonical URL for a page, see this help article.
    3. The URL provided by document.location.href (not recommended)
    If neither of these pieces of data are present, Google will use the URL of the page as found in the DOM. Because this URL might contain session IDs, anchors, or other parameters that are not actually part of the canonical URL, we highly recommend either setting the href attribute for the +1 button or adding a  tag to your page.

    其中第一點就是要填 href 的值,我不確定在 google plus 這邊有沒有和前一篇一樣可以使用expr:href='data:post.url'的做法,若有的話請留言告知。第二點的話除非你有許多類似的網頁不然也用不到。第三點就是不填 href 的值,雖然他寫 not recommended,但對 Blogger 用戶而言 url 中不會有下面提到 session IDs, anchors, or other parameters 的情況,所以還是可以用這個就好。

    而且在最下面的 F&Q 也是建議這個做法,所以+1 的網址這欄就留空吧!
    Do I need to use the href attribute?
    The href attribute is not required. See +1 target URL for more information
第二步:將剛剛產生出的 code 插入適當的位置。
產生的 code 應該類似這樣:

其實他的說明也很清楚了,
第一段放在 <head> 後 </body> 前,我都直接放在 <head> 後。
第二段可參考前一篇 Facebook 放讚的位置插入即可。
結果就會像下面這樣啦,簡單吧!

Social Plugins 系列文連結總整理:
  1. 為Blogger嵌入Facebook讚(like)、寄送分享(send)與留言(comment)外掛及留言管理功能
  2. 為Blogger嵌入Google Plus(Google+) +1按鈕
  3. 為Blogger嵌入Facebook建議(Recommendations)和最新動態(Activity Feed)外掛,推薦輪播熱門文章與互動
  4. Facebook Insights:精準行銷掌握Social Plugins(讚、留言、分享)統計資料與擴散狀態
更多外掛如相關文章推薦輪播、部落格廣告賺錢、社群網站外掛等,請見總整理文章:
Blog Plugins:部落格外掛大全整理,什麼都有、什麼都不奇怪

關鍵字:Blogger, Google, Plus, One, +1, button, 按鈕, 外掛, google+, g+
參考資料:


更多精選推薦文章