2012年12月17日

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

A+
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 小技巧:

沒有留言:

↑TOP

張貼留言注意事項:

◎ 勾選「通知我」可收到後續回覆的mail!
提問請附網址、詳細描述狀況,如提供的資訊不足,則無法回覆。
◎ 請在相關文章留言,與文章無關的主題請至「Blogger 中文論壇」。
◎ 若詢問 CSS 、非官方範本問題、或貴站為商業網站 ,請參考「本站諮詢頁面」→「1. 諮詢服務」
◎ 若留言要輸入語法,"<"、">"這兩個符號請用其他符號代替,否則語法會消失!
◎ 若發現留言不見了,通常是因為 "複製貼上" 的內容常被系統判定為垃圾留言,請不用擔心,我會定期將留言恢復。
◎ 本站「已關閉自刪留言功能」。