除了官方(如 Facebook 和 Google+)按鈕之外,「系列分享按鈕」是一個很好、甚至重要的補充工具。系列分享按鈕之所以重要,是因為它能夠提供官方按鈕以外更多的選擇,方便讀者選擇慣用與喜歡平台來轉貼文章,甚至加入「稍後閱讀」,或者「友善列印」。這篇文章主要談「系列分享按鈕」的安裝 ,至於官方按鈕請見另外一篇。
(一)怎麼樣才是好的分享按鈕?
就我自己而言,好的系列分享按鈕,要有三個性質:
- 不佔面積,不會影響閱讀和版面
- 可以讓作者觀察按讚數據,以及追蹤數量變化
- 正確抓取分享的標題、圖示、與摘要
就 1 而言,ShareThis 安裝雖然方便,但它比較大而且位置不能指定,只能放在文章頁尾(footer,就是有作者、時間、標籤的那個小區塊)上方,無法放在頁尾裡面,所我沒有採用。就 2 而言,AddToAny 安裝也容易, 但從它不需要(也不能)註冊來看,似乎不能提供數據觀察與變化追蹤。就 3 而言,這是我為何捨棄原先 Blogger 分享按鍵的原因,因為它有時候抓取不到正確資料(不知道為什麼),例如每篇文章的「搜尋說明」--這是專門為文章所寫的摘要,不是文章第一段的截取--常常沒被抓到。
總體而言,能夠同時做到三項的,我找到的只有 AddThis。不過,就在我裝完的幾天之後,AddThis 的官方頁面忽然改版,導致目前能夠得到的按鈕 HTML 語法過於簡化,無法讓我們自訂「分享時的網頁連結」。也就是說,新的按鈕只會抓取當時所在頁面的網址,這會導致當按鈕出現在首頁的時候,每篇文章各自的按鈕按下去都是分享你的「部落格首頁」而不是「單篇文章」。(如果你只打算讓按鈕出現在單篇文章之中,這就不是什麼太大問題。)
所以,我在這裡不只提供安裝教學,也會提供舊版 HTML 語法。
(寫到這裡,慶賀一下:世足,我正在留學的國家荷蘭 5:1 大勝西班牙!一雪四年前冠軍戰之敗。我所在的城市,路上塞滿汽車,荷蘭人狂按喇叭…)
(二)安裝 AddThis 的第一步:申請 AddThis ID
有了 AddThis ID,按讚與分享狀態才能被追蹤,也才有「報表」可看。請先到 AddThis 的首頁,右上角點點選 Sign In,請直接選擇右上角的 Create Account 申請一個帳號,因為就算直接使用社交網站帳號,登進去以後它還是會要你填寫 email 等資訊。
登入以後,請在右上角的 My Site 下拉選單,選擇 Manage Profiles。然後就會看到以下畫面,其中的 Profile ID 就是我們要記下來的號碼。需要的話,可以點進 My Site 做出更多細節選項,例如是否寄送報表到信箱、或者改變 Profile 名稱。也可以點選 Add Profile 增加 ID,如果你有多個部落格的話。
(三)安裝 AddThis 的第二步:調整按鈕語法
按鈕的語法如下:
<!-- AddThis 分享按鈕 begin -->
<div class='addthis_toolbox addthis_default_style addthis_16x16_style' expr:addthis:title='data:post.title' expr:addthis:url='data:post.canonicalUrl'>
<a class='addthis_button_facebook'/>
<a class='addthis_button_google_plusone_share'/>
<a class='addthis_button_twitter'/>
<a class='addthis_button_linkedin'/>
<a class='addthis_button_plurk'/>
<a class='addthis_button_instapaper'/>
<a class='addthis_button_compact'/>
<a class='addthis_counter addthis_bubble_style'/>
</div><script type='text/javascript'>
var addthis_config = {"data_track_addressbar":true};</script>
<script src='//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-5391ffb35b3263aa' type='text/javascript'/><!-- AddThis 分享按鈕 end -->
橘色部份表示讀者按下按鈕的時候,AddThis 會自動抓取你的文章連結,所以即使首頁中的每篇文章都出現這些按鈕也沒有關係,它們會各自連到獨立的文章。藍色部份表示按鈕尺寸,目前有三種,16x16、20X20、32x32,可以自行選用適合的。紅色部份請換成你剛剛得到的 ID 號碼(如果你沒有改,那所有流量都會算到我這裡來…)。
粗體部份,則是按鈕名稱,基本上,只要 AddThis 有提供的按鈕,都可以被加進這裡,要幾個都可以。那麼 AddThis 有提供哪些按鈕呢?請在 AddThis 首頁選擇以下紅框,然後點選 select your own,接著就會看到 Available Services 有一堆按鈕可選。把你喜歡的按鈕名稱記下來,放進「<a class='addthis_button_按鈕名稱'/>」這個語法就可以了。按鈕如何排序,也以上下搬動這串語法來進行調整。
注意:按鈕名稱必須全部小寫
(四)安裝 AddThis 的第三步:放置按鈕
最後一個步驟,就是把它放到你希望的位置。我的建議是放在文章頁尾,因為系列分享按鈕通常很長,如果放在標題下方,容易干擾讀者注意標題。而且…如果讀者光看標題就馬上分享,好像也不是這麼「真誠」吧。我放的位置,是文章頁尾的第二區塊。方法如下:
進入「編輯 HTML」,搜尋「<div class='post-footer-line post-footer-line-2'>」,會有兩行,請用第二個,把整段 AddThis 按鈕語法加在此行下面,這樣就可以了!數字 2 就是區塊位置,所以也可以找 1 或 3 的語法段落擺放,就看你打算如何安排位置。以我而言,因為第一區塊放置官方按鈕(點進單篇文章才會出現),第三區塊則是文章資訊(作者、時間、標籤),所以就把 AddThis 放在中間了。
(不太會尋找 HTML 語法的新手,請參考本系列的第一篇文章。)
身為部落格作者,我們可以提供方便、不干擾、而且有利統計的系列分享按鈕,讓讀者在喜歡和欣賞我們作品的同時,能夠快速且容易地分享、增加文章的被閱讀率。同樣地,作者也常常是讀者,所以當我們看到好文的時候,也要不吝惜點擊與分享喔!