Element XD lab
哥教的不是CG,是偷雞
快速導引

【Blogger + G+】在文章頭尾安裝『Google +1』按鈕


想要新增Google+1的按鈕,以Blogger預設小工具可以很輕易地做到,不過方便帶來的限制,是只能安排在整個網頁的固定位置,而且是對整個網誌+1。


如果我們想為個別文章加上這個按鈕,其實也很簡單,以下用官方說明檔案來做示範。


首先到這邊找到一段語法
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>


請到範本編輯HTML







搜尋"post-header-line-1",預設版本有兩個結果,請到第二個搜尋結果


把中間那一行拆成兩行,就是刪除最後面的斜線"/",下面加一行"</div>"


把文章前面Google+1按鈕的語法塞在中間



儲存範本,檢視網誌,按鈕已經在文章標題下方了





若要更換尺寸,請在<g:plusone></g:plusone>加上尺寸語法"size="如下圖


可以挑選的尺寸,分別有small, medium, standard 以及 tall,看需求,這邊為了之後跟另外兩個按鈕看起來差不多大,選擇medium



同時,如果只希望在文章的頁面才露出按鈕,首頁保持乾淨清爽,可以在Google+1按鈕語法前後加上判斷式。
<b:if cond='data:blog.pageType == &quot;item&quot;'>
</b:if>
如下圖



要放在文章尾端也是一樣

請搜尋"post-footer-line",以預設範本來說,應該要有"post-footer-line-1""post-footer-line-2""post-footer-line-3"三行,分別代表這三個位置:快速編輯小鉛筆,5意見,標籤,可以選擇自己喜歡的位置來放。


不過奇怪的(我還沒弄懂的)就是,搜尋結果會有兩個"post-footer-line-1", "post-footer-line-2",我發現也是在第二個"post-footer-line-1"才有作用,就在我們剛剛使用的"post-header-line-1"下面幾行

將上面語法整段連同判斷式一起拿來放這邊就可以了。





完工~
技術提供:Blogger.

聯絡


聯絡表單

名稱

以電子郵件傳送

訊息

© thephilko.com All Rights Reserved