Blogger 修改「G+ 追蹤者」小工具的版面及編輯按鈕

Blogger 最近推出顯示 G+ 追蹤者的小工具，有人的反應是與 Google Freind Connect 的性質重疊，而 G+ 專頁也會顯示追蹤者頭像，如果再加上這個小工具，那版面真是好不熱鬧。

目前我暫時在網頁上只擺這個 G+ 追蹤者的小工具，可以裝作看起來很有人氣的樣子(XD)；但是才剛裝上後便發現他會超出邊界，弄了一陣才瞭解到可能因為本站並非使用新範本，blogger 已經懶得測試這些老用戶的環境，如果是裝在新範本就不會有這個 bug 了。

而這陣子逛到不只一個部落格把這個小工具放在頁面底部，可能是發現放在側邊欄會超出邊界，所以才將位置挪到底部吧！或許會跟這個小工具不合的部落格，還是有一定的數量，若有以上情形的話，可參考以下我的修改方式──


一、修改版面尺寸



1. 到 Blogger 後台打開範本文件 → 編輯 HTML → 自訂 → 調整寬度 → 記下自己側邊欄的寬度，以我自己為例是 320 像素。

2. 接著：範本 → 編輯 HTML → 搜尋「PlusFollowers1」字串

3. 找到這個小工具區塊後，往下幾行找到「expr:data-width='data:width'」這個字串，將他置換為 「data-width='300'」這樣的格式即可。300 請改為適合自己版面的像素值，比第 1 點查到的寬度值少個 20 應該會差不多。

4. 如果還想改高度，可在同一行找到「data-height='300'」，將 300 改為自己想要的高度像素值即可。

以上動作完成後按儲存，這個小工具應該就不會超出邊界了，如下圖所示。




二、增加編輯按鈕

如果仔細看上圖的話，會發現右下角有點玄機。 Google 推銷 G+ 的小動作很多，一般來說 blogger 小工具的右下角都會附上編輯小按鈕，偏偏這個 G+ 追蹤者小工具就是不附編輯按鈕，讓你除了無法隨時編輯標題，也不能想移除就移除。

如果跟我一樣，也想替這個小工具加上編輯按鈕的話，請按以下步驟：

1. 後台範本 → 編輯 HTML → 搜尋類似以下程式碼(其實就是在「一、修改版面尺寸」程式碼的下一行)──

<script type='text/javascript'>
(function() {
window.___gcfg = {'lang': '<data:language/>'};
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = '<data:plusOneApiUrl/>';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
</b:if>
</div>

2. 緊接在上面程式碼的後一行，插入以下程式碼：

<b:include name='quickedit'/>
存檔後即可看到這個小按鈕了。

更多 Blogger 小技巧：