WELCOME TO EHOST.COM.NP

Thursday, July 8, 2010

How to Enable Official Share Buttons in Blogspot/Blogger Templates

ads space

Blogger has officially announced sharing buttons. These buttons let your readers share posts on social networks like Twitter, Facebook & Google Plus. These sites bring traffic and are important for search engine rankings. The great thing is that the share buttons automatically shortens post URL/address because Twitter allows only 160 characters per tweet. In this post, I'll explain how you can enable official share buttons.

First, Enable the Share Buttons!


Enabling share buttons under Blogger posts is very easy. Just go to Layout. Edit the Blog Posts gadget and enable Show Share Buttons option. Click the following image to see full size:

What to Do If Share Buttons Do Not Appear?


If you're using an old template then there is a chance that share buttons won't show up even if you've enabled them. So follow these steps:
  1. Open the Template section.

  2. Blogger Updated Dashboard
  3. Click the Edit HTML button.

  4. Blogger Edit HTML Button
  5. A new window will open. Click the Proceed button to start editing.

  6. Blogger Proceed Button
  7. Check Expand Widget Templates option. The page will automatically refresh.

  8. find this code:
     
    and REPLACE it with the following code:
     



  9. That's it. Click Preview button and you will see share buttons right under the post body. After that, save your template.


Important: After saving the template. Make sure that the buttons are enabled in Blog Posts widget as described in the previous section of this tutorial.

How to Show Share Buttons Only on Post Pages?


By default, share buttons will appear on all pages. It might look a little messy and some people might want share buttons to appear only on post pages. To do that, you need to add a simple if-else condition. Instead of the above code, add this code after :





If you've any problem, feel free to leave me a comment.

Update! Share Buttons are Grey


Many of you guys are complaining that the share buttons are appearing in Grey color. Well, don't worry about that because that's how they should appear. I don't know any method (yet) to make them colored. By default, they are Grey and will only become colorful when you'll bring mouse over them.
ads space
ADS SPACE

0 comments:

Post a Comment

Categories

Article How-to All Posts WordPress Android Web design Blogger Plugins CSS Google JQuery Plugins Programming Reviews Web Hosting Blogger Blogging Blogging Tips Tricks Web Development Facebook Git Internet Make Money Online Social Plugins Tips Tips and Tricks Tools Tutorials Windows WordPress Plugins Blogging Tips and Tricks Freebies GSM Google Analytics HTML How To's JavaScript Plugin Development S.E.O SEO SMS SmartPhone Social Media Tips amp; Tricks Top-Most Updates Webmaster Tools Whatsapp Applications Apps Blogger Basics Documentary Downloads Entertainment Gadgets Games Gmail Google AdSense Guest Post IPhone Make Money Blogging SVN Security Softwares Web Hosting Tips and Tricks Wordpress Tips Wordpress Tips and Tricks hostgator iOS Advertising Networks Advertising Technology Affiliates Antivirus Audience amp; Traffic Biography Blog post Blog post Blogger Blogger Errors Blogger Tips Blogger Tools Blogger Widget Blogosphere Bogger Widgets CSS selectors CSS symbols CSS3 Computer amp; Internet Content Writing Coupon Codes Data amp; Analytics Deleted blog Design DoubleClick for Publishers Email and newsletter marketting Email marketing Excel Tips Excel Tips and Tricks Facebook Tricks Feed Feedburner Feedburner subscribers Font Fun GitHub Giveaways Gmail primary inbox Gmail tabs Google sign-in Guides HTML amp; CSS HTML5 Infographics Inspirational Instagram Internet Marketing Internet Tips amp; Tricks Job Listings Knowledge Life Hacks Lists Make-Money Monetization amp; Conversion Monetize Navigation Online Marketing Other PHP Tutorials Passport Publishing amp; Content Quotes RSS Sidebar Smartphones Social Networking Status Tech Tech Blog Technology Telegram Themes UI / UX User Psychology amp; Research VB.Net Web Tools Web browser Widget Windows Tips Windows-10 ad viewability admin notice blogging tools bluehost cherry-pick clone cors custom scrollbar customizer dismissible notices duplicate post feed title git branch git clone gpg gpg2 hybridauth iPad icon font notice responsive wordpress theme same origin policy scrollbar signed git commit smartsvn theme customizer vcs wordpress theme wordpress themes

Blog Archive