Thursday, February 18, 2016

[Teaching] How to edit or remove the google+ followers widget. 如何編輯或移除google+追蹤者小工具






















Have you been annoyed by the google+ followers widget? Once you added the google+ followers widget, you couldn't have removed or edited it anymore. Further, for you couldn't change its position or order, the web page of your blog is ugly and hard to have a concise look, especially it seems odd above the photo sticker.  Now, I am going to provide you a good way to edit or remove the google+ followers widget on your blog web page by teaching you the HTML/JavaScript code editing.

你是否被google+追蹤者小工具惹惱呢? 一旦你加了google+追蹤者小工具,就再也不能把它移除或是編輯了。而且你還沒辦法改變他的位置或是順序,頁面醜陋而且不精簡,放在大頭貼之上看起來更是怪異。現在,我要提供你一個好方法,透過修改HTML/JavaScript程式碼,你便可以編輯或是移除google+追蹤者小工具。

Remove the google+ followers widget  [移除google+追蹤者小工具]


Step one: Log in your Google Blogger account and go to the Blogger Dashboard. Choose the Template and then click the "edit HTML" button.

Step two: Use Ctrl+F to search a keyword, "PlusFollowers", in your HTML codes. As the above picture shows, you can find the word "PlusFollowers" with yellow color. This is the code to control and show the google+ followers widget.

第一步: 登入你的Google Blogger帳戶而且到管理後台,選擇Template範本並且按下"編輯HTML"按鈕。

第二步: 在你的HTML程式碼中,用Ctrl+F尋找"PlusFollowers"這個關鍵字。如同上述圖片顯示得,你可以找到PlusFollowers這個被黃色亮出的字,這就是控制和顯示google+追蹤者小工具的程式碼。

















Step three: Click on the two black triangles to open line 1964 and line 1965 and you could see the following codes which are in the purple square.

    <b:widget id='PlusOne1' locked='false' title='+1 Button' type='PlusOne'>
    <b:includable id='main'>
    <div class='widget-content'>
    <g:plusone expr:annotation='data:annotation' expr:href='data:blog.canonicalHomepageUrl'          expr:size='data:size' source='blogger:blog:plusone' width='250'/>
    <script type='text/javascript'>
      window.___gcfg = {&quot;lang&quot;: &quot;<data:language/>&quot;};
    </script>
    </div>
    </b:includable>
    </b:widget>
    <b:widget id='PlusFollowers1' locked='false' title='Google+ Followers' type='PlusFollowers'>
    <b:includable id='main'>
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
     <b:if cond='data:profileUrl != &quot;&quot;'>
      <div class='g-plus' data-action='followers' data-source='blogger:blog:followers' expr:data-height='data:height' expr:data-href='data:profileUrl' expr:data-theme='data:theme' expr:data-width='data:width'/>
       <script type='text/javascript'>
        window.___gcfg = {&#39;lang&#39;: &#39;<data:language/>&#39;};
       </script>
       </b:if>
       </div>
       </b:includable>
       </b:widget>

Step four: Select and delete all of them and then click "save Template" button. It's done!

第三步: 點選line 1964和line 1965上頭的兩個黑色小三角型,接著你會看到以下這些在紫色框框裡的程式碼。

<b:widget id='PlusOne1' locked='false' title='+1 Button' type='PlusOne'>
    <b:includable id='main'>
    <div class='widget-content'>
    <g:plusone expr:annotation='data:annotation' expr:href='data:blog.canonicalHomepageUrl'          expr:size='data:size' source='blogger:blog:plusone' width='250'/>
    <script type='text/javascript'>
      window.___gcfg = {&quot;lang&quot;: &quot;<data:language/>&quot;};
    </script>
    </div>
    </b:includable>
    </b:widget>
    <b:widget id='PlusFollowers1' locked='false' title='Google+ Followers' type='PlusFollowers'>
    <b:includable id='main'>
   <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
   </b:if>
   <div class='widget-content'>
     <b:if cond='data:profileUrl != &quot;&quot;'>
      <div class='g-plus' data-action='followers' data-source='blogger:blog:followers' expr:data-height='data:height' expr:data-href='data:profileUrl' expr:data-theme='data:theme' expr:data-width='data:width'/>
       <script type='text/javascript'>
        window.___gcfg = {&#39;lang&#39;: &#39;<data:language/>&#39;};
       </script>
       </b:if>
       </div>
       </b:includable>
       </b:widget>

第四步: 把這些程式碼選起來並刪除,按下"儲存範本"按鈕,它就完成了!


Edit the google+ followers widget  [編輯google+追蹤者小工具]
















How if you want to change the order or position of the google+ followers widget, instead of removing it, then you could copy the HTML codes in the purple square and the paste them into wherever you want to show your google+ followers.

Step one: For it is more beautiful to be put beneath the Google +1 Button in the latest order for me, I recommend you can paste these codes under the codes of line 2117 to line 2129:
 <b:widget id='PlusOne1' locked='false' title='+1 Button' type='PlusOne'>...</b:widget>
or paste these codes just above the code of line 2145:
</b:section-contents><b:section-contents id='footer-1'/><b:section-contents id='footer-2-1'/><b:section-contents id='footer-2-2'/></html>

Step two: Click the "save Template" button and it's done!

那如果你是想要移動google+追蹤者小工具的位置或順序,而不是想刪掉他,那麼你可以複製在紫色框框裡的程式碼,把他們貼在讓你任何你想顯示的地方。

第一步: 我覺得把google+追蹤者小工具放在Google +1按鈕底下,並且整個側頁最下方,版面是比較漂亮的,因此我建議你在line 2117 到 line 2129的程式碼<b:widget id='PlusOne1' locked='false' title='+1 Button' type='PlusOne'>...</b:widget>之後,貼上你的程式碼;
或是直接在line 2145的程式碼</b:section-contents><b:section-contents id='footer-1'/><b:section-contents id='footer-2-1'/><b:section-contents id='footer-2-2'/></html>之上,貼上你的程式碼。

第二步: 按下"儲存範本"按鈕,那麼它就完成了!




You see; It shows beneath the Google +1 Button. It is not so that hard, right? Go and get it!
Welcome for reading ~

你看,它顯示在Google +1按鈕之後了。這沒那麼難對吧? 去試試看吧!


No comments:

Post a Comment