August 7, 2011

How to Remove Google +1 Button from Blogger Share Buttons




Standard Blogger share buttons let your readers to share your post with their friends and interested parties. As Google +1 platform evolves on the web, Blogger also added Google +1 button with their share buttons to let readers to recommend your posts. Now you may need not to add Google +1 button for your blog posts explicitly if you are enabled to show share buttons on your post footer. But if you already wanna show Google +1 button elsewhere on your post pages, you would like to get rid of +1 button appears with Blogger share buttons. But how do you remove only +1 button while having other share buttons?

You may use or not using share buttons with your posts. But however following method will be advantageous for you on the aspect of increasing page load time or reducing page size if you are seeking performance improvement on your blog. Else this +1 button will add you extra weight on page load time or page size.

Before You Go:

If you looking for removing whole set of share buttons from your post footer, then read Customize Post Footer in Blogger.


Steps:


2. Click on your Blog Title.

3. Navigate to Template tab.


Note: Before editing your template, you may want to save a copy of it. Read How to Back Up Your Template.

4. Click on Edit HTML button.


5. Tick on, Expand Widget Templates.


6. Now find below code snippet in your template.

<div class='post-footer-line post-footer-line-2'>
<b:if cond='data:top.showMobileShare'>
 <div class='mobile-link-button goog-inline-block' id='mobile-share-button'>
  <a href='javascript:void(0);'><data:shareMsg/></a>
 </div>
</b:if>
<b:if cond='data:top.showDummy'>
 <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
</b:if>
</div>

7. Instead of removing, the best option is to leave the code snippet commented. Then you can enable it back when you need.

Just add <!-- at the beginning of above line and --> at the end of line, as depicted in below example - or you can replace above code snippet with below.

<!-- <div class='post-footer-line post-footer-line-2'>
<b:if cond='data:top.showMobileShare'>
 <div class='mobile-link-button goog-inline-block' id='mobile-share-button'>
  <a href='javascript:void(0);'><data:shareMsg/></a>
 </div>
</b:if>
<b:if cond='data:top.showDummy'>
 <div class='goog-inline-block dummy-container'><data:post.dummyTag/></div>
</b:if>

</div> -->

8. Now Save template and Preview your blog for changes.

Enjoy :-)




Awesome! Thanks for coming by and taking your time to read this post :) I hope you have learnt something today. Now you can share it with your friends and I'd love to hear from you too.






Related Posts and Categories


Category, , , , ,





Comments

* If you got any questions not related to this post, please ask it at our Support section.

* Make sure your comment is genuine and comply with our commenting guidelines.

* Review your email and reply notification settings to receive replies via email.

* Experiencing problems when commenting? Please report them at our Support section.